TabControl and Docking

10 posts, 0 answers
  1. Johnny
    Johnny avatar
    16 posts
    Member since:
    Sep 2009

    Posted 09 Oct 2009 Link to this post

    All,
    I have a TabControl which has a Docking control within it.  When I move the panes around outside of the docking, they always go under the TabControl.  I've played with the ZIndex of these items with not luck.  Any thoughts?
    Thanks,
    Johnny
  3. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 15 Oct 2009 Link to this post

    Hello Johnny,

    What I could suggest you is to change the control template of the Docking control and add a popup around the PopupCanvas control. We removed this popup by default as it causes some problems when you include the Docking control in an animation, when you put the Docking control in other popups, etc., but you can still put it back if you are not in any of these scenarios. Here is an example:
    <telerikDocking:RadDocking.Template>
        <ControlTemplate TargetType="telerikDocking:RadDocking">
            <Grid x:Name="LayoutRoot">
                <Border Background="{TemplateBinding BorderBrush}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Padding="{TemplateBinding Padding}">
     
                    <telerik:RadDockPanel x:Name="RootDockPanel">
                        <!--TODO Add margin to compensate for not overlapping the other auto-hide areas (everywhere)-->
                        <dock:AutoHideArea x:Name="LeftAutoHide"
                                telerik:RadDockPanel.Dock="Left"
                                TabStripPlacement="Left"
                                BackgroundVisibility="Collapsed"
                                TabOrientation="Vertical" />
                        <dock:AutoHideArea x:Name="RightAutoHide"
                                BackgroundVisibility="Collapsed"
                                telerik:RadDockPanel.Dock="Right"
                                TabStripPlacement="Right" TabOrientation="Vertical" />
                        <dock:AutoHideArea x:Name="TopAutoHide"
                                BackgroundVisibility="Collapsed"
                                telerik:RadDockPanel.Dock="Top"
                                TabStripPlacement="Top" />
                        <dock:AutoHideArea telerik:RadDockPanel.Dock="Bottom"
                                BackgroundVisibility="Collapsed"
                                TabStripPlacement="Bottom" x:Name="BottomAutoHide" />
                        <telerikDocking:DockingPanel x:Name="ContentDockPanel"
                                Background="{TemplateBinding Background}">
                            <!--Panes comes here.-->
     
                            <!--<dock:DocumentHost x:Name="DocumentHost"
                            Content="{TemplateBinding DocumentHost}"
                            Visibility="{Binding HasDocumentHost, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}" />-->
                            <dock:DocumentHost x:Name="DocumentHost"
                                    Content="{TemplateBinding DocumentHost}" />
     
                        </telerikDocking:DockingPanel>
                    </telerik:RadDockPanel>
     
                </Border>
                <Popup IsOpen="True">
                <Canvas x:Name="PopupPanel">
                    <dock:VisualCue x:Name="PART_DragCue" Canvas.ZIndex="999997"
                            Style="{TemplateBinding VisualCueStyle}">
                        <dock:VisualCue.RenderTransform>
                            <TranslateTransform />
                        </dock:VisualCue.RenderTransform>
                    </dock:VisualCue>
                    <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>
                    <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>
                </Popup>
            </Grid>
        </ControlTemplate>
    </telerikDocking:RadDocking.Template>

    The dock xml namespace is defined as xmlns:dock="clr-namespace:Telerik.Windows.Controls.Docking;assembly=Telerik.Windows.Controls.Docking".

    Hope this helps.

    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.
  5. Johnny
    Johnny avatar
    16 posts
    Member since:
    Sep 2009

    Posted 16 Oct 2009 Link to this post

    Thanks for the advice, but I'm not completely sure that I understand the solution.  I have a tab control with tabitems and then a docking control within each of those.  On moving a pane within one of the docking controls, they will appear as if they are behind the tabs when moved to that area of the screen.  Thanks for all of your help.
    Thanks,
    Johnny
  7. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 20 Oct 2009 Link to this post

    Hi Johnny,

    Yes, I've tried your scenario and I noticed that the TabStripPanel of the TabControl appears "over" the floating ToolWindows. Because of that I suggested you to change to ControlTemplate of the Docking control and to wrap the Canvas called PopupPanel in Popup control, because the Docking control uses this canvas internally to put the floating ToolWindows in it and if it is in a Popup control, the ToolWindows will appear "over" the TabStrip. Is this the searched effect?

    Sincerely yours,
    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.
  9. Johnny
    Johnny avatar
    16 posts
    Member since:
    Sep 2009

    Posted 23 Oct 2009 Link to this post

    Perfect.  I apologize for the miscommunication.  Thanks so much for your help.
    -Johnny
  11. Kirill Prokopenko
    Kirill Prokopenko avatar
    4 posts
    Member since:
    Nov 2009

    Posted 05 Nov 2009 Link to this post

    I posted it in wrong question sorry
  13. Johnny
    Johnny avatar
    16 posts
    Member since:
    Sep 2009

    Posted 21 Dec 2009 Link to this post

    All,
    I have implemeted the template as you had suggested.  Everything works well, but it looks like the section where you have mentioned (<!--Panes comes here.-->) needs to be implemented now as without it the panes disappear when switching tabs.  What needs to be within this section.  I am having some difficulty with this.  I am adding these panes programmatically, but understand that they must still have a template...just not sure what needs to be contained within it.
    Thanks,
    Johnny
  15. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 22 Dec 2009 Link to this post

    Hi Johnny,

     I think I sent you a wrong ControlTemplate - the XAML:

    <dock:DocumentHostx:Name="DocumentHost"
                            Content="{TemplateBinding DocumentHost}"
                            Visibility="{Binding HasDocumentHost, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}" />

    shouldn't be commented out. Could you please uncomment it?

     If you still have problems with this, please open a support ticket and send us a sample project - we will investigate the problem let you know how to fix it.

    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.
  17. John Benson
    John Benson avatar
    7 posts
    Member since:
    Aug 2009

    Posted 05 Feb 2010 Link to this post

    Hey, I'm having the same problem as Johnny.

    I used the provided ControlTemplate and the panes would still be visible when outside the DockingPanel but when I would switch tabs and left one of the panes floating, it would disappear when switching back to that tab while tabs that were docked would still be visible.

    Is there a solution for this? Thanks in advance.


  19. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 08 Feb 2010 Link to this post

    Hi John,

     Please, find the attached project that demonstrates how to achieve this. The code that takes care of this is the code-behind of the MainPage.

    Kind regards,
    Miroslav Nedyalkov
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
Back to Top