如何:对控件应用 FocusVisualStyle

更新:2007 年 11 月

此示例演示如何使用 FocusVisualStyle 属性在资源中创建一个焦点视觉样式,并将该样式应用于某个控件。

示例

下面的示例定义一个样式,该样式创建其他控件合成,只有当该控件是用户界面 (UI) 中的键盘焦点时,才应用该控件合成。这是通过使用 ControlTemplate 定义一个样式,然后在设置 FocusVisualStyle 属性时将该样式作为一个资源进行引用来实现的。

一个类似于边框的外部矩形放置在矩形区域之外。除非进行了修改,否则样式使用应用了焦点视觉样式的矩形控件的 ActualHeightActualWidth 来调整大小。本示例为 Margin 设置了负值,以使边框稍微出现在焦点控件的外部。

<Page
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
>
  <Page.Resources>
    <Style x:Key="MyFocusVisual">
      <Setter Property="Control.Template">
        <Setter.Value>
          <ControlTemplate>
            <Rectangle Margin="-2" StrokeThickness="1" Stroke="Red" StrokeDashArray="1 2"/>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
  </Page.Resources>
  <StackPanel Background="Ivory" Orientation="Horizontal">
    <Canvas Width="10"/>
    <Button Width="100" Height="30" FocusVisualStyle="{DynamicResource MyFocusVisual}">
      Focus Here</Button>
    <Canvas Width="100"/>
    <Button Width="100" Height="30" FocusVisualStyle="{DynamicResource MyFocusVisual}">
      Focus Here</Button>
  </StackPanel>
</Page>

有关完整示例,请参见 创建 FocusVisualStyle 示例

FocusVisualStyle 是对显式样式或主题样式附带的任何控件模板样式的补充;控件的主要样式仍然可以使用 ControlTemplate 并将该样式设置为 Style 属性来创建。

一个主题或 UI 中应统一使用焦点可视化样式,而不是为每个可设定焦点的元素使用不同的样式。有关详细信息,请参见为控件中的焦点设置样式以及 FocusVisualStyle

请参见

概念

样式设置和模板化

为控件中的焦点设置样式以及 FocusVisualStyle

参考

FocusVisualStyle