animate indicator.
MODIFY
WalletWasabi.Fluent/Controls/NavBarItem.xaml
WalletWasabi.Fluent/Controls/NavBarItem.xaml
<Setter Property="Template">
<ControlTemplate>
<Panel>
- <Border CornerRadius="2" x:Name="Indicator_Backdrop" Margin="4 0">
- <Border Width="2" x:Name="Indicator" CornerRadius="2" VerticalAlignment="Stretch" HorizontalAlignment="Left" />
+ <Border CornerRadius="3" x:Name="Indicator_Backdrop" Margin="4 0">
+ <Border Width="3" x:Name="Indicator" CornerRadius="6" VerticalAlignment="Stretch" HorizontalAlignment="Left">
+ <Border.Transitions>
+ <Transitions>
+ <DoubleTransition Property="Opacity" Duration="0:0:0.175" />
+ <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.175" />
+ </Transitions>
+ </Border.Transitions>
+ </Border>
</Border>
<ContentPresenter Name="PART_ContentPresenter"
</Setter>
</Style>
+ <Style Selector="c|NavBarItem /template/ Border#Indicator">
+ <Setter Property="Background" Value="{DynamicResource SystemAccentColor}" />
+ <Setter Property="Opacity" Value="0" />
+ <Setter Property="RenderTransform" Value="scale(0)" />
+ </Style>
+
<Style Selector="c|NavBarItem /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="TextBlock.FontWeight" Value="Normal" />
<Setter Property="TextBlock.FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
<!-- Selected State -->
<Style Selector="c|NavBarItem:selected /template/ Border#Indicator">
- <Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/>
+ <Setter Property="Opacity" Value="1" />
+ <Setter Property="RenderTransform" Value="scale(1)" />
</Style>
<Style Selector="c|NavBarItem:selected /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource SystemControlHighlightAltBaseHighBrush}"/>

MODIFY
WalletWasabi.Fluent/Controls/NavBarTreeItem.xaml
WalletWasabi.Fluent/Controls/NavBarTreeItem.xaml
TemplatedControl.IsTemplateFocusTarget="True">
<Grid Name="PART_Header"
Margin="{TemplateBinding Level, Mode=OneWay, Converter={StaticResource TreeViewItemLeftMarginConverter}}">
- <Border CornerRadius="2" x:Name="Indicator_Backdrop" Margin="4 0" Focusable="False">
- <Border Width="2" x:Name="Indicator" CornerRadius="2" VerticalAlignment="Stretch" HorizontalAlignment="Left" />
+ <Border CornerRadius="3" x:Name="Indicator_Backdrop" Margin="4 0">
+ <Border Width="3" x:Name="Indicator" CornerRadius="6" VerticalAlignment="Stretch" HorizontalAlignment="Left">
+ <Border.Transitions>
+ <Transitions>
+ <DoubleTransition Property="Opacity" Duration="0:0:0.175" />
+ <TransformOperationsTransition Property="RenderTransform" Duration="0:0:.175" />
+ </Transitions>
+ </Border.Transitions>
+ </Border>
</Border>
<ContentPresenter Name="PART_HeaderPresenter"
Focusable="False"
<Style Selector="c|NavBarTreeItem /template/ Border#PART_LayoutRoot Border#Indicator_Backdrop">
<Setter Property="Background" Value="Transparent"/>
</Style>
+
+ <Style Selector="c|NavBarTreeItem /template/ Border#PART_LayoutRoot Border#Indicator">
+ <Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/>
+ <Setter Property="Opacity" Value="0" />
+ <Setter Property="RenderTransform" Value="scale(0)" />
+ </Style>
+
<!-- PointerOver state -->
<Style Selector="c|NavBarTreeItem /template/ Border#PART_LayoutRoot:pointerover > ContentPresenter#PART_HeaderPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource TreeViewItemForegroundPointerOver}" />
<!-- Selected state -->
<Style Selector="c|NavBarTreeItem:selected /template/ Border#Indicator">
- <Setter Property="Background" Value="{DynamicResource SystemAccentColor}"/>
+ <Setter Property="Opacity" Value="1" />
+ <Setter Property="RenderTransform" Value="scale(1)" />
</Style>
<Style Selector="c|NavBarTreeItem:selected /template/ Border#PART_LayoutRoot > ContentPresenter#PART_HeaderPresenter">
<Setter Property="TextBlock.Foreground" Value="{DynamicResource TreeViewItemForegroundSelected}" />

animate indicator.