当应用程序失去焦点时视觉上指示最后关注的项目/IsKeyboardFocusWithin的替代方法 [英] Visual indication of last focused item when application loses focus / alternative to IsKeyboardFocusWithin

查看:104
本文介绍了当应用程序失去焦点时视觉上指示最后关注的项目/IsKeyboardFocusWithin的替代方法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在具有多个要与之交互的面板或文档的应用程序中,需要明确指出应用程序的哪个区域具有焦点. Visual Studio本身就是一个很好的例子.

In an application with multiple panels or documents to interact with, one needs a clear indication of which area of the app has focus. Visual Studio itself is a good example of this.

以下 MCV示例即将达到预期的效果.
但是,由于它使用IsKeyboardFocusWithin,因此当应用程序自身失去焦点时,不会维护应用程序中最近关注的项目.

The following MCV Example is close to achieving the desired effect.
However, because it uses IsKeyboardFocusWithin, the most recently focused item in the application is not maintained when the application itself loses focus.

期望的行为:当应用程序失去焦点时,将保留由蓝色"SelectedColor"指示的焦点项目. Visual Studio会执行此操作.

Desired Behavior: The focused item indicated by blue "SelectedColor" is maintained when the application loses focus. Visual Studio does this.

应用失去焦点时如何保持焦点指示?

  • 代码

注意:没有代码隐藏.这是完整的示例.

<Window x:Class="TrackFocusMCVE.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
    Title="MainWindow" Height="150" Width="300">
<Window.Resources>

    <SolidColorBrush x:Key="MouseOverColor" Color="#FF1C97EA"/>
    <SolidColorBrush x:Key="SelectedColor" Color="#FF007ACC"/>
    <SolidColorBrush x:Key="InactiveColor" Color="#19FFFFFF"/>
    <SolidColorBrush x:Key="BackgroundColor" Color="#FF44454B"/>

    <Style x:Key="TabControlStyle" TargetType="{x:Type TabControl}">
        <Setter Property="Margin" Value="5,15,5,7"/>
        <Setter Property="Padding" Value="0"/>
        <Setter Property="BorderThickness" Value="0,2,0,0"/>
        <Setter Property="BorderBrush" Value="{DynamicResource InactiveColor}"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="{StaticResource BackgroundColor}"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Style.Triggers>
            <Trigger Property="IsKeyboardFocusWithin" Value="True">
                <Setter Property="TabControl.BorderBrush" Value="{StaticResource SelectedColor}"/>
            </Trigger>
        </Style.Triggers>
    </Style>

    <Style x:Key="TabItemStyle" TargetType="{x:Type TabItem}">
        <Setter Property="Padding" Value="15,2"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                    <Border Name="TabBorder" MinWidth="40" MinHeight="20"
                            BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"
                            Margin="{TemplateBinding Margin}" Padding="{TemplateBinding Padding}"
                            Background="{TemplateBinding Background}">
                        <ContentPresenter ContentSource="Header" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsMouseOver, RelativeSource={RelativeSource Self}}" Value="true" />
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="false"/>
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="TabBorder" Property="Background" Value="{StaticResource MouseOverColor}"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsKeyboardFocusWithin, RelativeSource={RelativeSource Self}}" Value="false" />
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="TabBorder" Property="Background" Value="{StaticResource InactiveColor}"/>
                        </MultiDataTrigger>
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsKeyboardFocusWithin, RelativeSource={RelativeSource Self}}" Value="true" />
                                <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true"/>
                            </MultiDataTrigger.Conditions>
                            <Setter TargetName="TabBorder" Property="Background" Value="{StaticResource SelectedColor}"/>
                        </MultiDataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
    <Grid Background="DimGray">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TabControl Grid.Column="0" x:Name="tc1" Style="{DynamicResource TabControlStyle}">
            <TabItem Header="1" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
            <TabItem Header="2" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
            <TabItem Header="3" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
        </TabControl>
        <TabControl Grid.Column="1" x:Name="tc2" Style="{DynamicResource TabControlStyle}">
            <TabItem Header="4" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
            <TabItem Header="5" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
            <TabItem Header="6" Content="Tab Content" Style="{DynamicResource TabItemStyle}"/>
        </TabControl>
    </Grid>
</Window>

推荐答案

部分答案:

当窗口失去焦点时,可以通过将MultiDataTrigger Condition更改为IsFocused而不是IsKeyboardFocusWithin来使焦点突出的选项卡保持蓝色,如下所示:

You can make your focused tab stay blue when the window loses focus by changing your MultiDataTrigger Condition to use IsFocused instead of IsKeyboardFocusWithin like this:

<MultiDataTrigger>
    <MultiDataTrigger.Conditions>
        <Condition Binding="{Binding IsFocused, RelativeSource={RelativeSource Self}}" Value="true" />
        <Condition Binding="{Binding IsSelected, RelativeSource={RelativeSource Self}}" Value="true" />
    </MultiDataTrigger.Conditions>
    <Setter TargetName="TabBorder" Property="Background" Value="{StaticResource SelectedColor}" />
</MultiDataTrigger>

但是,没有直接的方法可以知道TabControl的子项何时被聚焦,从而使边框变成蓝色.

However, there is no straight forward way to know when a child of the TabControl is focused so that you can pain the border blue.

这篇关于当应用程序失去焦点时视觉上指示最后关注的项目/IsKeyboardFocusWithin的替代方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