Question

我有一个简单的按钮，如下所示：

<Button Height="20" Width="60" style="{StaticResource RedButtonStyle}"
        Click="Button_Click" />

现在在ResourceDictionary中我有两种Button样式：

<Style x:Key="RedButtonStyle" TargetType="Button">
    <Setter Property="Background" Value="Red" />
</Style>

<Style x:Key="BlueButtonStyle" TargetType="Button">
    <Setter Property="Background" Value="Blue" />
</Style>

现在我想在运行时更改按钮的样式。所以在按钮的点击事件中我做了类似的事情：

if (((Button)sender).Style == (Style)Application.Current.Resources["RedButtonStyle"])
{
    ((Button)sender).Style = (Style)Application.Current.Resources["BlueButtonStyle"];
}
else
{
    ((Button)sender).Style = (Style)Application.Current.Resources["RedButtonStyle"];
}

现在，当应用程序启动时，按钮的背景为红色。

When I click it for the first time it does not change it's colour.
When I click it for the Second time it changes it's colour to Blue.
When I click it for the Third time it changes it's colour to Red.
When I click it for the Fourth time it changes it's colour to Blue.
When I click it for the Fifth time it changes it's colour to Red.
When I click it for the Sixth time it changes it's colour to Blue.
......
.....

因此，如上所述，问题是：按钮在第一次单击时不会更改其样式。之后，它会继续按预期切换样式。

更新

在我的真实项目中，我有两个名为EditButton和SaveButton的样式，如下所示：

<Style TargetType="{x:Type Button}" x:Key="EditButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="Border" Background="{StaticResource BrushBlueSelector}" Padding="5,2" SnapsToDevicePixels="true" CornerRadius="3">
                    <Border.Effect>
                        <DropShadowEffect ShadowDepth="0" Color="Turquoise" BlurRadius="8" />
                    </Border.Effect>
                    <Path x:Name="buttonSymbol" Data="M0,44.439791L18.98951,54.569246 0.47998798,62.66881z M17.428029,12.359973L36.955557,23.568769 21.957478,49.686174 20.847757,46.346189 15.11851,45.756407 14.138656,42.166935 8.5292659,41.966761 6.9493899,38.037481 2.4399572,38.477377z M26.812517,0.0009765625C27.350616,-0.012230873,27.875986,0.10826397,28.348372,0.3782568L42.175028,8.3180408C43.85462,9.2780154,44.234529,11.777948,43.02482,13.89789L41.375219,16.767812 21.460039,5.3381228 23.10964,2.4582005C23.979116,0.941679,25.437378,0.034730911,26.812517,0.0009765625z" 
                          Stretch="Uniform" Fill="#FFFFFFFF" Width="24" Height="24" RenderTransformOrigin="0.5,0.5">
                        <Path.RenderTransform>
                            <TransformGroup>
                                <TransformGroup.Children>
                                    <RotateTransform Angle="0" />
                                    <ScaleTransform ScaleX="1" ScaleY="1" />
                                </TransformGroup.Children>
                            </TransformGroup>
                        </Path.RenderTransform>
                    </Path>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="{StaticResource BrushOrangeSelector}"/>
                        <Setter TargetName="Border" Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect ShadowDepth="0" Color="Orange" BlurRadius="10" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="{StaticResource BrushHeaderBackground}"/>
                        <Setter TargetName="Border" Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect ShadowDepth="0" Color="Gray" BlurRadius="10" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>

    <Setter Property="Tag" Value="EditButton" />
    <Setter Property="Margin" Value="3" />
    <Setter Property="Focusable" Value="False" />

</Style>

<Style TargetType="{x:Type Button}" x:Key="SaveButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="Border" Background="{StaticResource BrushBlueSelector}" Padding="5,2" SnapsToDevicePixels="true" CornerRadius="3">
                    <Border.Effect>
                        <DropShadowEffect ShadowDepth="0" Color="Turquoise" BlurRadius="2" />
                    </Border.Effect>
                    <Path x:Name="buttonSymbol" Data="M8.1099597,36.94997L8.1099597,41.793968 39.213959,41.793968 39.213959,36.94997z M12.42,0.049999889L18.4,0.049999889 18.4,12.252 12.42,12.252z M0,0L7.9001866,0 7.9001866,14.64218 39.210766,14.64218 39.210766,0 47.401001,0 47.401001,47.917 0,47.917z" 
                          Stretch="Uniform" Fill="#FFFFFFFF" Width="24" Height="24" RenderTransformOrigin="0.5,0.5">
                        <Path.RenderTransform>
                            <TransformGroup>
                                <TransformGroup.Children>
                                    <RotateTransform Angle="0" />
                                    <ScaleTransform ScaleX="1" ScaleY="1" />
                                </TransformGroup.Children>
                            </TransformGroup>
                        </Path.RenderTransform>
                    </Path>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="Green"/>
                        <Setter TargetName="Border" Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect ShadowDepth="0" Color="Green" BlurRadius="10" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter TargetName="Border" Property="Background" Value="{StaticResource BrushHeaderBackground}"/>
                        <Setter TargetName="Border" Property="Effect">
                            <Setter.Value>
                                <DropShadowEffect ShadowDepth="0" Color="Gray" BlurRadius="10" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>

    <Setter Property="Tag" Value="SaveButton" />
    <Setter Property="Margin" Value="3" />
    <Setter Property="Focusable" Value="False" />

</Style>

此样式适用于位于DataGridColumn内的按钮。我的输出如下：

最初：

enter image description here

我第一次点击编辑按钮后：

enter image description here

第二次点击编辑按钮后：

enter image description here

同样，第四次更改为EditButton，第五次更改为SaveButton。

Answer 1

试试这段代码，它可能适合你：

XAML

<Application.Resources>
    <Style x:Key="RedButtonStyle" TargetType="{x:Type Button}">
        <Setter Property="Tag" Value="RedButton" />
        <Setter Property="Background" Value="Red" />
    </Style>

    <Style x:Key="BlueButtonStyle" TargetType="{x:Type Button}">
        <Setter Property="Tag" Value="BlueButton" />
        <Setter Property="Background" Value="Blue" />
    </Style>
</Application.Resources>

Code behind

private void Button_Click(object sender, RoutedEventArgs e)
{
    var button = sender as Button;
    string tagValue = String.Empty;

    if (button != null)
    {
        tagValue = button.Tag.ToString();

        if (tagValue == "RedButton")
        {
            button.Style = (Style)Application.Current.Resources["BlueButtonStyle"];
        }
        else if (tagValue == "BlueButton")
        {
            button.Style = (Style)Application.Current.Resources["RedButtonStyle"];
        }
    }
}

在运行时更改样式

1 个答案: