chuan/Ursa.Avalonia
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: replace ursa demo with nav menu.

Browse Source
This commit is contained in:
rabbitism
2024-02-14 21:45:50 +08:00
parent acd1bdefbc
commit d141831571
3 changed files with 104 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
demo/Ursa.Demo/Converters/IconNameToPathConverter.cs
View File

@@ -26,6 +26,12 @@ public class IconNameToPathConverter: IValueConverter
string s = paths[i % paths.Length]; string s = paths[i % paths.Length];
return StreamGeometry.Parse(s); return StreamGeometry.Parse(s);
} }
else if (value is string s)
{
int hash = s.GetHashCode();
string path = paths[Math.Abs(hash) % paths.Length];
return StreamGeometry.Parse(path);
}
return AvaloniaProperty.UnsetValue; return AvaloniaProperty.UnsetValue;
} }

113
demo/Ursa.Demo/Views/MainView.axaml
View File

@@ -16,6 +16,9 @@
<Design.DataContext> <Design.DataContext>
<vm:MainViewViewModel /> <vm:MainViewViewModel />
</Design.DataContext> </Design.DataContext>
<UserControl.Resources>
<converters:IconNameToPathConverter x:Key="IconConverter" />
</UserControl.Resources>
<Panel> <Panel>
<Grid <Grid
Classes.Blur="{Binding #host.HasModal}" Classes.Blur="{Binding #host.HasModal}"
@@ -27,63 +30,65 @@
</Style> </Style>
</Grid.Styles> </Grid.Styles>
<Border <Border
Padding="8 4"
Grid.RowSpan="2" Grid.RowSpan="2"
Padding="8,4"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
Theme="{DynamicResource CardBorder}"> Theme="{DynamicResource CardBorder}">
<u:NavigationMenu ItemsSource="{Binding Menus.MenuItems}" ShowCollapseButton="True"> <u:NavMenu Name="menu" ItemsSource="{Binding Menus.MenuItems}"
<u:NavigationMenu.Header> CommandBinding="{Binding ActivateCommand}"
<TextBlock HeaderBinding="{Binding}"
Classes="H4" IconBinding="{Binding MenuHeader}">
Text="Ursa" <u:NavMenu.Styles>
Theme="{DynamicResource TitleTextBlock}" /> <Style Selector="u|NavMenuItem" x:DataType="vm:MenuItemViewModel">
</u:NavigationMenu.Header> <Setter Property="IsSeparator" Value="{Binding IsSeparator}"></Setter>
<u:NavigationMenu.Icon> </Style>
<Image </u:NavMenu.Styles>
Width="48" <u:NavMenu.IconTemplate>
Height="48" <DataTemplate x:DataType="x:String">
RenderOptions.BitmapInterpolationMode="HighQuality" <u:TwoTonePathIcon
Source="../Assets/Ursa.ico" /> Width="16"
</u:NavigationMenu.Icon> Height="16"
<u:NavigationMenu.ItemTemplate> ActiveForeground="{DynamicResource SemiBlue5}"
<converters:MenuDataTemplateSelector> ActiveStrokeBrush="{DynamicResource SemiBlue5}"
<converters:MenuDataTemplateSelector.MenuTemplate> Data="{Binding Converter={StaticResource IconConverter}}"
<DataTemplate DataType="vm:MenuItemViewModel"> Foreground="{DynamicResource SemiGrey5}"
<u:NavigationMenuItem IsActive="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=u:NavMenuItem}, Path=IsHighlighted, Mode=TwoWay}"
Command="{Binding ActivateCommand}" StrokeBrush="{DynamicResource SemiGrey5}" />
Header="{Binding}" </DataTemplate>
ItemsSource="{Binding Children}"> </u:NavMenu.IconTemplate>
<u:NavigationMenuItem.HeaderTemplate> <u:NavMenu.HeaderTemplate>
<DataTemplate x:DataType="vm:MenuItemViewModel"> <DataTemplate x:DataType="vm:MenuItemViewModel">
<StackPanel Orientation="Horizontal"> <StackPanel Orientation="Horizontal" MinWidth="240">
<TextBlock HorizontalAlignment="Left" Text="{Binding MenuHeader}" /> <TextBlock HorizontalAlignment="Left" Text="{Binding MenuHeader}" />
<u:Badge <Label
Margin="8,0,0,0" Margin="8,0,0,0"
HorizontalAlignment="Left" HorizontalAlignment="Left"
BadgeContent="{Binding Status}" Theme="{DynamicResource TagLabel}"
CornerPosition="TopRight" /> Classes="Blue Solid"
</StackPanel> IsVisible="{Binding Status, Converter={x:Static ObjectConverters.IsNotNull}}"
Content="{Binding Status}"/>
</DataTemplate> </StackPanel>
</u:NavigationMenuItem.HeaderTemplate> </DataTemplate>
<u:NavigationMenuItem.Icon> </u:NavMenu.HeaderTemplate>
<Border <u:NavMenu.Header>
Width="10" <DockPanel HorizontalAlignment="Center" Margin="8">
Height="10" <Image
Background="{DynamicResource SemiBlue6}" Width="48"
CornerRadius="3" /> Height="48"
</u:NavigationMenuItem.Icon> u:NavMenu.CanToggle="True"
</u:NavigationMenuItem> VerticalAlignment="Center"
</DataTemplate> DockPanel.Dock="Left"
</converters:MenuDataTemplateSelector.MenuTemplate> RenderOptions.BitmapInterpolationMode="HighQuality"
<converters:MenuDataTemplateSelector.SeparatorTemplate> Source="../Assets/Ursa.ico" />
<DataTemplate DataType="vm:MenuItemViewModel"> <TextBlock
<u:NavigationMenuSeparator Header="{Binding MenuHeader}" /> Classes="H4"
</DataTemplate> Text="Ursa"
</converters:MenuDataTemplateSelector.SeparatorTemplate> IsVisible="{Binding !#menu.IsHorizontalCollapsed}"
</converters:MenuDataTemplateSelector> VerticalAlignment="Center"
</u:NavigationMenu.ItemTemplate> Theme="{DynamicResource TitleTextBlock}" />
</u:NavigationMenu> </DockPanel>
</u:NavMenu.Header>
</u:NavMenu>
</Border> </Border>
<u:ThemeToggleButton <u:ThemeToggleButton
Grid.Row="0" Grid.Row="0"

