更改样式颜色后刷新按钮

Question

所以，我在资源字典中有一个按钮模板。它在其正常 VisualState 中的颜色属性绑定到 MainPage C# 代码中定义的 DependencyProperty。请注意 MainControl 是 MainPage 名称。 这是 Button 模板：

<Style TargetType="Button" x:Key="MyButtonStyle">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <VisualState.Setters>
                                    <Setter Target="ellipse.(Shape.Fill)" Value="{Binding ElementName=MainControl, Path=ButtonColor}">
                                    </Setter>
                                    <Setter Target="ellipse.(Shape.Stroke)" Value="{x:Null}"/>
                                </VisualState.Setters>
                            </VisualState>
                            [Other Visual States...]
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Ellipse x:Name="ellipse"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这是 MainPage XAML：

<Page
x:Class="Volumio.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Volumio"
Name="MainControl">
<Grid Background="#FF525C66">
    <Button x:Name="toggle" Content="" HorizontalAlignment="Left" Height="132" Margin="40,146,0,0" VerticalAlignment="Top" Width="132" Style="{StaticResource MyButtonStyle}">
</Grid>

这里是我定义属性的地方：

public static DependencyProperty ColorProperty = DependencyProperty.Register("ButtonColor", typeof(SolidColorBrush),
        typeof(Page), PropertyMetadata.Create(NormalColor));

    public SolidColorBrush ButtonColor
    {
        get { return (SolidColorBrush)GetValue(ColorProperty); }
        set { SetValue(ColorProperty, value); }
    }

问题是：每当我将 ButtonColour 属性设置为不同的颜色时，Button 不会自动更改其颜色，而是我必须更改 VisualState 然后恢复正常以使其刷新并更改颜色。我更改了异步空隙中的属性。这有关系吗？

问题出在哪里？我必须从代​​码中手动刷新它吗？

这可能很明显，但我是 XAML 编程的新手。提前致谢。

Answer 1

VisualState 下的Setters 仅在将VisualState 用作当前状态时应用一次。并且当应用Setter 时，它会从其Value 属性中获取值并设置为其Target 属性中指定的目标元素和属性。

因此它不会将您的Binding 设置为ellipse 的Fill 属性，并且您的按钮不会改变其颜色，除非按钮的VisualState 再次变为Normal。

如果您希望您的按钮自动更改颜色，您可以删除VisualState.Setters 中的<Setter Target="ellipse.(Shape.Fill)" Value="{Binding ElementName=MainControl, Path=ButtonColor}"></Setter> 并使用Ellipse 中的Binding，例如：

<Ellipse x:Name="ellipse" Fill="{Binding ElementName=MainControl, Path=ButtonColor}" />

或者要重用这个Style，我们可以像这样将Fill属性绑定到Button的Background属性：

<Ellipse x:Name="ellipse" Fill="{TemplateBinding Background}" />

在 MainPage XAML 中使用：

 <Button x:Name="toggle"
    Width="132"
    Height="132"
    Margin="40,146,0,0"
    HorizontalAlignment="Left"
    VerticalAlignment="Top"
    Background="{Binding ElementName=MainControl,
                         Path=ButtonColor}"
    Style="{StaticResource MyButtonStyle}" />