键盘中的向上和向下箭头对 ListboxItem 选择不起作用

Question

我们使用 Listbox 和 ItemTemplate 来让 Image 和 Textblock 同时显示在一行中。

我们第一次无法使用向上和向下箭头进行导航，但是在使用 PageDown 和 PageUp 事件时可以使用相同的箭头。

实际上，当我们尝试单击第二个列表框然后尝试使用向上和向下箭头时，有 2 个列表框并排放置。

这个问题很奇怪，这仅在我们第一次加载屏幕时发生。单击第二个列表框然后返回到第一个列表框后，向上和向下箭头工作正常。

<Style x:Key="_ListBoxItemStyle" TargetType="ListBoxItem">
                <!--<EventSetter Event="MouseEnter" Handler="ListBoxItem_MouseEnter" />-->
                <EventSetter Event="KeyDown" Handler="IDC_AVAILABLE_STATIONS_KeyDown" />

                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <Border Name="_Border"
                                    SnapsToDevicePixels="true">
                                <ContentPresenter />
                            </Border>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsSelected" Value="true">
                                    <Setter TargetName="_Border" Property="Background" Value="#3d94db"/>
                                    <Setter Property="Foreground" Value="White"/>
                                </Trigger>
                                <Trigger Property="IsKeyboardFocused" Value="True">
                                </Trigger>

                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

---

<ListBox x:Name="IDC_AVAILABLE_STATIONS" Width="172" Height="98" Margin="2,6,0,0" 
                     MouseDoubleClick="IDC_AVAILABLE_STATIONS_MouseDoubleClick" 
                     ItemContainerStyle="{DynamicResource ResourceKey=_ListBoxItemStyle}" 

                     VerticalAlignment="Top" HorizontalAlignment="Left" ScrollViewer.HorizontalScrollBarVisibility="Hidden" >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <Grid HorizontalAlignment="Left">
                            <Grid>
                                <Image Width="17" Height="17" Margin="0,0,0,2" Source="{Binding NetworkSetupImage}" HorizontalAlignment="Left" >
                                    <Image.Style>
                                        <Style>
                                            <Setter Property="Image.Source" Value="{Binding NetworkSetupImage}" />
                                            <Style.Triggers>
                                                <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}}" Value="True">
                                                    <Setter Property="Image.Source" Value="{Binding NetworkSetupImage}" />
                                                </DataTrigger>
                                            </Style.Triggers>
                                        </Style>
                                    </Image.Style>
                                </Image>
                            </Grid>
                            <TextBlock x:Name="DisplayedStationName" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="19,1,0,1" 
                                    Text="{Binding DisplayedStationName}" ToolTip="{Binding Stationtooltip}" Width="{Binding Path=ActualWidth, ElementName=IDC_AVAILABLE_STATIONS}" >
                            </TextBlock>
                        </Grid>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

Answer 1

加载页面时，只需将焦点设置到您的列表框。