WPF更改背景的残疾人按钮

Question

我想学习WPF，我已经做了一个简单的井字游戏应用程序。该应用程序的工作原理，但我想尝试一下。我找不到如何为所有按钮设置禁用按钮的背景（并保持内容可见）。我的问题是如何设置资源字典中的代码？评论的代码是我尝试过的。为了给所有按钮提供相同的样式，我添加了一个资源字典。

资源字典

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 

    <Style TargetType="Button"> 
     <Style.Triggers> 
      <Trigger Property="IsEnabled" Value="false"> 
       <Setter Property="Template"> 
        <Setter.Value> 
         <ControlTemplate> 
          <!--<Border BorderBrush="Black" BorderThickness="1"> 
           <TextBlock Text="{Binding Path=SelectedDate, 
           StringFormat={}{0:d}, 
           RelativeSource={RelativeSource TemplatedParent}}" 
           VerticalAlignment="Center" HorizontalAlignment="Left" 
           Padding="4,0,0,0" /> 
          </Border>--> 
          <!--<Border BorderBrush="Aquamarine" BorderThickness="1"></Border>--> 
          <!-- Outer Rectangle with rounded corners. --> 
          <!-- Present Content (text) of the button. -->       
         </ControlTemplate> 
        </Setter.Value> 
       </Setter> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 

</ResourceDictionary> 

的App.xaml

<Application x:Class="FirstApplication.App" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      StartupUri="MainWindow.xaml"> 
    <Application.Resources> 
      <ResourceDictionary Source="ResourceDictionary.xaml" /> 
    </Application.Resources> 
</Application> 

MainWindow.xaml

<Window x:Class="FirstApplication.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="500" Width="525"> 

    <Grid Margin="0,0,0.4,-19.2" Name="controlGrid"> 
     <Button x:Name="A" Content="" HorizontalAlignment="Left" Margin="117,59,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="B" Content="" HorizontalAlignment="Left" Margin="223,59,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="C" Content="" HorizontalAlignment="Left" Margin="330,59,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="D" Content="" HorizontalAlignment="Left" Margin="117,157,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" RenderTransformOrigin="0.302,0.614" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="E" Content="" HorizontalAlignment="Left" Margin="223,157,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="F" Content="" HorizontalAlignment="Left" Margin="330,157,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="G" Content="" HorizontalAlignment="Left" Margin="117,255,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="H" Content="" HorizontalAlignment="Left" Margin="223,255,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <Button x:Name="I" Content="" HorizontalAlignment="Left" Margin="330,255,0,0" VerticalAlignment="Top" Width="75" Height="75" Click="button_click" Background="#FFEBEB33" MouseEnter="button_enter" MouseLeave="button_leave" FontSize="36"/> 
     <ToolBar Margin="0,0,0,450.6"> 
      <Button Name="newButton" Click="newButton_Click">New</Button> 
     </ToolBar> 
    </Grid> 
</Window> 

Answer 1

可能超过您寻找的：

