Datatrigger in WPF Style: Change content doesn't work

Question

I have some style coding for a custom maximize Button and i'm getting some issues.

<Style TargetType="Button">
       <Setter Property="Template">
           <Setter.Value>
               <ControlTemplate TargetType="Button">
                   <Border Background="{TemplateBinding Background}" BorderThickness="0">
                       <ContentPresenter  Margin="10,7,10,7" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                   </Border>
               </ControlTemplate>
           </Setter.Value>
       </Setter>
       <Setter Property="Background" Value="#01000000"/>
       <Setter Property="Foreground" Value="#FFFFFFFF"/>
       <Setter Property="Margin" Value="0"/>
       <Style.Triggers>
           <Trigger Property="IsMouseOver" Value="True">
               <Setter Property="Background" Value="#50FFFFFF"/>
           </Trigger>
           <!--This trigger fails-->
           <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource FindAncestor, AncestorType=acrylic:AcrylicWindow}}" Value="Maximized">
               <Setter Property="Content">
                   <Setter.Value>
                       <Grid>
                           <Path Height="10" Width="10" Data="M2,0 L8,0 L8,6 M0,3 L6,3 M0,2 L6,2 L6,8 L0,8 Z"
                               Stroke="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Button}}}"
                               StrokeThickness="1"
                               SnapsToDevicePixels="True"/>
                       </Grid>
                   </Setter.Value>
               </Setter>
           </DataTrigger>
           <!--It Works Correctly-->
           <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource FindAncestor, AncestorType=acrylic:AcrylicWindow}}" Value="Normal">
               <Setter Property="Content">
                   <Setter.Value>
                       <Grid>
                           <Path Width="10" Height="10" Data="F1M0,0L0,9 9,9 9,0 0,0 0,3 8,3 8,8 1,8 1,3z"
                             Fill="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type Button}}}"
                             SnapsToDevicePixels="True"/>
                       </Grid>
                   </Setter.Value>
              </Setter>
          </DataTrigger>
      </Style.Triggers>
  </Style>

When the Window is maximized the Button content disappears, it doesn't show the path, it's empty (but clickable and the fade in InMouseOver works). When the Window is in normal state the button content is correct. I was trying to change the path data but i didn't see any change.

mm8 · Accepted Answer · 2018-07-04 12:38:15Z

1

Try to define the content as a resource:

<Style TargetType="Button">
    <Style.Resources>
        <Grid x:Key="max">
            <Path Height="10" Width="10" Data="M2,0 L8,0 L8,6 M0,3 L6,3 M0,2 L6,2 L6,8 L0,8 Z"
                               Stroke="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Button}}}"
                               StrokeThickness="1"
                               SnapsToDevicePixels="True"/>
        </Grid>
        <Grid x:Key="normal">
            <Path Width="10" Height="10" Data="F1M0,0L0,9 9,9 9,0 0,0 0,3 8,3 8,8 1,8 1,3z"
                             Fill="{Binding Path=Foreground, RelativeSource={RelativeSource AncestorType={x:Type Button}}}"
                             SnapsToDevicePixels="True"/>
        </Grid>

    </Style.Resources>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Background="{TemplateBinding Background}" BorderThickness="0">
                    <ContentPresenter  Margin="10,7,10,7" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Background" Value="#01000000"/>
    <Setter Property="Foreground" Value="#FFFFFFFF"/>
    <Setter Property="Margin" Value="0"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="#50FFFFFF"/>
        </Trigger>
        <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource FindAncestor, AncestorType=Window}}" Value="Maximized">
            <Setter Property="Content" Value="{StaticResource max}" />
        </DataTrigger>
        <DataTrigger Binding="{Binding WindowState, RelativeSource={RelativeSource FindAncestor, AncestorType=Window}}" Value="Normal">
            <Setter Property="Content" Value="{StaticResource normal}" />
        </DataTrigger>
    </Style.Triggers>
</Style>

answered Jul 4, 2018 at 12:38

mm8

170k10 gold badges71 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

DrkDeveloper Over a year ago

Wow, works like a charm. Thanks. Do you know why of this behavior? I'm quite new in WPF

mm8 Over a year ago

It's because of the Foreground binding. If you set the Stroke of the Path to a fixed value your example will probably work.

FrankM · Accepted Answer · 2018-07-04 12:51:20Z

1

The culprit is this line:

Stroke="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type Button}}}"

The reason for that is that this binding cannot be resolved when the setter is being instantiated, because the Path does not yet exist.

When you use

Stroke="#FFFFFFFF"

instead, it will work.

Define the color in a resource and use something like

Stroke="{StaticResource ButtonForegroundColor}"

for better maintainability of your XAML code.

answered Jul 4, 2018 at 12:51

FrankM

1,1376 silver badges17 bronze badges

Collectives™ on Stack Overflow

Datatrigger in WPF Style: Change content doesn't work

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related