Update color of SelectionIndicator in NavigationView - xaml

Question

I'm using the NavigationView control to provide the left pane hamburger menu navigation in my UWP app.
I'd like to change the color of the selection indicator (the little rectangle that shows up next to the item you selected).
In generic.xaml I can see the color is being set to the system accent color:
<Style TargetType="NavigationViewItem">
<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"
Child="{TemplateBinding Icon}"
Margin="16,12"/>
<ContentPresenter x:Name="ContentPresenter"
Grid.Column="1"
ContentTransitions="{TemplateBinding ContentTransitions}"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Margin="{TemplateBinding Padding}"/>
</Grid>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Is there a way in my pages XAML file (that uses the NavigationView) to change the color of the rectangle Fill from NavigationViewSelectionIndicatorForeground to some value I set?
I know I could copy over the entire template and update the copy, and set the template on the NavigationView, but it seems like a lot of overhead just to change one value.

Answer 1

You can just define your own brush with x:Key="NavigationViewSelectionIndicatorForeground" for example in App.xaml:
<Application ...>
<Application.Resources>
<SolidColorBrush x:Key="NavigationViewSelectionIndicatorForeground"
Color="Yellow" />
</Application.Resources>
</Application>
Alternatively you could also declare the resource in the scope of your Page or even in your NavigationView's Resources, it just needs to be in the path in the XAML tree leading to the NavigationView.
Because your resource goes later in the cascade, it will override the default NavigationViewSelectionIndicatorForeground with your defined brush.