[Solved] Can't get panes to fill screen on load

[Mike]

I have been trying for days now to get the splitter panes to fill the screen when the page loads but seem to be dancing all around it.
I have attached 2 images 1 - Have.jpg is what the page looks like on load, 2 WouldLike.jpg is what I am trying to accomplish. I have played with height/width, horizontal/vertical properties, re-arranged the splitters etc and can't quite get it. Any help would be greatly appreciated. Below is my code:

<Grid x:Name="LayoutRoot">
    <telerikDocking:RadDocking x:Name="radDocking" HasDocumentHost="False">
        <telerikDocking:RadSplitContainer Orientation="Vertical" InitialPosition="DockedLeft">
            <telerikDocking:RadPaneGroup>
                <telerikDocking:RadPane Header="TOC" IsPinned="True" CanUserClose="False" CanFloat="False" CanDockInDocumentHost="False">
                    <telerikNavigation:RadTreeView x:Name="TreeViewTOC">
                    </telerikNavigation:RadTreeView>
                </telerikDocking:RadPane>
            </telerikDocking:RadPaneGroup>
        </telerikDocking:RadSplitContainer>
        <telerikDocking:RadSplitContainer Orientation="vertical" InitialPosition="DockedTop" >
            <telerikDocking:RadPaneGroup>
                <telerikDocking:RadPane Header="Book" PaneHeaderVisibility="Collapsed" CanUserPin="False" CanUserClose="False" CanFloat="False" CanDockInDocumentHost="False">
                    <Grid Background="AliceBlue">
                        <telerikNavigation:RadBook x:Name="RadBook1"
                                                   HorizontalAlignment="Stretch"
                                                   VerticalAlignment="Stretch"
                    >
                        </telerikNavigation:RadBook>
                    </Grid>
                </telerikDocking:RadPane>
            </telerikDocking:RadPaneGroup>
        </telerikDocking:RadSplitContainer>
        <telerikDocking:RadSplitContainer Orientation="Horizontal" InitialPosition="DockedBottom" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <telerikDocking:RadPaneGroup>
                <telerikDocking:RadPane Header="Notes" CanUserClose="False" CanFloat="False" CanDockInDocumentHost="False">
                    <TextBox></TextBox>
                </telerikDocking:RadPane>
            </telerikDocking:RadPaneGroup>
        </telerikDocking:RadSplitContainer>
        <telerikDocking:RadSplitContainer Orientation="Horizontal" InitialPosition="DockedBottom" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" MaxHeight="100">
            <telerikDocking:RadPaneGroup MaxHeight="100">
                <telerikDocking:RadPane Header="Navigation" CanUserClose="False" CanFloat="False" CanDockInDocumentHost="False" MaxHeight="100">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock>Time:</TextBlock>
                    </StackPanel>
                </telerikDocking:RadPane>
            </telerikDocking:RadPaneGroup>
        </telerikDocking:RadSplitContainer>
    </telerikDocking:RadDocking>
</Grid>

[Konstantina]

Hi Mike,

Thank you for the code snippet.

Instead of a Pane without header you can use a DocumentHost in which you can place the RadBook. Please find attached a sample project in which the Panes are arranged as your requirements. You can set also the InitialSize property of the RadSplitContainers to adjust their width and height. You can also refer to this online demo for an example.

Hope this helps. If you have further questions please let us know.

Best wishes,
Konstantina
the Telerik team