Frage

I have made a triangle Button via some of the Questions ask here, everything working fine but now I want to add Triggers but nothing happens. I have two Buttons wich should have the some things happen on IsMouseOver but the Triangles point in different directions (< & >). So I tought I create one Style with all the Triggers and then have two styles inherit from this style and draw the triangles. But like I said nothing is happening.

UPDATE after first 2 Anwers:

<Style x:Key="DateTrigger" TargetType="Button">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="Black"/>                                   
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter Property="Background" Value="Red"/>                                 
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="Back" BasedOn="{StaticResource DateTrigger}" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Polygon Stroke="Black" Fill="{TemplateBinding Background}">
                        <Polygon.Points>
                            <Point X="74.2" Y="0"/>
                            <Point X="0" Y="25"/>
                            <Point X="74.2" Y="50"/>
                        </Polygon.Points>
                        </Polygon>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
War es hilfreich?

Lösung

You have set your Trigger to affect the Background property, but you haven't defined that property's use in your ControlTemplate. So, the Background property value may well be changing, but you can't see it because you are not using it in your ControlTemplate. You can access the Background property from the ControlTemplate using the TemplateBinding Markup Extension:

<Border Name="border"
        BorderThickness="1"
        Padding="4,2"
        BorderBrush="Black"
        CornerRadius="1"
        Background="{TemplateBinding Background}">
        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>

UPDATE >>>

I'm not sure why you say that the Style is still not working... it works just fine. Just apply your Style (including the {TemplateBinding Background}) to a Button and mouse over it:

<Button Style="{StaticResource DateTrigger}" Content="Click me" />

I've just noticed that you've changed/removed your original code example... please don't do that because it means that answers, comments (and sometimes questions) no longer make sense. So anyway, your original code worked just fine (with the {TemplateBinding Background} added), so I'd replace it if I were you. Here's your original working code example that I edited:

<Style x:Key="DateTrigger" TargetType="Button">
    <Setter Property="OverridesDefaultStyle" Value="True"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Border Name="border"
                        BorderThickness="1"
                        Padding="4,2"
                        BorderBrush="Black"
                        CornerRadius="1"
                        Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="Button.IsMouseOver" Value="True">
                        <Setter Property="Background" Value="Black"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Trigger>
                    <Trigger Property="Button.IsPressed" Value="True">
                        <Setter Property="Background" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
<Style x:Key="Back" BasedOn="{StaticResource DateTrigger}" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Polygon Stroke="Black" Fill="White">
                    <Polygon.Points>
                        <Point X="74.2" Y="0"/>
                        <Point X="0" Y="25"/>
                        <Point X="74.2" Y="50"/>
                    </Polygon.Points>
                </Polygon>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

UPDATE 2 >>>

Well you just can't use that Back Style, because the ControlTemplate in it will replace the ControlTemplate in the DateTrigger Style, along with the Triggers section. To fix this, you can just add more Triggers into your Back Style ControlTemplate:

<Style x:Key="Back" BasedOn="{StaticResource DateTrigger}" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Polygon Stroke="Black" Fill="{TemplateBinding Background}">
                    <Polygon.Points>
                        <Point X="74.2" Y="0"/>
                        <Point X="0" Y="25"/>
                        <Point X="74.2" Y="50"/>
                    </Polygon.Points>
                </Polygon>
                <ControlTemplate.Triggers>
                    <Trigger Property="Button.IsMouseOver" Value="True">
                        <Setter Property="Background" Value="Black"/>
                        <Setter Property="Foreground" Value="White"/>
                    </Trigger>
                    <Trigger Property="Button.IsPressed" Value="True">
                        <Setter Property="Background" Value="Red"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

...

<Button Style="{StaticResource Back}" Content="Click me" />

Andere Tipps

Firstly your Trigger sets Button.Background and not Border.Background so you need to either set TargetName to name of the Border

<Setter TargetName="border" Property="Background" Value="Black"/>

or use TemplateBinding and bind Button.Background to Border.Background

<Border Name="border" ... Background="{TemplateBinding Background}">

Second problem is that it seems to me that you think that ControlTemplate is somehow merged. This is not the case. When you set Template in Back style you overwrite value inherited from DateTrigger style effectively loosing all your triggers. One solution would be to set Content in Back style instead of Template

<Style x:Key="Back" BasedOn="{StaticResource DateTrigger}" TargetType="Button">
   <Setter Property="Content">
      <Setter.Value>
         <Polygon Stroke="Black" Fill="White">
            <Polygon.Points>
               <Point X="74.2" Y="0"/>
               <Point X="0" Y="25"/>
               <Point X="74.2" Y="50"/>
            </Polygon.Points>
         </Polygon>
      </Setter.Value>
   </Setter>
</Style>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top