wpf - WPF - FocusVisualStyle 移动

Question

我有一个带有一些按钮的 UserControl。我的按钮具有默认的 FocusVisualStyle（按钮周围的边框）。

当我用鼠标移动我的用户控件时，这个虚线边框不会随之移动。当您将鼠标悬停在屏幕的另一部分上时，它会移动到正确的位置。

我不想将 FocusVisualStyle 设置为 null，因为我需要查看聚焦的元素。我尝试创建自己的 FocusVisualStyle，但它的行为与默认样式相似。

我可以以某种方式将此边框与其余元素同步吗？

感谢帮助

Answer 1

正如 bitbonk 所说，RenderTransform 不会导致另一个排列过程，因此焦点视觉不会移动。您可以阅读这篇 WPF 博士文章，该文章讨论了该问题并提供了一些解决方法。在您的情况下，最简单的方法是将 AdornerDecorator 放在您的 UserControl 中围绕您的 UserControl 的内容，以便 AdornerLayer 也被移动。

Answer 2

当您使用矩形时RenderTransform，FocusVisualStyle不会随按钮一起移动，因为它是在布局过程中呈现的。这就是RenderTransform: 转换任何视觉对象并忽略视觉树其余部分的布局。

您必须使用LayoutTransform、Button.Margin或Canvas.Left、Canvas.Top来移动您的按钮。

Answer 3

MSDN的这段（有点神秘）摘录说明了这个问题的更一般形式：

焦点视觉样式专门用于键盘焦点。因此，焦点视觉样式是一种可访问性功能。如果您希望通过鼠标、键盘或以编程方式对任何类型的焦点进行 UI 更改，则不应使用焦点视觉样式，而应在样式或模板中使用设置器和触发器，这些样式或模板根据一般焦点属性的值工作例如 IsFocused 或 IsFocusWithin。

今天，关于使用触发器的最后一点可能会更好地替换为使用可视状态管理器的建议。这是一些这样做的 XAML，但也保留了Button's的原始设置FocusVisualStyle。Button当它从键盘接收焦点时，该设置会在 a 内绘制一个两个像素的虚线矩形。Storyboard用于Focused和视觉状态的我的 sUnfocused添加和删除一个实心矩形，在 a 内有四个像素Button，只要它因任何原因获得或失去焦点。

如果您在 WPF 窗口中创建一对Buttons 并通过键盘和鼠标操作焦点，Button用空格键和鼠标单击这些 s，您会看到 a通常在不出现Button时具有焦点。FocusVisualStyle同样，这（根据上面的摘录）是设计使然。（我对这是一个“辅助功能”感到困惑，因为它很容易忽略显示下次按下空格键时将单击哪个控件。我的倾向是根本不使用它。）

注意：下面的代码是用于派生自 的自定义控件Button，称为“ XLButton。” 如果您不想创建自定义控件来尝试此操作，可以将Style'sTargetType更改为。Button

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ExLuminaControls">

<Style x:Key="FocusVisual">
    <Setter Property="Control.Template">
        <Setter.Value>
            <ControlTemplate>
                <Rectangle Margin="2"
                           SnapsToDevicePixels="true"
                           Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                           StrokeThickness="1"
                           StrokeDashArray="1 2"/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>

<Style TargetType="{x:Type local:XLButton}">
    <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
    <Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="{x:Null}"/>
    <Setter Property="Padding" Value="1"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:XLButton}">
                <Grid>
                    <Border x:Name="border"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Background="{TemplateBinding Background}"
                            SnapsToDevicePixels="true"/>
                    <Rectangle x:Name ="glow" Fill="White" Opacity="0"/>
                    <Rectangle x:Name="shade" Fill="Black" Opacity="0"/>
                    <ContentPresenter x:Name="contentPresenter"
                                      Focusable="False"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      Margin="{TemplateBinding Padding}"
                                      RecognizesAccessKey="True"
                                      SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    <Rectangle x:Name="dis" Fill="Gray" Opacity="0"/>
                    <Rectangle x:Name="foc" Margin="4" SnapsToDevicePixels="true"
                               Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                               StrokeThickness="1" Opacity="0"/>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup Name="CommonStates">
                            <VisualState Name="Normal">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="glow"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="0" Duration="0:0:.1"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="glow"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To=".25" Duration="0:0:.1"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="shade"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To=".25" Duration="0:0:0"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="dis"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To=".25" Duration="0:0:0"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup Name="FocusStates">
                            <VisualState Name="Focused">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="foc"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="1" Duration="0:0:.1"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState Name="Unfocused">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="foc"
                                                         Storyboard.TargetProperty="Opacity"
                                                         To="0" Duration="0:0:.1"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
</ResourceDictionary>