Horizontal Content Alignment

3 posts, 0 answers
  1. JC
    JC avatar
    32 posts
    Member since:
    Sep 2010

    Posted 27 Jun 2011 Link to this post

    Hello,

    I work with the 2011 Q1 release.
    The HorizontalContentAlignment not longer seems to work ?

    I do this small code for you :
    <telerik:RadExpander Margin="0,32,0,0" VerticalAlignment="Top" IsExpanded="True">
        <telerik:RadExpander.Header>
            <TextBlock Text="Coordonnées" FontSize="14" FontWeight="Bold" />
        </telerik:RadExpander.Header>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="2*" />
                <ColumnDefinition Width="3*" />
                <ColumnDefinition Width="3*" />
            </Grid.ColumnDefinitions>
            <StackPanel Margin="20,0">
                <TextBlock Text="Coordonnées" FontWeight="Bold" HorizontalAlignment="Center" FontSize="12" />
            </StackPanel>
            <StackPanel Margin="10,0,20,0" Grid.Column="1">
                <TextBlock Text="Adresse siège" FontWeight="Bold" HorizontalAlignment="Center" FontSize="12" />
            </StackPanel>
            <StackPanel Grid.Column="2" Margin="10,0,20,0">
                <TextBlock Text="Coordonnées bancaires" FontWeight="Bold" HorizontalAlignment="Center" FontSize="12" />
            </StackPanel>
        </Grid>
    </telerik:RadExpander>

    The Grid doesn't use all available space.
    So, I looked at the template I found 2 colums ??

    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
            Background="{TemplateBinding Background}">
        <Grid>
            <!-- WHY 2 columns ?
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>-->
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <telerik:RadToggleButton x:Name="HeaderButton" Background="Transparent" ClickMode="{TemplateBinding ClickMode}"
                           FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}"
                           FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}"
                           FontFamily="{TemplateBinding FontFamily}" HorizontalAlignment="Left"
                           IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                           Template="{StaticResource ToggleTemplate}" VerticalAlignment="Top">
                <StackPanel x:Name="HeaderPanel" Orientation="Horizontal">
                    <Grid>
                        <Ellipse x:Name="OuterCircle" Fill="{StaticResource ControlBackground_Normal}" HorizontalAlignment="Center"
                                 Height="20" Stroke="{StaticResource ControlOuterBorder_Normal}" VerticalAlignment="Center" Width="20"/>
                        <Ellipse x:Name="InnerCircle" HorizontalAlignment="Center" Height="18" Stroke="{StaticResource ControlInnerBorder_Normal}"
                                 VerticalAlignment="Center" Width="18"/>
                        <Grid x:Name="arrowPanel" RenderTransformOrigin=".5 .5">
                            <Grid.RenderTransform>
                                <RotateTransform/>
                            </Grid.RenderTransform>
                            <Path x:Name="arrow" Data="M0,0 L0.67,0 4,2.67 7.25,0 8,0 8,0.67 4,4 0,0.75 z" Fill="{StaticResource ControlElement_Normal}"
                                  Height="4" RenderTransformOrigin="0.5,0.5" Stretch="None" Width="8">
                                <Path.RenderTransform>
                                    <RotateTransform Angle="0"/>
                                </Path.RenderTransform>
                            </Path>
                        </Grid>
                    </Grid>
                    <telerik:LayoutTransformControl x:Name="HeaderContentTransform" RenderTransformOrigin=".5 .5">
                        <ContentPresenter x:Name="HeaderContent" ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}"
                                          Grid.Column="1" HorizontalAlignment="Stretch" Margin="5 0" VerticalAlignment="Center"/>
                    </telerik:LayoutTransformControl>
                </StackPanel>
            </telerik:RadToggleButton>
            <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}"
                              HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}"
                              VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Grid>
    </Border>

    When I remove these columns, it work correctly !

    What's the correct way to do this ?

    Thanks
    JC

  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 30 Jun 2011 Link to this post

    Hello Jc,

    Please accept our apologies for the caused inconvenience. During the Q1 2011 the Expander control went under extensive changes. Our goal was to improve the performance of the control and fix many of the bugs. Unfortunately we have introduced issues related to the Alignment properties, which are already fixed . If you update to the latest official release, you will be able to get the latest version of the control where the alignment properties of the RadExpander work as expected and more properties are exposed to allow you to define the layout of the Header as well as the Content of the control. These alignment properties are described here.

    In the meantime I attached a sample project where the default style of the Q1 2011 version of the RadExpander is modified to allow stretching. Please give it a try and let us know if it works for you.

    Best wishes,
    Tina Stancheva
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft banner
  4. JC
    JC avatar
    32 posts
    Member since:
    Sep 2010

    Posted 05 Jul 2011 Link to this post

    Ok

    I updated to 2011.1.0704 and it work fine.

    Thx
Back to Top