DockPanel orden de tabulación

Question

Tengo un DockPanel estableció en el DataTemplate de ItemsControl como a continuación:

<ItemsControl HorizontalContentAlignment="Stretch">
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <DockPanel>
        <ComboBox DockPanel.Dock="Left"/>
        <ComboBox DockPanel.Dock="Left"/>
        <Button DockPanel.Dock="Right">Button</Button>
        <!-- This will appear before the button...it has to go after it in the XAML so it will fill properly in the DockPanel -->
        <TextBox DockPanel.Dock="Left" MinWidth="100" HorizontalAlignment="Stretch"/>
      </DockPanel>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

Quiero el cuadro de texto para llenar todo el espacio que queda entre los cuadros combinados y el botón. Tuve que poner el cuadro de texto pasado en el XAML porque DockPanel sólo llenar el último hijo. Se ve genial; Sin embargo, el orden de tabulación está jodido. Ahora tabs-cuadro combinado cuadro combinado-button-cuadro de texto en lugar de cuadro combinado de cuadro combinado-cuadro de texto-botón.

He intentado utilizar las propiedades KeyboardNavigation.TabIndex en cada artículo, pero ya que este es un DataTemplate de ItemsControl (cada uno de estos dockpanels habrá un punto separado), que dio el salto orden de tabulación vertical en cada uno de los cuadros combinados los artículos, a continuación, verticalmente hacia abajo de cada cuadro de texto y, a continuación verticalmente hacia abajo cada botón, en lugar de la conducta deseada de ir a través de cada fila, luego hacia abajo.

Ejemplo UI:

[Combo11] [Combo12] [Text1] [Button1]
[Combo21] [Combo22] [Text2] [Button2]

En el estado actual de las cosas, va Combo11,Combo12,Button1,Text1,Combo21,Combo22,Button2,Text2. Si añado propiedades TabOrder, va Combo11,Combo21,Combo12,Combo22,Text1,Text2,Button1,Button2.

Me gustaría que ir Combo11,Combo12,Text1,Button1,Combo21,Combo22,Text2,Button2.

¿Alguien tiene alguna idea sobre cómo resolver este problema de interfaz de usuario?

Answer 1

Se puede usar una cuadrícula en lugar de la DockPanel, así:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <ComboBox />
    <ComboBox Grid.Column="1"/>
    <TextBox Grid.Column="2" MinWidth="100" />
    <Button Grid.Column="3">Button</Button>
 </Grid>

Y si usted quiere que se alinean perfectamente en las diferentes columnas -. Podría utilizar SharedSizeGroup

Answer 2

Si desea conservar el DockPanel, puede utilizar KeyboardNavigation.TabNavigation = "local" en la DockPanel padre, y entonces se puede establecer los valores de índice de tabulación de los controles dentro de ella.

Al igual que esto -

    <ItemsControl HorizontalContentAlignment="Stretch">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <DockPanel KeyboardNavigation.TabNavigation="Local">
                    <ComboBox DockPanel.Dock="Left" TabIndex="1"/>
                    <ComboBox DockPanel.Dock="Left" TabIndex="2"/>
                    <Button DockPanel.Dock="Right" TabIndex="4">Button</Button>
                    <!-- This will appear before the button...it has to go after it in the XAML so it will fill properly in the DockPanel -->
                    <TextBox DockPanel.Dock="Left" MinWidth="100" HorizontalAlignment="Stretch" TabIndex="3"/>
                </DockPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

A medida que encontraste, si usted acaba de establecer los valores de índice de tabulación de los controles, éstos son globales para la forma, por lo que todo el ÍndiceDeTabulación = "0" en forma de fichas en primer lugar, a continuación, toda la ÍndiceDeTabulación = "1", y por lo en. Conjunto KeyboardNavigation.TabNavigation = "local" en las correcciones de contenedor primario a él.

Answer 3

Ha intentado establecer explícitamente el orden de tabulación?

<Control KeyboardNavigation.TabIndex="0" />