按下按钮时,更改按钮上的焦点颜色

时间:2014-03-12 08:26:50

标签: c# wpf xaml mvvm

我有黑色背景的按钮。当您选项卡到按钮时,由于Button的背景颜色,您现在看不到焦点位于Button上。如何将焦点框架更改为红色?

(当你专注于按钮时,你会在按钮中看到一些带点的框架)

<Border x:Name="border" Background="{TemplateBinding Background}">
    <ContentPresenter x:Name="contentPresenter"
         ContentTemplate="{TemplateBinding ContentTemplate}"
         Content="{TemplateBinding Content}"
         ContentStringFormat="{TemplateBinding ContentStringFormat}"
         Focusable="False"/>
</Border>
<ControlTemplate.Triggers>
         <Trigger Property="IsMouseOver" Value="True">
              <Setter Property="Opacity" Value="1" />
         </Trigger>

....

2 个答案:

答案 0 :(得分:2)

试试这个

<Style TargetType="Button">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="FocusVisualStyle">
            <Setter.Value>
                <Style TargetType="Control">
                    <Setter Property="Control.Template">
                        <Setter.Value>
                            <ControlTemplate>
                                 <Rectangle x:Name="bd" Stroke="Red" SnapsToDevicePixels="True" StrokeThickness="1" StrokeDashCap="Triangle" StrokeDashArray="1,2" Margin="1" />
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border x:Name="border" BorderBrush="Transparent" BorderThickness="1"  Background="{TemplateBinding Background}">
                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="Black"></Setter>
                            <Setter TargetName="border" Property="Margin" Value="1"></Setter>
                        </Trigger>
                        <Trigger Property="IsFocused" Value="True">
                            <Setter Property="Foreground" Value="Red"></Setter>                                
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
<Button Content="Hello World" Background="Gray" Height="35" Width="200" ></Button>

<强>更新

根据我的未启用的知识元素不参与命中测试或焦点,因此不会成为输入事件的来源。因此必须使用这样的解决方法:

<Window.Resources>
        <Style x:Key="FocusVisualStyle">
        <Setter Property="Control.Template">
            <Setter.Value>
                <ControlTemplate>
                    <Rectangle x:Name="bd" Stroke="Red" SnapsToDevicePixels="True" StrokeThickness="1" StrokeDashCap="Triangle" StrokeDashArray="1,2" Margin="1" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="Buttonstyle" TargetType="Button">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="SnapsToDevicePixels" Value="True"/>
        <Setter Property="IsEnabled" Value="True"/>
        <Setter Property="FocusVisualStyle" Value="{DynamicResource FocusVisualStyle}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border x:Name="border" Focusable="False" BorderBrush="Transparent" BorderThickness="1"  Background="{TemplateBinding Background}">
                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="Center" VerticalAlignment="Center" ContentStringFormat="{TemplateBinding ContentStringFormat}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter TargetName="border" Property="BorderBrush" Value="Black"></Setter>
                            <Setter TargetName="border" Property="Margin" Value="1"></Setter>
                        </Trigger>
                        <Trigger Property="IsFocused" Value="True">
                            <Setter Property="Foreground" Value="Red"></Setter>
                        </Trigger>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="Opacity" Value="0.3"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid x:Name="gd"  Height="35" Width="200">
    <Grid.Style>
         <Style TargetType="Grid">
              <Style.Triggers>
                   <DataTrigger Binding="{Binding ElementName=bt,Path=IsEnabled}" Value="False">
                       <Setter Property="Focusable" Value="True"></Setter>
                       <Setter Property="FocusVisualStyle" Value="{DynamicResource FocusVisualStyle}"/>
                    </DataTrigger>
               </Style.Triggers>
          </Style>
     </Grid.Style>
     <Button x:Name="bt" IsEnabled="False" Style="{StaticResource Buttonstyle}" Content="Hello World"   IsTabStop="True"  Background="Gray"/>
</Grid>

答案 1 :(得分:0)

在触发器中使用IsFocused依赖项属性。我建议你改变边框宽度或颜色,以区分按钮和未聚焦的按钮。据我所知,指示焦点的虚线矩形仅在构建的控件中实现。如果您制作模板,则应覆盖它以满足您的需求。