Using silverlight Docking controls , create 4 panels equally sized thro' xaml

[Rajesh]

Hi

Is it possible with silverlight Docking control, two create 4 panels equally sized thro' xmal file ?

I am able to set the DocumentHost's minimum size to 0, so it is not visible at all thro' styles. Now i need 4 panels equally sized.

For eq. There are two panels equally sized - (left and right ) - I am able to achive this. Now each panel needs to be equally divided in top and bottom panels. ( Result of total 3 splitters and 4 panels and I need to display this look thro' xmal file.)

I am able to achive this once 2 panels (left & right) are visible and both panels contains two tabs and then one of the tabs from both panel and it get splitted resulting 4 panels equally sized.

Can you provide me sample for same. I guess it is possible by applying some themes styles.

-Rajesh

[Miroslav Nedyalkov]

Hello Rajesh,

The Docking control doesn't support relative sizing of the top-level children - that means that you cannot put 4 equally sized split containers directly into the Docking control. You can still work-around this by creating docked to the top SplitContainer with 4 groups in it and with Horizontal Orientation.  It will split its width between these 4 groups, but will not fill the height of the Docking control. You can work-around this by handling the SizeChanged event of the Docking control and changing the Height of the docked to the top SplitContainer. The problem with this is that if the user grabs a Pane and moves it to the bottom, the docked to the top SplitContainer will not resize to let the other Pane fit - it will stay behind it.

Please, find attached an example - it demonstrates the above approach.

Hope this helps.

Regards,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the newTelerik Support Portal.
Check out the tipsfor optimizing your support resource searches.

[Riz]

Please let me know how to make RadDocking.DocumentHost invisible, we want just panes in our application.

thank you very much

[Miroslav Nedyalkov]

Hi Joe,

You should change the control Template of Docking control. Find the attached example - it demonstrates how to do that.

Note that the Docking control is not designed to work like that so you may meet a lot of strange issues.

Hope this works for you.

Kind regards,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the newTelerik Support Portal.
Check out the tipsfor optimizing your support resource searches.

[Riz]

Thank you very much for your answer

Kindly describe the logic behind your template so that we are able to fix any issues that we face.

Regards,

[Miroslav Nedyalkov]

Hello Joe,

Here is the template XAML with added comments. Hope this will help you understand the template better:

<UserControl x:Class="Docking_SplitHorizontally.Page"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
        xmlns:docking="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Docking"
        xmlns:dock="clr-namespace:Telerik.Windows.Controls.Docking;assembly=Telerik.Windows.Controls.Docking">
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.Resources>
            <ControlTemplate x:Key="dockingControlTemplate" TargetType="docking:RadDocking">
                <Grid x:Name="LayoutRoot">
                    <!-- This is the border around the Docking control. -->
                    <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Padding="{TemplateBinding Padding}">
                        <!-- This is the panel that hosts the 4 auto-hide areas (where unpinned panes are placed).-->
                        <telerik:RadDockPanel x:Name="RootDockPanel">
                            <!-- This is the auto-hide area that is placed at the left side.-->
                            <dock:AutoHideArea x:Name="LeftAutoHide"
                                    telerik:RadDockPanel.Dock="Left" TabStripPlacement="Left"
                                    TabOrientation="Vertical" />
                            <!-- This is the auto-hide area that is placed at the right side.-->
                            <dock:AutoHideArea x:Name="RightAutoHide"
                                    telerik:RadDockPanel.Dock="Right" TabStripPlacement="Right"
                                    TabOrientation="Vertical" />
                            <!-- This is the auto-hide area that is placed at the top side.-->
                            <dock:AutoHideArea x:Name="TopAutoHide" telerik:RadDockPanel.Dock="Top"
                                    TabStripPlacement="Top" />
                            <!-- This is the auto-hide area that is placed at the bottom side.-->
                            <dock:AutoHideArea telerik:RadDockPanel.Dock="Bottom"
                                    TabStripPlacement="Bottom" x:Name="BottomAutoHide" />
                            <!-- The split containers are placed in this panel.
                            It works like ItemsPresenter in regular ControlTemplate of ItemsControl. -->
                            <docking:DockingPanel x:Name="ContentDockPanel">
                                <!--Don't put anything except DocumentHost here. The code expects DocumentHost or nothing.-->
                            </docking:DockingPanel>
                        </telerik:RadDockPanel>
                    </Border>
                    <!-- This canvas is used by the ToolWindows, VisualCue and both compasses -
                    it could be in a Popup to make sure that all the ToolWindows will be on top of other controls. -->
                    <Canvas x:Name="PopupPanel">
                        <!-- This is the VisualCue of the Docking control - the rectangle that shows preview where the item will be docked when you drop it.
                        This element needs to have TranslateTransform as the code expects it.-->
                        <dock:VisualCue x:Name="PART_DragCue" Canvas.ZIndex="999997"
                                Style="{TemplateBinding VisualCueStyle}">
                            <dock:VisualCue.RenderTransform>
                                <TranslateTransform />
                            </dock:VisualCue.RenderTransform>
                        </dock:VisualCue>
                        <!-- This is the compass that shows at the four sides of the Docking control and allows you to dock something at the root of the Docking control. -->
                        <dock:RootCompass x:Name="PART_RootCompass" RenderTransformOrigin="0.5, 0.5"
                                Style="{TemplateBinding RootCompassStyle}" Visibility="Collapsed"
                                Canvas.ZIndex="999998">
                            <dock:RootCompass.RenderTransform>
                                <TranslateTransform />
                            </dock:RootCompass.RenderTransform>
                        </dock:RootCompass>
                        <!-- This is the small compass with 5 parts that shows when you drag something over a PaneGroup.-->
                        <dock:Compass x:Name="PART_Compass" RenderTransformOrigin="0.5, 0.5"
                                Style="{TemplateBinding CompassStyle}" Visibility="Collapsed"
                                Canvas.ZIndex="999999">
                            <dock:Compass.RenderTransform>
                                <TranslateTransform />
                            </dock:Compass.RenderTransform>
                        </dock:Compass>
                    </Canvas>
                </Grid>
            </ControlTemplate>
        </Grid.Resources>

        <docking:RadDocking x:Name="docking" SizeChanged="RadDocking_SizeChanged" Template="{StaticResource dockingControlTemplate}">
            <!-- This split container will be shown in the ContentDockPanel template part.-->
            <docking:RadSplitContainer x:Name="rootSplitContainer" InitialPosition="DockedTop"
                    Orientation="Horizontal">
                <docking:RadPaneGroup>
                    <docking:RadPane Header="Pane1" Content="pane 1 content" />
                </docking:RadPaneGroup>
                <docking:RadPaneGroup>
                    <docking:RadPane Header="Pane1" Content="pane 1 content" />
                </docking:RadPaneGroup>
                <docking:RadPaneGroup>
                    <docking:RadPane Header="Pane1" Content="pane 1 content" />
                </docking:RadPaneGroup>
                <docking:RadPaneGroup>
                    <docking:RadPane Header="Pane1" Content="pane 1 content" />
                </docking:RadPaneGroup>
            </docking:RadSplitContainer>
        </docking:RadDocking>
    </Grid>
</UserControl>

Regards,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the newTelerik Support Portal.
Check out the tipsfor optimizing your support resource searches.

[Riz]

I have noticed some consistent issues with the template,

1) remove all the panes

