【问题标题】:How to remove navigationview selection indicator place如何删除导航视图选择指示器位置
【发布时间】:2020-11-19 07:22:33
【问题描述】:

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

样式删除指示符下方,但仍在项目开头显示空白区域,如所附屏幕截图所示。

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

谢谢

【问题讨论】:

    标签: uwp uwp-xaml navigationview


    【解决方案1】:

    如何移除navigationview选择指示符位置

    派生自 NavigationViewItemPresenter 样式,您可以找到 IconBox 包含默认边距 NavigationViewItemIconBoxMargin 左侧为 10 像素。如果你想删除 指标的地方,请像下面这样将10更新为0。

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

    请注意,如果您希望以上Thickness 可以工作,您还需要在页面资源中添加NavigationViewItemPresenterNavigationViewItem 样式,如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>
    

    【讨论】:

    • 似乎这个类在我现有的项目中不支持。抛出错误“Windows Universal 项目不支持 NavigationViewItemPresenter”。
    • 请分享您应用的目标版本和最低版本。
    • 当然。最小和目标:Windows 10 秋季创意者更新(10.0;内部版本 16299)
    • 是的,样式在16299和1909之间是不同的,如果您的目标版本是16299,您只需将IconBox编辑为Margin="-10,12,16,12"。有关更多信息,请参阅上面的更新部分。
    • 当然。非常感谢。 :)
    猜你喜欢
    • 2019-09-08
    • 1970-01-01
    • 2021-03-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-11-16
    相关资源
    最近更新 更多