TargetType不匹配元素的类型

Question

我为TargetType of Button定义了一个简单的Button；但是将样式设置为按钮会让人感到意外。

<Window>
    <Window.Resources>
        <Style x:Key="buttonStyle" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Magenta"/>
        </Style>
    </Window.Resources>
    <StackPanel Orientation="Horizontal">
        <Button Content="1" FocusVisualStyle="{StaticResource buttonStyle}"/>
    </StackPanel>
</Window>

附加信息：“按钮”TargetType不匹配元素“Control”的类型。

此外，将TargetType设置为Control将移除运行时错误，但按钮的视觉样式在获得Focus时不会改变。

样式在设置为Button.Style时工作

编辑I有两个具体问题：

1. 我同意FocusVisualStyle是FrameworkElement和FrameworkContentElement的属性，但是为什么在按钮上设置它是错误的，尽管样式是名称样式，而不是类型样式？
2. 为什么FocusVisualStyle不被呈现在Button上？Button.FocusVisualStyle是否在内部被更高优先级的值覆盖，如模板、触发器或模板触发器？

Answer 1

FocusVisualStyle允许您在控件聚焦时向用户提供视觉反馈。例如，添加一个Rectangle，它看起来像控件的边框。

Style是控件本身的外观和感觉。这一切都解释了这里。

FocusVisualStyle不是Button本身的样式，而是Button聚焦时的样式。

有关详细信息，请参阅这里。

我认为你想要的是一个Trigger。

<Style x:Key="buttonStyle" TargetType="{x:Type Button}">
    <Style.Triggers>
        <Trigger Property="IsFocused" Value="True">
            <Setter Property="Background" Value="Magenta"/>
        </Trigger>
    </Style.Triggers>
</Style>

然后，您可以设置Style的Button，如下所示：

<Button Style="{StaticResource buttonStyle}" ... />

Answer 2

你应该这样用它

        <Style x:Key="buttonStyle" TargetType="{x:Type Button}">
            <Style.Triggers>
                <Trigger Property="IsFocused" Value="True">
                    <Setter Property="Background" Value="Magenta" />
                </Trigger>
            </Style.Triggers>
        </Style>

然后像这样设置：

<Button Content="1" Style="{StaticResource buttonStyle}"/>

为了更好地看到这一点：

         <Style x:Key="buttonStyle" TargetType="{x:Type Button}">
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Magenta" />
                </Trigger>
            </Style.Triggers>
        </Style>

来自MSDN

焦点视觉样式特性提供了一个常见的“对象模型”，用于将基于键盘导航的可视用户反馈引入到任何UI元素中。这在不向控件应用新模板或不知道特定模板组合的情况下是可能的。

Answer 3

为了说明按钮和焦点视觉样式之间的区别，请考虑以下几点：

<Style x:Key="rectFocusVisual" TargetType="{x:Type Rectangle}">
  <Setter Property="Margin" Value="2" />
  <Setter Property="SnapsToDevicePixels" Value="true" />
  <Setter Property="Stroke" Value="Red" />
  <Setter Property="StrokeThickness" Value="1" />
  <Setter Property="StrokeDashArray" Value="1 3" />
</Style>
<Style x:Key="focusVisual">
  <Setter Property="Control.Template">
    <Setter.Value>
      <ControlTemplate>
        <Rectangle Style="{StaticResource rectFocusVisual}" />
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>
<Style x:Key="button" TargetType="{x:Type Button}">
  <Setter Property="Background" Value="Green" />
</Style>

以及：

<Button
  Content="I am a green button with red focus rectangle"
  FocusVisualStyle="{StaticResource focusVisual}"
  Style="{StaticResource button}" />
<ComboBox FocusVisualStyle="{StaticResource focusVisual}" />

当按钮被赋予焦点时，这种差异将是显而易见的。该按钮应显示绿色，如果聚焦将显示一个红色焦点矩形。如果组合框获得焦点，它将有一个类似的红色矩形。

虽然按钮样式只能用于button元素，但是focusVisual样式可以用于任何支持它的元素。这样，任何元素都可以使用一致的焦点样式，而不管其底层控件类型如何。