Title row not visible when RadPaneGroup TabStripPlacement="Top"

3 posts, 0 answers
  1. tomas
    tomas avatar
    139 posts
    Member since:
    Sep 2012

    Posted 30 Oct 2009 Link to this post

    Hello Miroslav.

    I would like to make place RadPane Tab on Top.

    I have read that you did not expected it, thus title row with pin/unpin menu is not visible. It is a shame. I need this feature to work. 

    I have read that it is possible to change these templates:
    LeftTemplate, TopTemplate, RightTemplate, BottomTemplate, DocumentHostTemplate 
    I know nothing about it and documentation contains complete blank page: http://www.telerik.com/help/silverlight/raddocking-required-parts.html.

    Can you help me somehow please?

    Also It is not clear for me, what is the purpose of the DocumentHost class. There is no such part on http://www.telerik.com/help/silverlight/raddocking-structure.html.

    Thank you very much.

    Tom



  2. Miroslav Nedyalkov
    Admin
    Miroslav Nedyalkov avatar
    1718 posts

    Posted 02 Nov 2009 Link to this post

    Hi Tomas,

    First of all I want to apologize for the poor documentation, but we worked a lot on it and it will be improved for the Q3 release (this week) and I hope it will be more helpful than now.

    Currently the TopTemplate property is set to DocumentHostTemplate property by default, but you could change it. By design the Docking control has two types of PaneGroups - PaneGroups that are in DocumentHost (with the tab items on the top) and groups that are not in the DocumentHost (with tab items on the bottom). This is the reason we didn't implemented all orientations of the PaneGroup. We will consider implementing them all for future, but currently you will need to implement the TopTemplate control template and set the TabStripPlacement to Top. Here is an example of what I mean:
    <Grid x:Name="LayoutRoot">
        <Grid.Resources>
            <telerik:Office_BlackTheme x:Key="Theme" />
            <LinearGradientBrush x:Key="PaneHeader_Background_Focused" EndPoint="0 1">
                <GradientStop Offset="0" Color="#FF969EA8" />
                <GradientStop Offset="1" Color="#FFC7CCCF" />
            </LinearGradientBrush>
            <!--PaneGroup TopTemplate-->
            <ControlTemplate x:Key="PaneGroupTopTemplate"
                    TargetType="telerikDocking:RadPaneGroup">
                <Grid>
                    <Grid.RowDefinitions>                      
                        <RowDefinition Height="auto" />
                        <RowDefinition Height="*" MinHeight="20" />
                    </Grid.RowDefinitions>
     
                    <!--Content-->
                    <ContentControl x:Name="ContentBackground"
                                    Grid.Row="1"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Background="{TemplateBinding Background}">
                        <ContentControl.Template>
                            <ControlTemplate
                                    TargetType="ContentControl">
                                <Border x:Name="Root" BorderBrush="{TemplateBinding BorderBrush}"
                                        Background="{TemplateBinding Background}"
                                        BorderThickness="{TemplateBinding BorderThickness}">
     
                                    <ContentPresenter />
     
                                </Border>
                            </ControlTemplate>
                        </ContentControl.Template>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <!--Header-->
                            <dock:PaneHeader x:Name="HeaderElement"
                                    telerik:StyleManager.Theme="{StaticResource Theme}" Grid.Row="0"
                                    MinHeight="16" SelectedPane="{TemplateBinding SelectedPane}">
                            </dock:PaneHeader>
                            <ContentPresenter x:Name="ContentElement" Grid.Row="1"
                                    Content="{TemplateBinding SelectedContent}"
                                    ContentTemplate="{TemplateBinding SelectedContentTemplate}">
                            </ContentPresenter>
                        </Grid>
                    </ContentControl>
     
                    <!--Items-->
                    <Border x:Name="ItemsContainer" Grid.Row="0" Margin="0 -5 0 0" Padding="0 0 1 0">
                        <ItemsPresenter x:Name="ItemsPresenterElement" />
                    </Border>
     
                    <dock:RadGridResizer x:Name="DockResizer" Grid.RowSpan="2" Placement="Left"
                            ShowsPreview="True" Visibility="Collapsed" VerticalAlignment="Stretch"
                            HorizontalAlignment="Left" />
     
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Disabled" />
                            <VisualState x:Name="Normal" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="HeaderElement"
                                            Storyboard.TargetProperty="Background">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0"
                                                Value="{StaticResource PaneHeader_Background_Focused}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unfocused" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="AutoCollapseStates">
                            <VisualState x:Name="SingleItem">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ItemsContainer"
                                            Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="TwoOrMoreItems" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="PaneHeaderVisibilityStates">
                            <VisualState x:Name="PaneHeaderHidden">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="HeaderElement"
                                            Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Collapsed" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PaneHeaderVisible" />
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ResizerStates">
                            <VisualState x:Name="ResizerLeft">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="Width" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="4" />
                                    </ObjectAnimationUsingKeyFrames>
     
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ContentBackground"
                                            Storyboard.TargetProperty="Margin" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="4 0 0 0" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ItemsContainer"
                                            Storyboard.TargetProperty="Margin" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="4 -5 0 0" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="ResizerTop">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="VerticalAlignment"
                                            Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Top" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="HorizontalAlignment"
                                            Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Stretch" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="Placement" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <telerik:Dock>Top</telerik:Dock>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="Height" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="4" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="(Grid.RowSpan)" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="1" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="DockResizer"
                                            Storyboard.TargetProperty="(Grid.Row)" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="0" />
                                    </ObjectAnimationUsingKeyFrames>
     
                                    <ObjectAnimationUsingKeyFrames
                                            Storyboard.TargetName="ContentBackground"
                                            Storyboard.TargetProperty="Margin" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="0 4 0 0" />
                                    </ObjectAnimationUsingKeyFrames>
     
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="HideResizer" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
     
                </Grid>
     
            </ControlTemplate>
        </Grid.Resources>
     
            <telerikDocking:RadDocking
                Grid.Row="1">
            <telerikDocking:RadSplitContainer InitialPosition="DockedTop" Orientation="Horizontal">
                <telerikDocking:RadPaneGroup TopTemplate="{StaticResource PaneGroupTopTemplate}" TabStripPlacement="Top"
                        telerikDocking:ProportionalStackPanel.RelativeSize="400, 200">
                    <telerikDocking:RadPane Header="pane" />
                    <telerikDocking:RadPane Header="pane" />
                    <telerikDocking:RadPane Header="pane" />
                    <telerikDocking:RadPane Header="pane" />
                </telerikDocking:RadPaneGroup>
                <telerikDocking:RadPaneGroup>
                    <telerikDocking:RadPane Header="pane" />
                </telerikDocking:RadPaneGroup>
                <telerikDocking:RadPaneGroup>
                    <telerikDocking:RadPane Header="pane" />
                </telerikDocking:RadPaneGroup>
            </telerikDocking:RadSplitContainer>
     
            <telerikDocking:RadDocking.DocumentHost>
                <telerikDocking:RadSplitContainer InitialPosition="DockedTop"
                        Orientation="Horizontal">
                    <telerikDocking:RadPaneGroup
                            telerikDocking:ProportionalStackPanel.RelativeSize="400, 200">
                        <telerikDocking:RadPane Header="pane" />
                    </telerikDocking:RadPaneGroup>
                    <telerikDocking:RadPaneGroup>
                        <telerikDocking:RadPane Header="pane" />
                    </telerikDocking:RadPaneGroup>
                    <telerikDocking:RadPaneGroup>
                        <telerikDocking:RadPane Header="pane" />
                    </telerikDocking:RadPaneGroup>
                </telerikDocking:RadSplitContainer>
            </telerikDocking:RadDocking.DocumentHost>
        </telerikDocking:RadDocking>
    </Grid>


    Kind 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.
  3. tomas
    tomas avatar
    139 posts
    Member since:
    Sep 2012

    Posted 05 Nov 2009 Link to this post

    Thank you Miroslav.

    It is still too difficult for me.

    I am waiting for the completion of the documentation.

    Thanks Tom
Back to Top