【问题标题】:How to change background color of buttons on click on any of them?单击任何按钮时如何更改按钮的背景颜色?
【发布时间】:2011-05-25 13:35:02
【问题描述】:

我有 3 个按钮。我创建了一种用于所有三个按钮的样式,以显示 MouseOver 和 Pressed 状态。我需要有逻辑来指示选择/单击了哪个按钮。如果单击按钮,则背景颜色应保持/与按下状态相同,其他两个按钮应重置为背景颜色以作为正常状态。下面是我的代码。我想知道是否有可能在 XAML 中实现所有功能,或者如何在后面的代码中实现?谢谢我提前。

<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
x:Class="test3.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">

<Window.Resources>  
    <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}">
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Padding" Value="1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" SnapsToDevicePixels="true" Background="#FFFFE640">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ButtonBackground">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFC8B432"/>
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ButtonBackground">
                                            <EasingColorKeyFrame KeyTime="0" Value="#FFBCAA31"/>
                                        </ColorAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <ContentPresenter RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" Margin="0,0,0,4" HorizontalAlignment="Center" VerticalAlignment="Bottom"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsKeyboardFocused" Value="true">
                        </Trigger>
                        <Trigger Property="ToggleButton.IsChecked" Value="true">
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="false">
                            <Setter Property="Foreground" Value="#ADADAD"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Storyboard x:Key="OnMouseOneEnter">
        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="button_One">
            <EasingColorKeyFrame KeyTime="0" Value="#FFDAC326"/>
        </ColorAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="OnMouseOneLeave">
        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="button_One">
            <EasingColorKeyFrame KeyTime="0" Value="#FFFFE640"/>
        </ColorAnimationUsingKeyFrames>
        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="button_Two">
            <EasingColorKeyFrame KeyTime="0" Value="#FF85781C"/>
        </ColorAnimationUsingKeyFrames>
    </Storyboard>
    <Storyboard x:Key="OnMoseOneClick">
        <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="button_One">
            <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FFDAC326"/>
        </ColorAnimationUsingKeyFrames>
    </Storyboard>
</Window.Resources>

<Grid>
    <StackPanel x:Name="LayoutRoot">
        <Button x:Name="button_One" HorizontalAlignment="Left" Width="90" Height="90"  Content="One" Style="{DynamicResource ButtonStyle1}" Cursor="Hand" Margin="0,0,0,4" />
        <Button x:Name="button_Two" HorizontalAlignment="Left" Width="90" Height="90" Content="Two" Style="{DynamicResource ButtonStyle1}" Cursor="Hand" Margin="0,0,0,4" />
        <Button x:Name="button_Three" HorizontalAlignment="Left" Width="90" Height="90" Content="Two" Style="{DynamicResource ButtonStyle1}" Cursor="Hand" Margin="0,0,0,4" />
    </StackPanel>   
</Grid>

【问题讨论】:

    标签: wpf wpf-controls


    【解决方案1】:

    您可以将其更改为使用“IsFocused”属性,而不是“IsPressed”

    【讨论】:

      【解决方案2】:

      在我看来,您实际上是在追求单选按钮功能。

      http://www.wpftutorial.net/RadioButton.html

      为每个单选按钮指定相同的 GroupName,您将获得所需的功能。

      【讨论】:

        【解决方案3】:

        切换按钮?创建一个由两个按钮组成的 Toggle Button 用户控件。一开始是隐藏的。当您单击可见的时,将其隐藏并显示隐藏的。然后您还可以在 OnClick 事件中隐藏/显示其他按钮。

        【讨论】:

        • 我无法使用切换按钮。是否可以通过单击按钮来控制每个按钮的背景颜色值?
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2015-08-08
        • 1970-01-01
        • 2020-09-13
        • 2014-10-09
        • 2017-08-02
        • 2014-10-10
        相关资源
        最近更新 更多