How to arrange docpanels like in the image ?

2 posts, 0 answers
  1. raj
    raj avatar
    31 posts
    Member since:
    Jul 2011

    Posted 28 Nov 2011 Link to this post

    Hi All,
    I have a requirement where i need to arrange doc panels as showed in the image, image is attached to this post please see once.
    there are three doc panels , two are arranged on top horizontal and one is arranged bottom stretched.

    Can any suggest xaml code to arrange panels.
    Thanks in advance.
  2. Konstantina
    Admin
    Konstantina avatar
    2332 posts

    Posted 29 Nov 2011 Link to this post

    Hello Raj,

    In order to achieve this layout, you need to write the following code:

    <telerik:RadDocking HasDocumentHost="False">
         <telerik:RadSplitContainer Orientation="Vertical">
            <telerik:RadSplitContainer Orientation="Horizontal">
                <telerik:RadSplitContainer InitialPosition="DockedLeft">
                    <telerik:RadPaneGroup>
                        <telerik:RadPane />
                    </telerik:RadPaneGroup>
                </telerik:RadSplitContainer>
                <telerik:RadSplitContainer InitialPosition="DockedRight">
                    <telerik:RadPaneGroup>
                        <telerik:RadPane />
                    </telerik:RadPaneGroup>
                </telerik:RadSplitContainer>
            </telerik:RadSplitContainer>
            <telerik:RadSplitContainer>
                <telerik:RadPaneGroup>
                    <telerik:RadPane />
                </telerik:RadPaneGroup>
            </telerik:RadSplitContainer>
        </telerik:RadSplitContainer>
    </telerik:RadDocking>

    You need to remove the DocumentHost, by setting the HasDocumentHost prorperty of the Docking control. Also, since the SplitContainers are measured and placed relatively, according to the sibling SplitContainers, in order them to be with equal sizes, they need to be put in a fourth, wrapping one.

    All the best,
    Konstantina
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  3. DevCraft banner
Back to Top