如何删除导航视图选择指示器位置

Question

有人可以建议如何从 UWP 的 NavigationView 中删除选择指示器。

下面的样式删除了指示符，但项目开头仍然显示空 space，如所附屏幕截图所示。

<SolidColorBrush x:Key="NavigationViewSelectionIndicatorForeground" Color="Transparent" />

谢谢

Answer 1

How to remove navigationview selection indicator place

源自 NavigationViewItemPresenter 样式，您会发现 IconBox 包含默认边距 NavigationViewItemIconBoxMargin 左侧为 10 像素。如果你想删除指示器位置，请将10更新为0，如下所示。

<Thickness x:Key="NavigationViewItemIconBoxMargin">0,12,16,12</Thickness>

请注意，如果您希望上述 Thickness 可以工作，您还需要在页面资源中添加 NavigationViewItemPresenter 和 NavigationViewItem 样式，例如 line。

16299 更新

<Style TargetType="NavigationViewItem">
    <Setter Property="Foreground" Value="{ThemeResource NavigationViewItemForeground}" />
    <Setter Property="Background" Value="{ThemeResource NavigationViewItemBackground}" />
    <Setter Property="BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrush}" />
    <Setter Property="BorderThickness" Value="{StaticResource NavigationViewItemBorderThickness}" />
    <Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="NavigationViewItem">
                <Grid
                    x:Name="LayoutRoot"
                    Height="40"
                    Background="{TemplateBinding Background}"
                    Control.IsTemplateFocusTarget="True">
                    <!--  Wrap SelectionIndicator in a grid so that its offset is 0,0 - this enables the offset animation.  -->
                    <Grid HorizontalAlignment="Left" VerticalAlignment="Center">

                        <Rectangle
                            x:Name="SelectionIndicator"
                            Width="6"
                            Height="24"
                            Fill="{ThemeResource NavigationViewSelectionIndicatorForeground}"
                            Opacity="0.0" />
                    </Grid>

                    <Border
                        x:Name="RevealBorder"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}" />

                    <Grid Height="40" HorizontalAlignment="Left">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition x:Name="IconColumn" Width="48" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <Viewbox
                            x:Name="IconBox"
                            Margin="-10,12,16,12"
                            Child="{TemplateBinding Icon}" />

                        <ContentPresenter
                            x:Name="ContentPresenter"
                            Grid.Column="1"
                            Margin="{TemplateBinding Padding}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Content="{TemplateBinding Content}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            ContentTransitions="{TemplateBinding ContentTransitions}" />
                    </Grid>

                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="PointerStates">
                            <VisualState x:Name="Normal" />

                            <VisualState x:Name="PointerOver">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.(RevealBrush.State)" Value="PointerOver" />
                                    <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationViewItemBackgroundPointerOver}" />
                                    <Setter Target="RevealBorder.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushPointerOver}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationViewItemForegroundPointerOver}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Pressed">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.(RevealBrush.State)" Value="Pressed" />
                                    <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationViewItemBackgroundPressed}" />
                                    <Setter Target="RevealBorder.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushPressed}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationViewItemForegroundPressed}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="Selected">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationViewItemBackgroundSelected}" />
                                    <Setter Target="RevealBorder.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushSelected}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationViewItemForegroundSelected}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PointerOverSelected">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.(RevealBrush.State)" Value="PointerOver" />
                                    <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationViewItemBackgroundSelectedPointerOver}" />
                                    <Setter Target="RevealBorder.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushSelectedPointerOver}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationViewItemForegroundSelectedPointerOver}" />
                                </VisualState.Setters>
                            </VisualState>

                            <VisualState x:Name="PressedSelected">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.(RevealBrush.State)" Value="Pressed" />
                                    <Setter Target="LayoutRoot.Background" Value="{ThemeResource NavigationViewItemBackgroundSelectedPressed}" />
                                    <Setter Target="RevealBorder.BorderBrush" Value="{ThemeResource NavigationViewItemBorderBrushSelectedPressed}" />
                                    <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource NavigationViewItemForegroundSelectedPressed}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                        <VisualStateGroup x:Name="DisabledStates">
                            <VisualState x:Name="Enabled" />

                            <VisualState x:Name="Disabled">
                                <VisualState.Setters>
                                    <Setter Target="LayoutRoot.Opacity" Value="{ThemeResource ListViewItemDisabledThemeOpacity}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                        <VisualStateGroup x:Name="PaneStates">
                            <VisualState x:Name="NotClosedCompact" />
                            <VisualState x:Name="ClosedCompact">
                                <VisualState.Setters>
                                    <Setter Target="RevealBorder.HorizontalAlignment" Value="Left" />
                                    <Setter Target="RevealBorder.Width" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=CompactPaneLength}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                        <VisualStateGroup x:Name="IconStates">
                            <VisualState x:Name="IconVisible" />
                            <VisualState x:Name="IconCollapsed">
                                <VisualState.Setters>
                                    <Setter Target="IconBox.Visibility" Value="Collapsed" />
                                    <Setter Target="IconColumn.Width" Value="16" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

如何删除导航视图选择指示器位置

How to remove navigationview selection indicator place

uwp

uwp-xaml

navigationview