通过

如何：对控件应用 FocusVisualStyle

  • 项目

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

示例

以下示例定义的样式创建了其他控件组合，此组合仅在控件在用户界面 (UI) 中使用键盘设定为焦点时才适用。 这是通过使用 ControlTemplate 定义样式，然后在设置 FocusVisualStyle 属性时将该样式引用为资源来实现的。

一个类似于边框的外部矩形将放置在矩形区域之外。 除非另有修改，否则调整样式大小时将使用应用焦点视觉样式的矩形控件的 ActualHeight 和 ActualWidth。 此示例将 Margin 设置为负值，以使边框略微超出焦点控件。

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://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 可添加到任何控件模板样式（来自显式样式或主题样式）；仍然可以通过使用 ControlTemplate 并将该样式设置为 Style 属性来创建控件的主要样式。

主题或 UI 中使用的焦点视觉样式应一致，而不是针对每个可聚焦的元素使用不同的视觉样式。 有关详细信息，请参阅为控件中的焦点设置样式以及 FocusVisualStyle。

另请参阅