How to arrange docpanels like in the image ?

[raj]

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.

[Konstantina]

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