DockPanel Aktivierreihenfolge

Question

Ich habe ein DockPanel in der Datatemplate eines Items aufgebaut wie folgt:

<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>

Ich möchte die Textbox alle den verbleibenden Platz zwischen den Comboboxen und die Schaltfläche füllen. Ich hatte die Textbox zuletzt in der XAML zu setzen, weil DockPanel wird nur das letzte Kind füllen. Das sieht großartig aus; jedoch ist die Tab-Reihenfolge jetzt vermasselt. Es ist nun Registerkarten Combobox-Combobox-button-Textbox statt Combobox-Combobox-Textbox-Taste.

habe ich versucht, mit KeyboardNavigation.TabIndex Eigenschaften für jedes Element, aber da es sich um ein Datatemplate für ein Items (jede dieser dockpanels für ein separates Element sein wird), dass die Tab-Reihenfolge Sprung gemacht vertikal nach unten jede der Comboboxen Stücke, dann senkrecht nach unten jede Textbox, dann senkrecht nach unten jede Taste, anstatt das gewünschte Verhalten in jeder Zeile zu gehen, dann nach unten.

Beispiel UI:

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

Im aktuellen Stand der Dinge, es geht Combo11,Combo12,Button1,Text1,Combo21,Combo22,Button2,Text2. Wenn ich TabOrder Eigenschaften hinzufügen, es geht Combo11,Combo21,Combo12,Combo22,Text1,Text2,Button1,Button2.

Ich mag es Combo11,Combo12,Text1,Button1,Combo21,Combo22,Text2,Button2 gehen.

Hat jemand irgendwelche Ideen, wie dieses UI Problem zu lösen?

Answer 1

Sie könnten ein Gitter anstelle des DockPanel verwenden, etwa so:

<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>

Und wenn Sie wollen, dass sie in den verschiedenen Spalten schön ausrichten -. Sie könnten SharedSizeGroup verwenden

Answer 2

Wenn Sie die DockPanel behalten möchten, können Sie KeyboardNavigation.TabNavigation = „Local“ auf der übergeordneten DockPanel, verwenden und dann können Sie die Registerkarte Indexwerte auf die Kontrollen in ihm gesetzt.

Wie dies -

    <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>

Wie Sie, wenn Sie nur die Registerkarte Indexwerte der Kontrollen festgelegt, sind diese auf die Form global, so dass alle die TabIndex = „0“ Tabbed in erste, dann die ganze TabIndex = „1“, und so auf. Set KeyboardNavigation.TabNavigation = "Local" auf den übergeordneten Container fixiert es.

Answer 3

Haben Sie versucht, explizit die Tab-Reihenfolge einstellen?

<Control KeyboardNavigation.TabIndex="0" />