-->

UWP change NavigationViewItem height

2019-08-24 09:30发布

问题:

On the image above, you can see my app (left) and Groove Player (right). I want to make NavigationViewItem height big like Groove Player, but I don't know how. I tried playing with Padding and MinHeight but it doesn't look the same.

I want to do the same for the AutoSuggestBox and the Settings button, that are part of NavigationView.

    <NavigationView x:Name="navView" IsSettingsVisible="True">
        <NavigationView.AutoSuggestBox>
            <AutoSuggestBox QueryIcon="Find" PlaceholderText="Search"></AutoSuggestBox>
        </NavigationView.AutoSuggestBox>

        <NavigationView.MenuItems>
            <NavigationViewItem x:Name="button1" Icon="Favorite" Content="Button 1" Tapped="Button1_Tapped"/>
            <NavigationViewItem x:Name="button2" Icon="Save" Content="Button 2" Tapped="Button2_Tapped"/>
        </NavigationView.MenuItems>
    </NavigationView>

回答1:

UWP change NavigationViewItem height

For your requirement, you could edit NavigationViewItem template. Right click NavigationViewItem in the xaml designer -> Edit Template -> Edit a copy.

If you want to change NavigationViewItem height, you could modify LayoutRoot height. And then modify SelectionIndicator height correspondingly.

<Grid x:Name="LayoutRoot" Background="{TemplateBinding Background}" Height="50" Control.IsTemplateFocusTarget="True">
 ......
<Rectangle x:Name="SelectionIndicator" Fill="{ThemeResource NavigationViewSelectionIndicatorForeground}" Height="40" Opacity="0.0" Width="6"/>