WPF如何设置Tab索引直接聚焦ContentControl内的TextBox？

我在DataTemplate中定义了包含TextBox和错误信息区域的自定义模板，绑定到自定义的TextValidation类。使用ContentControl在视图中实例化这些自定义TextBox时，按Tab键会先选中整个ContentControl，需要再次按Tab才能聚焦到内部的TextBox。希望Tab键能直接从一个ContentControl内的TextBox跳转到下一个ContentControl内的TextBox。

相关代码如下：

视图代码 #

<ContentControl Content="{Binding Text1}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"/>
<ContentControl Content="{Binding Text2}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"/>

TextValidation类代码 #

public class TextValidation
{
    public string Text;
    public bool Error;
    public string ErrorMsg;
}

TextBoxTemplate代码 #

<DataTemplate x:Key="TextBoxTemplate">
    <TextBox>
        <TextBox.Style>
        <Style TargetType="{x:Type TextBox}">
            <Setter Property="Text" Value="{Binding Text, UpdateSourceTrigger=PropertyChanged}"/>
            <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TextBox}">
                            <StackPanel>
                                <Border x:Name="border" CornerRadius="3"
                                    Background="White"
                                    BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" 
                                    SnapsToDevicePixels="True">
                                    <ScrollViewer x:Name="PART_ContentHost" Focusable="false" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden"/>
                                </Border>
                                <StackPanel Orientation="Horizontal" x:Name="errorMsg" Height="20">
                                    <TextBlock FontSize="12" FontStyle="Italic" Foreground="#ff3333"
                                Text="{Binding ErrorMsg}" />
                                </StackPanel>
                            </StackPanel>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </TextBox.Style>
    </TextBox>
</DataTemplate>

问题的核心是ContentControl默认是可聚焦的，所以Tab键会优先选中它，而非直接聚焦内部的TextBox。可以通过以下两种方法解决：

方法1：设置ContentControl为不可聚焦 #

直接在每个ContentControl上添加Focusable="False"属性，Tab键会跳过ContentControl，直接聚焦到内部的TextBox：

<ContentControl Content="{Binding Text1}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"
                Focusable="False"/>
<ContentControl Content="{Binding Text2}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"
                Focusable="False"/>

方法2：禁用ContentControl的Tab导航 #

通过KeyboardNavigation.TabNavigation="None"让ContentControl不参与Tab循环，焦点会直接传递到内部的TextBox：

<ContentControl Content="{Binding Text1}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"
                KeyboardNavigation.TabNavigation="None"/>
<ContentControl Content="{Binding Text2}" Margin="0 0 0 10"
                ContentTemplate="{StaticResource TextBoxTemplate}"
                KeyboardNavigation.TabNavigation="None"/>

额外说明 #

如果需要精确控制TextBox之间的Tab顺序，可以在DataTemplate的TextBox上设置TabIndex属性，确保焦点按预期顺序跳转：

<DataTemplate x:Key="TextBoxTemplate">
    <TextBox TabIndex="{Binding TabIndex}">
        <!-- 原有模板内容 -->
    </TextBox>
</DataTemplate>

此时需要在TextValidation类中添加TabIndex属性，并绑定到ViewModel中对应的属性值。

内容的提问来源于stack exchange，提问作者teriyakiforandy