CODEWITHSUNDEEP
c#wpfxamlexpander
Neil Stevens
Neil Stevens

Reputation: 3904

Change Expander HeaderTemplate content

I have an Expander on a window in an application I am working on, the Xaml is as below

    <Border  Grid.Row="4" Grid.ColumnSpan="4" Grid.Column="0" BorderThickness="0,1,0,0" BorderBrush="Gray">
        <Grid>
            <Expander x:Name="ReleaseNotes" HeaderTemplate="{StaticResource ExpanderHeader}">                 
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="17"/>
                        <ColumnDefinition Width="300"/>
                        <ColumnDefinition Width="0" />
                    </Grid.ColumnDefinitions>
                    <ScrollViewer Height="150" Padding="0,0,5,0"  Grid.Column="1"  VerticalScrollBarVisibility="Auto">
                        <TextBlock  FontSize="10" Text="{Binding ReleaseNotesText}" TextWrapping="Wrap"/>
                    </ScrollViewer>
                </Grid>                
            </Expander>
        </Grid>
    </Border>

And the header template Xaml is:

    <Grid.Resources>
        <DataTemplate x:Key="ExpanderHeader">
            <TextBlock Text="Release notes">
                <TextBlock.Style>
                    <Style TargetType="{x:Type TextBlock}">
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Foreground" Value="#ffcc00"/>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </TextBlock.Style>
            </TextBlock>
        </DataTemplate>
    </Grid.Resources>

Now what I would like to be able to do is change the Text property of the TextBlock element in the HeaderTemplate, I have a theme for the window and the expander, I have tried using Header but this does not achieve the desired results, the theme has an animation and when using the Header I lose the animation. I have also tried using the Expanded and Collapsed events but cannot workout how to change the text value. Any help greatly appreciated.

Upvotes: 1

Views: 3741

Answers (1)

dkozl
dkozl

Reputation: 33364

If you want different text to appear when Expander is either open or closed you can use DataTrigger with RelativeSource binding and trigger on IsExpanded being true:

<DataTemplate x:Key="ExpanderHeader">
   <TextBlock>
      <TextBlock.Style>
         <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Text" Value="Closed"/>
            <Style.Triggers>
               <Trigger Property="IsMouseOver" Value="True">
                  <Setter Property="Foreground" Value="#ffcc00"/>
               </Trigger>
               <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Expander}}, Path=IsExpanded}" Value="True">
                  <Setter Property="Text" Value="Open"/>
               </DataTrigger>
            </Style.Triggers>
         </Style>
      </TextBlock.Style>
   </TextBlock>
</DataTemplate>

Remember to put default Text value as another setter instead of setting it directly against TextBlock otherwise trigger won't be able to overwrite the value

Upvotes: 3

Related Questions