Search code examples
wpfitemscontroltabindex

WPF - How to set a Tab Order for specific items inside an Itemscontrol


I have an ItemsControl that dynamically creates TextBoxes. When I tab through, I only want it to focus on one specific textbox.

When tabbing through, focus should jump on each Coin_Qty_TxtBx

I have been trying different options with the KeyboardNavigation options, but am not able to get it to work. I also tried manually binding the TabIndex on the textbox to a integer list.

<ItemsControl x:Name="Coins_LB" BorderThickness="0" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled" KeyboardNavigation.TabNavigation="Continue">

                   <ItemsControl.ItemContainerStyle>
                                <Style>
                                    <Setter Property="KeyboardNavigation.IsTabStop" Value="False"/>
                                </Style>
                            </ItemsControl.ItemContainerStyle>

                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <StackPanel IsItemsHost="True" Orientation="Horizontal" />
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>

                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Grid.Column="0">
                                        <Button x:Name="CoinPicture_Btn" BorderThickness="0" Background="white" Style="{StaticResource AddRemoveSave_Style}" VerticalAlignment="Top" Height="60" Width="60" HorizontalAlignment="Center" Margin="0,0,0,3" Click="CashPicture_Btn_Click" IsTabStop="False">
                                            <Image Source="{Binding PicturePath}" RenderOptions.BitmapScalingMode="Fant" Margin="-15, -20, -15, -30" />
                                        </Button>
                                        <Label x:Name="Coin_Name_Lbl" Content="{Binding Name}" HorizontalAlignment="Center" HorizontalContentAlignment="Center" Margin="0,1,0,0" VerticalAlignment="Top" Width="72" FontWeight="Bold" Grid.Column="0"/>
                                        <TextBox x:Name="Coin_Qty_TxtBx" Text="{Binding Count, Mode=TwoWay}" Margin="5,2" IsTabStop="True" HorizontalContentAlignment="Center" LostFocus="Cash_Qty_LostFocus" GotKeyboardFocus="Cash_Qty_GotFocus"/>
                                        <TextBox x:Name="Coin_ItemTotal_TxtBx" Text="{Binding Total, StringFormat='c'}" Margin="5,2" HorizontalContentAlignment="Center"/>
                                    </StackPanel>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>

Right Now it will focus on the very first Coin_Qty_TxtBx, but after tabbing from there, the focus leaves the ItemsControl completely.


Solution

  • You'll just have to set IsTabStop="False" on those controls, you don't want to tab to.

    For instance:

    <TextBox x:Name="Coin_ItemTotal_TxtBx" IsTabStop="False"... />