我怎样才能*不*禁用禁用按钮内容中的边框？

Question

我有一排按钮，我在其中使用背景来表示简单色板的颜色。 问题是当按钮被禁用时，它会通过样式覆盖背景，完全用相同的灰色替换颜色，所以您不仅看不到 colors，而且它们看起来都像占位符，因为它们没有任何其他内容.

在这里，它们都已启用...

在这里他们都被禁用了......

在一个完美的世界中，我希望他们使背景变暗，而不是删除/覆盖它，但如果它根本没有做任何事情，我会很高兴。

现在我知道我可以重新设置按钮模板的样式，但我想知道是否有办法说“不要根据启用/禁用更新视觉样式”而不必做所有这些。 简单地调暗它们也是合适的，但是完全像那样替换它们是一个问题。

那么是否有这样的事情，或者我将不得不重新模板按钮？

现在，我的技巧是删除命令的CanExecute检查，使其始终处于启用状态，然后只需在命令的Executed处理程序中进行处理（或不进行处理）。

Answer 1

正如您已经说过的，设置按钮的Background将不起作用，因为默认样式和控件模板将覆盖诸如Mouse Over 、 Pressed或Disabled等状态的背景。

比创建自定义模板更轻量级的变体是创建一个Button样式，使用内容模板将颜色显示为Content 。 如果内容类型是Brush ，则Border会显示颜色。 触发器确保根据父Button的IsEnabled调整Opacity 。

<Style x:Key="ColorSwatchButtonStyle"  TargetType="{x:Type Button}" BasedOn="{StaticResource {x:Type Button}}">
   <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
   <Setter Property="VerticalContentAlignment" Value="Stretch"/>
   <Setter Property="ContentTemplate">
      <Setter.Value>
         <DataTemplate DataType="{x:Type Brush}">
            <Border Background="{Binding}">
               <Border.Style>
                  <Style TargetType="{x:Type Border}">
                     <Setter Property="Opacity" Value="1.0"/>
                     <Style.Triggers>
                        <DataTrigger Binding="{Binding IsEnabled, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="False">
                           <Setter Property="Opacity" Value="0.3"/>
                        </DataTrigger>
                     </Style.Triggers>
                  </Style>
               </Border.Style>
            </Border>
         </DataTemplate>
      </Setter.Value>
   </Setter>
</Style>

如果您不想在Border中放置样式，请改用数据模板触发器。

<Style x:Key="ColorSwatchButtonStyle"  TargetType="{x:Type Button}" BasedOn="{StaticResource {x:Type Button}}">
   <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
   <Setter Property="VerticalContentAlignment" Value="Stretch"/>
   <Setter Property="ContentTemplate">
      <Setter.Value>
         <DataTemplate DataType="{x:Type Brush}">
            <Border x:Name="ColorBorder"  Background="{Binding}"/>
            <DataTemplate.Triggers>
               <DataTrigger Binding="{Binding IsEnabled, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="False">
                  <Setter TargetName="ColorBorder" Property="Opacity" Value="0.3"/>
               </DataTrigger>
               <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="True">
                  <Setter TargetName="ColorBorder" Property="Opacity" Value="0.8"/>
               </DataTrigger>
               <DataTrigger Binding="{Binding IsPressed, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="True">
                  <Setter TargetName="ColorBorder" Property="Opacity" Value="0.5"/>
               </DataTrigger>
            </DataTemplate.Triggers>
         </DataTemplate>
      </Setter.Value>
   </Setter>
</Style>

显式应用样式或删除x:Key以使样式隐式并将其应用于 scope 中的所有按钮。 将颜色设置为Button的Content 。

<Button Style="{StaticResource ColorSwatchButtonStyle}"
        Content="{x:Static Brushes.Red}"/>

作为这种方法的说明，由于内容Border遮挡了按钮的背景，您将看不到上述状态下的效果。 但是，您可以向此样式添加触发器，以在鼠标悬停和按下状态下适当地显示您的 colors。

<DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="True">
   <Setter Property="Opacity" Value="0.8"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsPressed, RelativeSource={RelativeSource AncestorType={x:Type Button}}}" Value="True">
   <Setter Property="Opacity" Value="0.5"/>
</DataTrigger>

这只是一个示例，当然，您也可以更改BorderBrush和BorderThickness或将其他元素添加到模板中。 您不仅限于更改Opacity 。

---

或者，您始终可以使用 Blend 或 Visual Studio复制默认样式和控件模板。 然后您可以调整按钮的受影响状态以以不同的方式显示Background 。

Answer 2

如果要禁用Button而不更改其外观，可以将IsHitTestVisible设置为false ，而不是设置IsEnabled属性。

然后，您可以使用Opacity属性进行调光。

另一种选择是创建自定义ControlTemplate 。