以選項卡為中心的按鈕邊框顏色和樣式

我的用戶控制元件中有這個按鈕：

<Button
    x:Name="OkButton"
    Grid.Column="1"
    Command="{Binding Confirm}"
    IsDefault="True"
    IsEnabled="{Binding ConfirmEnabled}"
    Style="{StaticResource okCancelbuttons}"
    Visibility="{Binding ConfirmVisibility}">
    <Image
        Grid.Column="0"
        Margin="0"
        Source="{DynamicResource ResourceKey=confirm_res}" />

<!-- Style Dictionary -->
<Style x:Key="okCancelbuttons" TargetType="{x:Type Button}">
    <Setter Property="BorderBrush" Value="Black" />
    <Setter Property="BorderThickness" Value="3" />
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border
                    x:Name="Border"
                    Padding="3"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="0"
                    CornerRadius="3"
                    Style="{DynamicResource bordoPulsante}">
                    <ContentPresenter />
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Resources>
        <Style TargetType="Image">
            <Style.Triggers>
                <Trigger Property="IsEnabled" Value="True">
                    <Setter Property="Opacity" Value="1" />
                </Trigger>
                <Trigger Property="IsEnabled" Value="False">
                    <Setter Property="Opacity" Value="0.5" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </Style.Resources>
</Style>

<Style x:Key="bordoPulsante" TargetType="{x:Type Border}">
    <Setter Property="BorderBrush" Value="Black" />
    <Setter Property="CornerRadius" Value="3" />
    <Setter Property="Background" Value="Transparent" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="{StaticResource brushverdechiaro}" />
        </Trigger>
        <Trigger Property="IsMouseOver" Value="False">
            <Setter Property="Background" Value="Transparent" />
        </Trigger>
    </Style.Triggers>
</Style>

可能有人可能想要在表單中Tab反復點擊導航，但是當其他控制元件清楚地突出顯示時，按鈕會呈現一條非常小的黑色虛線，幾乎不可能看到：

我已經嘗試對樣式進行一些修改，但似乎沒有任何效果。有什么建議嗎？

uj5u.com熱心網友回復：

有一個名為FocusVisualStyleon的專用屬性FrameworkElement。

獲取或設定一個屬性，該屬性允許自定義外觀、效果或其他樣式特征，這些特征將在捕獲鍵盤焦點時應用于此元素。

盡管您可以創建 setter 并提供控制元件模板，但這不是很靈活，因為它將控制元件模板添加到控制元件本身的控制元件模板之上。

AFocusVisualStyle可以添加到來自顯式樣式或主題樣式的任何控制元件模板樣式；仍然可以通過使用 aControlTemplate并將該樣式設定為Style屬性來創建控制元件的主要樣式。

以下是您自己風格的焦點視覺風格示例。聚焦時，包含的模板會在按鈕周圍繪制一條 2 像素寬的藍線。

<Style x:Key="okCancelbuttons" TargetType="{x:Type Button}">
    <Setter Property="FocusVisualStyle">
        <Setter.Value>
            <Style>
                <Setter Property="Control.Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <Rectangle Margin="2" Stroke="Blue" StrokeThickness="2"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Setter.Value>
    </Setter>
    <!-- ...other markup. -->
</Style>

更靈活的方法是在樣式或控制元件模板的設定器中使用IsFocused和屬性。IsKeyboardFocusWithin后者允許您通過使用 參考來更改控制元件模板中任何控制元件的屬性TargetName。

另請注意，FocusVisualStyle明確設定為{x:Null}是為了洗掉帶有虛線邊框的默認焦點樣式。

<Style x:Key="okCancelbuttons" TargetType="{x:Type Button}">
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <!-- ...other setters. -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border
                  x:Name="Border"
                  Padding="3"
                  BorderBrush="{TemplateBinding BorderBrush}"
                  BorderThickness="0"
                  CornerRadius="3"
                  Style="{DynamicResource bordoPulsante}">
                    <ContentPresenter />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsFocused" Value="True">
                        <!-- ...your control template setters. -->
                    </Trigger>
                    <Trigger Property="IsKeyboardFocusWithin" Value="True">
                        <!-- ...your control template setters. -->
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsFocused" Value="True">
            <!-- ...your style setters. -->
        </Trigger>
        <Trigger Property="IsKeyboardFocusWithin" Value="True">
            <!-- ...your style setters. -->
        </Trigger>
    </Style.Triggers>
    <!-- ...other markup. -->
</Style>

檔案中關于更改焦點視覺樣式的警告：

從概念上講，應用于控制元件的焦點視覺樣式的外觀應該在各個控制元件之間保持一致。確保連貫性的一種方法是僅在您撰寫整個主題時更改焦點視覺樣式，其中在主題中定義的每個控制元件都獲得完全相同的焦點視覺樣式，[...]

在不屬于主題的單個控制元件樣式上設定 FocusVisualStyle 不是焦點視覺樣式的預期用途。

更多資訊，您可以參考以下文章：

• 如何：將 FocusVisualStyle 應用到控制元件
• 控制元件中焦點的樣式和 FocusVisualStyle

標籤：wpf xml 重点 控制模板

上一篇：將圖示放在居中按鈕旁邊的最簡單方法是什么？

下一篇：帶有List<class>的C#WPF組合框