2) Now add pane to the docking control its makes it centralized and does not stretch pane to cover the full area ( screen attached )

once above issue is reproduced all the panes added after it are centralized and does not cover the available area as required.

please suggest a solution or confirm RadDocking.DocumentHost invisible is formally supported in latest beta?

[Miroslav Nedyalkov]

Hi Joe,

I can confirm that this feature (allowing no document host, by setting the DocumentHostVisibility property) is included in both latest internal build the latest beta version.

Regards,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Riz]

We are using 2009.2.1009.1030 which is the last published internal build and I am not able to find the said property.

Please let us know when the internal build containing the said functionality will be publish? 

In case I have misunderstood any thing or made a mistake please guide me through 

thank you very much 

[Miroslav Nedyalkov]

Hello Joe,

I'm really sorry, I didn't check the name. The property is called HasDocumentHost and it is of bool type. Once again - I'm sorry for the caused inconvenience.

Greetings,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Riz]

I am sorry I used the object browser to look this property but no luck. On  RadDocking I looked every property but on 2009.2.1009.1030 it functionality does not exists.

Please suggest the version or share the internal build 

best regards,

[Miroslav Nedyalkov]

Hello Joe,

I've checked once again with Reflector and the property does exist. Please find the attached screenshot of what I saw. You might be looking at the wrong place. The property is a property of the RadDocking control.

Regards,
Miroslav Nedyalkov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Riz]

Yes, you are correct I found it

thank  you very much for your time and help 

best regards,