<Style TargetType="{x:Type Button}" x:Key="ButtonBase"> 
    <Setter Property="BorderThickness" Value="1" /> 
    <Setter Property="Foreground" Value="#FF959595" /> 
    <Setter Property="HorizontalContentAlignment" Value="Center" /> 
    <Setter Property="VerticalContentAlignment" Value="Center" /> 
    <Setter Property="Padding" Value="10,0" /> 
    <Setter Property="Margin" Value="2" /> 
    <Setter Property="FontFamily" Value="Segoe UI" /> 
    <Setter Property="Height" Value="25" /> 
    <Setter Property="MinWidth" Value="100" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Grid> 
        <VisualStateManager.VisualStateGroups> 
         <VisualStateGroup x:Name="CommonStates"> 
          <VisualState x:Name="Normal"> 
           <Storyboard> 
            <ColorAnimation To="#FFFFFFFF" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" 
                Duration="0:0:0.07" /> 
            <ColorAnimation To="#FFDEDEDE" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" 
                Duration="0:0:0.07" /> 
            <ColorAnimation To="#FF959595" Storyboard.TargetName="BrBrush" 
                Storyboard.TargetProperty="Color" Duration="0:0:0.07" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="MouseOver"> 
           <Storyboard> 
            <ColorAnimation To="#FF00B4E4" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" 
                Duration="0:0:0.07" /> 
            <ColorAnimation To="#FF0083C3" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" 
                Duration="0:0:0.07" /> 
            <ColorAnimation To="#FF4C7B8F" Storyboard.TargetName="BrBrush" 
                Storyboard.TargetProperty="Color" Duration="0:0:0.07" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Pressed"> 
           <Storyboard> 
            <ColorAnimation To="#DBEDFD" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" 
                Duration="0:0:0.05" /> 
            <ColorAnimation To="#C4E0FC" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" 
                Duration="0:0:0.05" /> 
            <ColorAnimation To="#4C7B8F" Storyboard.TargetName="BrBrush" 
                Storyboard.TargetProperty="Color" Duration="0:0:0.05" /> 
           </Storyboard> 
          </VisualState> 
          <VisualState x:Name="Disabled"> 
           <Storyboard> 
            <ColorAnimation To="#EFEFEF" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[0].(GradientStop.Color)" 
                Duration="0:0:0" /> 
            <ColorAnimation To="#EFEFEF" Storyboard.TargetName="BgBrush" 
                Storyboard.TargetProperty="(GradientBrush.GradientStops)[1].(GradientStop.Color)" 
                Duration="0:0:0" /> 
            <ColorAnimation To="#D9D9D9" Storyboard.TargetName="BrBrush" 
                Storyboard.TargetProperty="Color" Duration="0:0:0" /> 
           </Storyboard> 
          </VisualState> 
         </VisualStateGroup> 
        </VisualStateManager.VisualStateGroups> 
        <Border x:Name="Chrome" BorderThickness="{TemplateBinding BorderThickness}" 
          SnapsToDevicePixels="true"> 
         <Border.BorderBrush> 
          <SolidColorBrush x:Name="BrBrush" Color="#ACACAC" /> 
         </Border.BorderBrush> 
         <Border.Background> 
          <LinearGradientBrush x:Name="BgBrush" EndPoint="0,1" StartPoint="0,0"> 
           <GradientStop Color="#FFF0F0F0" Offset="0" /> 
           <GradientStop Color="#FFE5E5E5" Offset="1" /> 
          </LinearGradientBrush> 
         </Border.Background> 
         <ContentPresenter 
          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" 
          SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" /> 
        </Border> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="true"> 
         <Setter Property="Foreground" Value="#FFFFFF" /> 
        </Trigger> 
        <Trigger Property="IsEnabled" Value="false"> 
         <Setter Property="Foreground" Value="#ADADAD" /> 
        </Trigger> 
        <Trigger Property="IsPressed" Value="true"> 
         <Setter Property="Foreground" Value="#000000" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

由景景基础上的意见/反馈

编辑

上面的例子肯定是超过了OP请求，但考虑到这个问题的背景和他们的Button控制State造型的兴趣，我觉得这有利于提供额外的细节（尽管没有公认的解释）。

之前<Setter Property="Tempalte">我正在改变Button控制的基本视觉风格。我希望这些都不需要解释，因为它看起来相当自我解释。

后<Setter Property="Template">我改变ButtonControlTemplate的visual states（这些Normal，MouseOver，Pressed & Disabled）。这使我可以在Button处于这些状态之一时自定义外观。在这个例子中，我使用的是StoryBoard，这样我就可以动画Button的State转换。

这四个State s以类似的格式（动画渐变背景&动画纯色边框）样式化，这些状态之间的差异是它们用于提供所需效果的颜色和持续时间。

在VisualState之后，我修改了主要内容模板，我想如何显示Button控件。我提供ContentPresenter，将用于显示Button的内容，我将ContentPresenter的某些特征绑定到作为模板的Button，如果需要，可以根据每个Button来控制这些特征。 ContentPresenter被Border包围，其定义了BrBrush（边框刷）和BgBrush（背景刷）。这些是与VisualStates模板中引用的相同的画笔，并为它们提供了工作的默认状态。

最后我改变ControlTemplate.Triggers的基础上，启动Trigger的PropertyValue定制Button（在这个例子中的前景颜色）的视觉风格。