wpfxamlnavigationkeyboardtabbing

WPF - How to skip a label in tab navigation?


I have a stackpanel inside a controltemplate inside a itemscontrol inside a stackpanel inside a grid inside a usercontrol (se the xaml below). In the inner stackpanel there is a label (Name="NoComponentChosen") and another stackpanel (Name="ComponentChosen"). The label's visibility is initially collapsed.

The controltemplate has a datatrigger with a binding. When the binding reference has a specific value the label (NoComponentChosen) becomes visible and the stackpanel collapses.

I would like to skip the label/stackpanel when I am tabbing trough the user interface. I would also like to still be able tab through the rest of the things in my ChangeRequestView.xaml (listbox and buttons).

Right now - when I tab - the label/stackpanel eventually becomes chosen and is surrounded by a dotted rectangle. That is what I would like to avoid.

This is my ChangeRequestView.xaml:

<UserControl x:Class="MyProgram.View.ChangeRequestView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
             xmlns:ListBoxBehavior="clr-namespace:MyProgram.Utility"
             mc:Ignorable="d" 
             d:DesignHeight="500" d:DesignWidth="300">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="50"/>
            <RowDefinition Height="35"/>
            <RowDefinition Height="45*"/>
            <RowDefinition Height="10*"/>
            <RowDefinition Height="20*"/>
            <RowDefinition Height="35"/>
        </Grid.RowDefinitions>

        <!--The title of the view-->
        <Label Grid.Row="0" Content="Change Requests" FontWeight="Bold" Margin="5,5,5,5" VerticalAlignment="Center" HorizontalAlignment="Center"/>

        <!--The component chosen-->
        <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="5,0,0,0" IsHitTestVisible="False" Focusable="False">
            <ItemsControl>
                <ItemsControl.Template>
                    <ControlTemplate>
                        <StackPanel>
                            <StackPanel Name="ComponentChosen" Orientation="Horizontal">
                                <Label Content="Reference des.: " />
                                <Label Name="referenceDesignation" Content="{Binding Path=ReferenceDesignation, UpdateSourceTrigger=PropertyChanged}"/>
                            </StackPanel>
                            <Label Name="NoComponentChosen" Content="Choose a component" Visibility="Collapsed"/>
                        </StackPanel>
                        <ControlTemplate.Triggers>
                            <DataTrigger Binding="{Binding ReferenceDesignation}" Value="">
                                <Setter TargetName="ComponentChosen" Property="Visibility" Value="Collapsed"/>
                                <Setter TargetName="NoComponentChosen" Property="Visibility" Value="Visible"/>
                            </DataTrigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ItemsControl.Template>
            </ItemsControl>
        </StackPanel>

        <ListBox Grid.Row="2" ... />
        <Button Grid.Row="3" ... />
        <Button Grid.Row="4" ... />
    </Grid>
</UserControl> 


The whole UserControl/ChangeRequestView.xaml is part of my MainWindow - I don't know if that has anything to say. I tab through all of the different views in my MainWindow, and when I get to the ChangeRequestView I would like to skip the label/stackpanel according to which of them isn't collapsed.

This is my MainWindow.xaml:

<Window x:Class="MyProgram.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:view="clr-namespace:MyProgram.View"
        xmlns:vm="clr-namespace:MyProgram.ViewModel"
        ...>
    <Grid>
        <Grid.RowDefinitions>
        <RowDefinition Height="20"/>
        <RowDefinition Height="309*"/>
        <RowDefinition Height="187*"/>
        <RowDefinition Height="120*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="209*"/>
        <ColumnDefinition Width="558*"/>
        <ColumnDefinition Width="250*"/>
    </Grid.ColumnDefinitions>

    <Menu IsMainMenu="True" Name="Menu1" VerticalAlignment="Top" Grid.Row="0" Grid.ColumnSpan="3">
        <MenuItem Header="_File">
            <MenuItem Header="_Save changed change requests for current reference designation" 
                      InputGestureText="Ctrl+S" Command="{Binding Path=HotKeysSaveChangeRequestUpdateCmd}"/>
            <MenuItem Header="_Upload change requests for current project" 
                      InputGestureText="Ctrl+U" Command="{Binding Path=HotKeysUploadCmd}"/>
            <MenuItem Header="_Exit" ToolTip="Exit this program" 
                      InputGestureText="CTRL+X" Command="{Binding Path=ShutDownCmd}"/>
        </MenuItem>
    </Menu>

    <!--Search Region-->
    <Border Grid.Row="2" Grid.Column="0" Grid.RowSpan="2" Margin="3,1,1,3" BorderThickness="2,2,2,2" CornerRadius="4,4,4,4" BorderBrush="LightGray">
        <view:SearchView x:Name="SearchView"/>
    </Border>

    <!-- Project Region -->
    <Border Grid.Row="1" Grid.Column="0" Margin="3,3,1,1" BorderThickness="2,2,2,2" CornerRadius="4,4,4,4" BorderBrush="LightGray">
        <view:ProjectView x:Name="ProjectView" />
    </Border>

    <!-- Components Region -->
    <Border Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Margin="1,3,1,1" BorderThickness="2,2,2,2" CornerRadius="4,4,4,4" BorderBrush="LightGray">
        <view:ComponentView x:Name="ComponentView" />
    </Border>

    <!-- Change Request Region -->
    <Border Grid.Row="1" Grid.Column="2" Grid.RowSpan="2" Margin="1,3,3,1" BorderThickness="2,2,2,2" CornerRadius="4,4,4,4" BorderBrush="LightGray">
        <view:ChangeRequestView x:Name="ChangeRequestView" />
    </Border>

    <!-- Log Region -->
    <Border Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="2" Margin="1,1,3,3" BorderThickness="2,2,2,2" CornerRadius="4,4,4,4" BorderBrush="LightGray">
        <view:LogView x:Name="LogView" />
    </Border>

    </Grid>
    <Window.InputBindings>
        <KeyBinding Gesture="CTRL+U" Command="{Binding Path=HotKeysUploadCmd}"/>
        <KeyBinding Gesture="CTRL+S" Command="{Binding Path=HotKeysSaveChangeRequestUpdateCmd}"/>
        <KeyBinding Gesture="CTRL+X" Command="{Binding Path=ShutDownCmd}"/>
    </Window.InputBindings>
</Window> </br>

I apologize for the long xaml-files, but I'm thinking the more information I provide to you the easier it will be for you to help me solve this tabbing issue.

Do you have any ideas of how to skip the label "NoComponentChosen"/the stackpanel "ComponentChosen" when I tab through the user interface?


Solution

  • Try KeyboardNavigation.TabNavigation Attached Property with KeyboardNavigationMode.None on the container with the elements you want to skip.

    KeyboardNavigation.TabNavigation="None"