无法在运行时更改控件模板的属性

Question

我有一个自定义的 3 状态Button，应该在单击时在 3 种不同的状态(颜色(之间循环。 但是，我编写的点击处理程序对ControlTemplate中Border的背景颜色没有任何影响。

我可能错过了一些非常简单的东西，但我真的很想有一双新鲜的眼睛来发现它可能是什么。

ControlTemplate和Button.Click处理程序如下所示：

<Style x:Key="FilterButtonStyle"  TargetType="{x:Type local:FilterButton}"
BasedOn="{StaticResource {x:Type Button}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="ButtonBackground" BorderThickness="0" Padding="0"
Margin="0" CornerRadius="6"
Background="{StaticResource blueShader}" >
<ContentPresenter HorizontalAlignment="Center"
VerticalAlignment="Center"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Effect" Value="{StaticResource glowShadow}">
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="{StaticResource textBrush}"/>
<Setter Property="Margin" Value="4,4,0,4"></Setter>
<Setter Property="Padding" Value="4"></Setter>
<Setter Property="Height" Value="55"></Setter>
<Setter Property="Width" Value="55"></Setter>
<Setter Property="FontSize" Value="10"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="TextBlock.TextWrapping" Value="Wrap"></Setter>
<Setter Property="HasDisabledState" Value="True"></Setter>
<Setter Property="OnColour" Value="{StaticResource greenShader}"></Setter>
<Setter Property="OffColour" Value="{StaticResource blueShader}"></Setter>
<Setter Property="DisabledColour" Value="{StaticResource redShader}"></Setter>
</Style>

private void FilterButton_Click(object sender, RoutedEventArgs e)
{
if (!this.CanChangeState) { return; }
// Get child border element.
Border border = this.Template.LoadContent() as Border;
// Cycle through button states.
switch (this.ButtonState)
{
case ButtonStates.Off:
this.ButtonState = ButtonStates.On;
border.Background = this.OnColour;
break;
case ButtonStates.On:
if (this.HasDisabledState)
{
this.ButtonState = ButtonStates.Disabled;
border.Background = this.DisabledColour;
}
else
{
this.ButtonState = ButtonStates.Off;
border.Background = this.OffColour;
}
break;
case ButtonStates.Disabled:
this.ButtonState = ButtonStates.Off;
border.Background = this.OffColour;
break;
}
}

Answer 1

没关系，我发现处理此问题的更好方法是使用ControlTemplate触发器根据 ButtonState 属性更改Button颜色。

<Style x:Key="FilterButtonStyle"  TargetType="{x:Type local:FilterButton}"
BasedOn="{StaticResource {x:Type Button}}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="ButtonBackground" BorderThickness="0" Padding="0" Margin="0" CornerRadius="6"
Background="{StaticResource blueShader}" >
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Effect" Value="{StaticResource glowShadow}">
</Setter>
</Trigger>
<Trigger Property="local:FilterButton.ButtonState" Value="On">
<Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource greenShader}"></Setter>
</Trigger>
<Trigger Property="local:FilterButton.ButtonState" Value="Off">
<Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource blueShader}"></Setter>
</Trigger>
<Trigger Property="local:FilterButton.ButtonState" Value="Disabled">
<Setter TargetName="ButtonBackground" Property="Background" Value="{StaticResource redShader}"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Foreground" Value="{StaticResource textBrush}"/>
<Setter Property="Margin" Value="4,4,0,4"></Setter>
<Setter Property="Padding" Value="4"></Setter>
<Setter Property="Height" Value="55"></Setter>
<Setter Property="Width" Value="55"></Setter>
<Setter Property="FontSize" Value="10"/>
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="TextBlock.TextWrapping" Value="Wrap"></Setter>
<Setter Property="HasDisabledState" Value="True"></Setter>
</Style>