Horizontal Alignment not working in Header for Metro theme

4 posts, 0 answers
  1. Michael Lilly
    Michael Lilly avatar
    53 posts
    Member since:
    Apr 2010

    Posted 10 Jan 2014 Link to this post

    I have a template for the RadPaneHeader that adds a button that should be right justified. In Office Blue it works fine, but in Metro, that button is left justified instead. This is the DataTemplate that works in Office Blue but not in Metro. Any assistance would be great:

    <DataTemplate x:Key="AddressHeaderTemplate">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <ContentPresenter Grid.Column="0" Content="{Binding}"/>
            <telerik:RadButton Grid.Column="1" x:FieldModifier="private" x:Name="EditAddress" IsBackgroundVisible="False" Activate="EditAddress_OnActivate"  VerticalAlignment="Top" HorizontalAlignment="Right">
                <StackPanel>
                    <Image Source="{Binding Path=CurrentTheme.Icons[Edit16], Source={StaticResource WorkspaceThemesManager}}"/>
                </StackPanel>
            </telerik:RadButton>
        </Grid>
    </DataTemplate>
  2. Vladi
    Admin
    Vladi avatar
    744 posts

    Posted 15 Jan 2014 Link to this post

    Hello,

    We are not aware of such issues in the current version of RadDocking. Setting the mentioned DataTemplate to the HeaderTemplate of a RadPane in both Windows8 and Office_Blue work as expected.

    I created and attached a sample project for you using Implicit Styles that shows the expected behavior when setting the HeaderTemplate. Could you try to reproduce the issue in that sample project and send it to us in a support thread in order for us to be able to observe it on our side and see what could be the cause of it.

    Regards,
    Vladi
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. DevCraft banner
  4. Michael Lilly
    Michael Lilly avatar
    53 posts
    Member since:
    Apr 2010

    Posted 15 Jan 2014 Link to this post

    I apologize, I said I was using the Header template. That was incorrect, I'm actually using the Title Template.

    I can definitely duplicate it with your sample project. All I need to do is remove the Width from the template grid (because 200 gives it a set width, instead of floating), and change "HeaderTemplate" to "TitleTemplate". When I run it, I move the panel out of the doc host to one of the extremes of the screen, and I see the same behavior of the button sitting right beside the text. It floats properly under Office Blue, but is left justified in Windows8. Here is the changed code that gives the results I'm seeing:

    <UserControl x:Class="DockingHeaderTest.MainPage"
        mc:Ignorable="d"
                 xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        d:DesignHeight="300" d:DesignWidth="400">
        <UserControl.Resources>
            <DataTemplate x:Key="AddressHeaderTemplate">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <ContentPresenter Grid.Column="0" Content="{Binding}" />
                    <telerik:RadButton Grid.Column="1"
                                       x:FieldModifier="private"
                                       x:Name="EditAddress"
                                       IsBackgroundVisible="False"
                                       VerticalAlignment="Top"
                                       Activate="EditAddress_OnActivate">
                        <StackPanel>
                                <Image Source="logo.png"/>
                        </StackPanel>
                    </telerik:RadButton>
                </Grid>
            </DataTemplate>
        </UserControl.Resources>
     
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadDocking>
                <telerik:RadDocking.DocumentHost>
                    <telerik:RadSplitContainer>
                        <telerik:RadPaneGroup>
                            <telerik:RadPane Header="Pane 1" TitleTemplate="{StaticResource AddressHeaderTemplate}"/>
                        </telerik:RadPaneGroup>
                    </telerik:RadSplitContainer>
                </telerik:RadDocking.DocumentHost>
            </telerik:RadDocking>
        </Grid>
    </UserControl>

    A workaround would be ideal, since I don't have control over which build of your dlls I can use (handled by higher ups).

    Thanks!
  5. Vladi
    Admin
    Vladi avatar
    744 posts

    Posted 16 Jan 2014 Link to this post

    Hello,

    Thank you for clearing this out. We managed to observe the issue and a fix for it will be available in either the next internal build or in our next official release of RadDocking.

    In the mean while I attached a working example with a workaround to my response. Hope this is helpful.

    Regards,
    Vladi
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
Back to Top