首页 > 解决方案 > Popup 在 WPF 中失去了对导航的关注

问题描述

在弹出窗口中使用列表视图或列表框时,其行为在导航操作中看起来异常。我们有类似的设计,在弹出控件中加载列表视图。在到达列表视图的最后一项后使用导航键导航列表视图时,弹出控件的实际父级开始导航我的操作如何避免此导航。在下面的代码中,到达 List Box 的最后一个 Item 后,Grid 抓住焦点并开始滚动。

 <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>
            <ToggleButton Height="20" Width="20"
                        x:Name="PART_ColorPickerToggleButton"
                        HorizontalAlignment="Stretch"
                        VerticalAlignment="Stretch"
                        IsTabStop="True">
                <ToggleButton.Template>
                    <ControlTemplate>
                        <Border BorderBrush="LightGray" BorderThickness="1">
                            <Rectangle
                                        x:Name="PART_Rectangle"
                                        HorizontalAlignment="Stretch"
                                        VerticalAlignment="Stretch"
                                        Fill="Orange" />
                        </Border>
                    </ControlTemplate>
                </ToggleButton.Template>
            </ToggleButton>
            <Popup Opened="PART_ColorPickerPalettePopup_Opened"
                   Height="100"
                   Closed="PART_ColorPickerPalettePopup_Closed"
                        x:Name="PART_ColorPickerPalettePopup"
                        PlacementTarget="{Binding ElementName=PART_ColorPickerToggleButton}"
                        Width="250"
                        VerticalAlignment="Bottom"
                        AllowsTransparency="False"
                        Focusable="True"
                        HorizontalOffset="1"
                        IsOpen="{Binding ElementName=PART_ColorPickerToggleButton, Path=IsChecked, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                        PopupAnimation="Slide"
                        StaysOpen="False"
                        VerticalOffset="1">
                <ListBox x:Name="list" PreviewKeyDown="list_PreviewKeyDown">
                </ListBox>
            </Popup>
            <CheckBox Content="HI" Grid.Row="1" Height="25"/>
            <CheckBox Content="HI" Grid.Row="2" Height="25"/>
            <CheckBox Content="HI" Grid.Row="3" Height="25"/>
            <CheckBox Content="HI" Grid.Row="4" Height="25"/>
            <CheckBox Content="HI" Grid.Row="5" Height="25"/>
            <CheckBox Content="HI" Grid.Row="6" Height="25"/>
            <CheckBox Content="HI" Grid.Row="7" Height="25"/>
            <CheckBox Content="HI" Grid.Row="8" Height="25"/>
            <CheckBox Content="HI" Grid.Row="9" Height="25"/>
            <CheckBox Content="HI" Grid.Row="10" Height="25"/>
            <CheckBox Content="HI" Grid.Row="11" Height="25"/>
            <CheckBox Content="HI" Grid.Row="12" Height="25"/>
            <CheckBox Content="HI" Grid.Row="13" Height="25"/>
            <CheckBox Content="HI" Grid.Row="14" Height="25"/>
            <CheckBox Content="HI" Grid.Row="15" Height="25"/>
        </Grid>

标签: wpfxaml

解决方案


您应该将附加属性KeyboardNavigation.DirectionalNavigation应用于ListBox并将其设置为KeyboardNavigationMode.Cycle

<ListBox ItemsSource="{Binding Values}" 
         KeyboardNavigation.DirectionalNavigation="Cycle" />

推荐阅读