54
src/Ursa.Themes.Semi/Controls/NavMenu.axaml
View File

@@ -13,17 +13,35 @@
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate TargetType="u:NavMenu"> <ControlTemplate TargetType="u:NavMenu">
<DockPanel LastChildFill="True"> <DockPanel LastChildFill="True">
<ContentPresenter Content="{TemplateBinding Header}" DockPanel.Dock="Top"></ContentPresenter> <ContentPresenter Content="{TemplateBinding Header}" DockPanel.Dock="Top" />
<ContentPresenter Content="{TemplateBinding Footer}" DockPanel.Dock="Bottom"></ContentPresenter> <ContentPresenter Content="{TemplateBinding Footer}" DockPanel.Dock="Bottom" />
<ScrollViewer HorizontalAlignment="Center" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto"> <ScrollViewer
HorizontalAlignment="Center"
HorizontalScrollBarVisibility="Disabled"
AllowAutoHide="True"
Theme="{DynamicResource StaticScrollViewer}"
VerticalScrollBarVisibility="Auto">
<ScrollViewer.Styles>
<Style Selector="ScrollViewer /template/ ScrollBar">
<Setter Property="Opacity" Value="0"></Setter>
</Style>
<Style Selector="ScrollViewer:pointerover">
<Style Selector="^ /template/ ScrollBar#PART_HorizontalScrollBar">
<Setter Property="Opacity" Value="1" />
</Style>
<Style Selector="^ /template/ ScrollBar#PART_VerticalScrollBar">
<Setter Property="Opacity" Value="1" />
</Style>
</Style>
</ScrollViewer.Styles>
<ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" /> <ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" />
</ScrollViewer> </ScrollViewer>
</DockPanel> </DockPanel>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^:horizontal-collapsed"> <Style Selector="^:horizontal-collapsed">
<Setter Property="Width" Value="{x:Static x:Double.NaN}"></Setter> <Setter Property="Width" Value="{x:Static x:Double.NaN}" />
<Setter Property="HorizontalAlignment" Value="Left"></Setter> <Setter Property="HorizontalAlignment" Value="Left" />
</Style> </Style>
</ControlTheme> </ControlTheme>
@@ -33,9 +51,9 @@
Name="PART_Border" Name="PART_Border"
Grid.Row="0" Grid.Row="0"
MinHeight="32" MinHeight="32"
Cursor="Hand"
Background="{TemplateBinding u:NavMenuItem.Background}" Background="{TemplateBinding u:NavMenuItem.Background}"
CornerRadius="4"> CornerRadius="4"
Cursor="Hand">
<Grid <Grid
Name="PART_RootGrid" Name="PART_RootGrid"
HorizontalAlignment="Stretch" HorizontalAlignment="Stretch"
@@ -119,7 +137,7 @@
</ControlTemplate> </ControlTemplate>
<ControlTheme x:Key="{x:Type u:NavMenuItem}" TargetType="u:NavMenuItem"> <ControlTheme x:Key="{x:Type u:NavMenuItem}" TargetType="u:NavMenuItem">
<Setter Property="Background" Value="Transparent" /> <Setter Property="Background" Value="Transparent" />
<Setter Property="HorizontalAlignment" Value="Stretch"></Setter> <Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="ItemsPanel"> <Setter Property="ItemsPanel">
<ItemsPanelTemplate> <ItemsPanelTemplate>
<u:OverflowStackPanel /> <u:OverflowStackPanel />
@@ -146,7 +164,7 @@
<Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" /> <Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
</Style> </Style>
<Style Selector="^:horizontal-collapsed:first-level"> <Style Selector="^:horizontal-collapsed:first-level">
<Setter Property="HorizontalAlignment" Value="Left"></Setter> <Setter Property="HorizontalAlignment" Value="Left" />
<Style Selector="^ /template/ Border#PART_Border"> <Style Selector="^ /template/ Border#PART_Border">
<Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}" /> <Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}" />
<Setter Property="ToolTip.ShowDelay" Value="0" /> <Setter Property="ToolTip.ShowDelay" Value="0" />
@@ -157,7 +175,7 @@
</Style> </Style>
<Style Selector="^ /template/ ContentPresenter#PART_IconPresenter"> <Style Selector="^ /template/ ContentPresenter#PART_IconPresenter">
<Setter Property="Grid.ColumnSpan" Value="3" /> <Setter Property="Grid.ColumnSpan" Value="3" />
<Setter Property="Margin" Value="0 8"></Setter> <Setter Property="Margin" Value="0 8" />
<Setter Property="HorizontalAlignment" Value="Center" /> <Setter Property="HorizontalAlignment" Value="Center" />
</Style> </Style>
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter"> <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
@@ -182,7 +200,10 @@
<Style Selector="^[IsSeparator=True]"> <Style Selector="^[IsSeparator=True]">
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate> <ControlTemplate>
<StackPanel Cursor="No" Name="PART_RootPanel" Margin="{DynamicResource NavigationMenuSeparatorMargin}"> <StackPanel
Name="PART_RootPanel"
Margin="{DynamicResource NavigationMenuSeparatorMargin}"
Cursor="No">
<ContentPresenter <ContentPresenter
Name="PART_HeaderPresenter" Name="PART_HeaderPresenter"
Margin="{DynamicResource NavigationMenuSeparatorHeaderMargin}" Margin="{DynamicResource NavigationMenuSeparatorHeaderMargin}"
@@ -190,7 +211,8 @@
Content="{TemplateBinding Header}" Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}" ContentTemplate="{TemplateBinding HeaderTemplate}"
Foreground="{DynamicResource TextBlockQuaternaryForeground}" Foreground="{DynamicResource TextBlockQuaternaryForeground}"
IsVisible="{TemplateBinding Header, Converter={x:Static ObjectConverters.IsNotNull}}"> IsVisible="{TemplateBinding Header,
Converter={x:Static ObjectConverters.IsNotNull}}">
<ContentPresenter.Styles> <ContentPresenter.Styles>
<Style Selector="TextBlock"> <Style Selector="TextBlock">
<Setter Property="FontSize" Value="{DynamicResource NavigationMenuSeparatorHeaderFontSize}" /> <Setter Property="FontSize" Value="{DynamicResource NavigationMenuSeparatorHeaderFontSize}" />
@@ -207,13 +229,13 @@
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^:horizontal-collapsed:first-level"> <Style Selector="^:horizontal-collapsed:first-level">
<Setter Property="HorizontalAlignment" Value="Center"></Setter> <Setter Property="HorizontalAlignment" Value="Center" />
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter"> <Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="IsVisible" Value="False"></Setter> <Setter Property="IsVisible" Value="False" />
</Style> </Style>
<Style Selector="^ /template/ Rectangle#PART_SeparatorBorder"> <Style Selector="^ /template/ Rectangle#PART_SeparatorBorder">
<Setter Property="HorizontalAlignment" Value="Center"></Setter> <Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="Width" Value="12"></Setter> <Setter Property="Width" Value="12" />
</Style> </Style>
</Style> </Style>
</Style> </Style>