feat: add separator.
This commit is contained in:
@@ -20,13 +20,18 @@
|
||||
<TextBlock Grid.Row="1" Grid.Column="0" Text="{ReflectionBinding #menu.SelectedItem.Header}" />
|
||||
<Border Grid.Row="2" Grid.Column="0" Theme="{DynamicResource CardBorder}" HorizontalAlignment="Left" Padding="0">
|
||||
<u:NavMenu
|
||||
Header="Hello Ursa"
|
||||
Name="menu"
|
||||
Header="Welcome to Ursa!"
|
||||
HeaderBinding="{Binding Header}"
|
||||
IconBinding="{Binding IconIndex}"
|
||||
IsHorizontalCollapsed="{Binding #collapse.IsChecked, Mode=OneWay}"
|
||||
ItemsSource="{Binding MenuItems}"
|
||||
SubMenuBinding="{Binding Children}">
|
||||
<u:NavMenu.Styles>
|
||||
<Style Selector="u|NavMenuItem" x:DataType="vm:MenuItem">
|
||||
<Setter Property="IsSeparator" Value="{Binding IsSeparator}"></Setter>
|
||||
</Style>
|
||||
</u:NavMenu.Styles>
|
||||
<u:NavMenu.IconTemplate>
|
||||
<DataTemplate DataType="{x:Type x:Int32}">
|
||||
<u:TwoTonePathIcon
|
||||
@@ -42,7 +47,11 @@
|
||||
</DataTemplate>
|
||||
</u:NavMenu.IconTemplate>
|
||||
<u:NavMenu.Footer>
|
||||
<Button>Collapse</Button>
|
||||
<Image
|
||||
Width="48"
|
||||
Height="48"
|
||||
RenderOptions.BitmapInterpolationMode="HighQuality"
|
||||
Source="../Assets/Ursa.ico" />
|
||||
</u:NavMenu.Footer>
|
||||
</u:NavMenu>
|
||||
</Border>
|
||||
@@ -76,16 +85,5 @@
|
||||
</u:NavMenuItem.Icon>
|
||||
</u:NavMenuItem>
|
||||
</u:NavMenu>
|
||||
<StackPanel HorizontalAlignment="Left">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
</UserControl>
|
||||
|
||||
@@ -19,7 +19,7 @@ public class NavMenuDemoViewModel: ObservableObject
|
||||
new MenuItem() { Header = "How to Contribute" },
|
||||
new MenuItem() { Header = "Development Workflow" },
|
||||
}},
|
||||
new MenuItem() { Header = "Design Principles" },
|
||||
new MenuItem() { Header = "Design Principles"},
|
||||
new MenuItem() { Header = "Contributing", Children =
|
||||
{
|
||||
new MenuItem() { Header = "Code of Conduct" },
|
||||
@@ -27,6 +27,7 @@ public class NavMenuDemoViewModel: ObservableObject
|
||||
new MenuItem() { Header = "Development Workflow" },
|
||||
}},
|
||||
}},
|
||||
new MenuItem { Header = "Controls", IsSeparator = true},
|
||||
new MenuItem { Header = "Badge" },
|
||||
new MenuItem { Header = "Banner" },
|
||||
new MenuItem { Header = "ButtonGroup" },
|
||||
@@ -57,11 +58,13 @@ public class NavMenuDemoViewModel: ObservableObject
|
||||
|
||||
public class MenuItem
|
||||
{
|
||||
public string? Header { get; set; }
|
||||
public string? Icon { get; set; }
|
||||
public int IconIndex { get; set; }
|
||||
public ICommand NavigationCommand { get; set; }
|
||||
static Random r = new Random();
|
||||
|
||||
public string? Header { get; set; }
|
||||
public int IconIndex { get; set; }
|
||||
public bool IsSeparator { get; set; }
|
||||
public ICommand NavigationCommand { get; set; }
|
||||
|
||||
public MenuItem()
|
||||
{
|
||||
NavigationCommand = new AsyncRelayCommand(OnNavigate);
|
||||
|
||||
@@ -15,7 +15,7 @@
|
||||
<DockPanel LastChildFill="True">
|
||||
<ContentPresenter Content="{TemplateBinding Header}" DockPanel.Dock="Top"></ContentPresenter>
|
||||
<ContentPresenter Content="{TemplateBinding Footer}" DockPanel.Dock="Bottom"></ContentPresenter>
|
||||
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
|
||||
<ScrollViewer HorizontalAlignment="Center" HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
|
||||
<ItemsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" />
|
||||
</ScrollViewer>
|
||||
</DockPanel>
|
||||
@@ -33,6 +33,7 @@
|
||||
Name="PART_Border"
|
||||
Grid.Row="0"
|
||||
MinHeight="32"
|
||||
Cursor="Hand"
|
||||
Background="{TemplateBinding u:NavMenuItem.Background}"
|
||||
CornerRadius="4">
|
||||
<Grid
|
||||
@@ -116,75 +117,6 @@
|
||||
</ItemsPresenter>
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
<!--
|
||||
<ControlTemplate x:Key="TopLevelCollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
|
||||
<Border
|
||||
Name="PART_Border"
|
||||
MinWidth="32"
|
||||
MinHeight="32"
|
||||
HorizontalAlignment="Left"
|
||||
Background="{TemplateBinding u:NavMenuItem.Background}"
|
||||
CornerRadius="4">
|
||||
<Grid>
|
||||
<ContentPresenter
|
||||
Name="PART_IconPresenter"
|
||||
Content="{Binding Icon, RelativeSource={RelativeSource TemplatedParent}}"
|
||||
ContentTemplate="{Binding IconTemplate, RelativeSource={RelativeSource TemplatedParent}}" />
|
||||
</Grid>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
<ControlTemplate x:Key="CollapsedNavMenuItemTemplate" TargetType="u:NavMenuItem">
|
||||
<Border
|
||||
Name="PART_Border"
|
||||
MinWidth="24"
|
||||
MinHeight="24"
|
||||
HorizontalAlignment="Stretch"
|
||||
Background="{TemplateBinding u:NavMenuItem.Background}"
|
||||
CornerRadius="4">
|
||||
<Grid>
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="Auto" SharedSizeGroup="Icon" />
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="Auto" SharedSizeGroup="Expander" />
|
||||
</Grid.ColumnDefinitions>
|
||||
<ContentPresenter
|
||||
Padding="8"
|
||||
HorizontalAlignment="Left"
|
||||
Background="Transparent"
|
||||
Content="{Binding Icon, RelativeSource={RelativeSource TemplatedParent}}"
|
||||
ContentTemplate="{Binding IconTemplate, RelativeSource={RelativeSource TemplatedParent}}" />
|
||||
<ContentPresenter
|
||||
Grid.Column="1"
|
||||
Padding="0,8"
|
||||
Background="Transparent"
|
||||
Content="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}"
|
||||
ContentTemplate="{Binding HeaderTemplate, RelativeSource={RelativeSource TemplatedParent}}" />
|
||||
<PathIcon
|
||||
Name="PART_ExpanderIcon"
|
||||
Grid.Column="2"
|
||||
Width="8"
|
||||
Height="8"
|
||||
Margin="12,0"
|
||||
Data="{DynamicResource NavigationMenuItemExpandIconGlyph}"
|
||||
Foreground="{DynamicResource NavigationMenuItemExpandIconForeground}"
|
||||
RenderTransform="rotate(-90deg)" />
|
||||
<Popup
|
||||
Name="PART_Popup"
|
||||
Grid.Column="0"
|
||||
IsLightDismissEnabled="True"
|
||||
Placement="RightEdgeAlignedTop"
|
||||
PlacementTarget="{Binding #PART_Border}">
|
||||
<Border
|
||||
Padding="4"
|
||||
Grid.IsSharedSizeScope="True"
|
||||
Theme="{DynamicResource CardBorder}">
|
||||
<ItemsPresenter ItemsPanel="{Binding ItemsPanel, RelativeSource={RelativeSource TemplatedParent}}" />
|
||||
</Border>
|
||||
</Popup>
|
||||
</Grid>
|
||||
</Border>
|
||||
</ControlTemplate>
|
||||
-->
|
||||
<ControlTheme x:Key="{x:Type u:NavMenuItem}" TargetType="u:NavMenuItem">
|
||||
<Setter Property="Background" Value="Transparent" />
|
||||
<Setter Property="HorizontalAlignment" Value="Stretch"></Setter>
|
||||
@@ -244,30 +176,44 @@
|
||||
<Setter Property="RenderTransform" Value="rotate(-90deg)" />
|
||||
</Style>
|
||||
</Style>
|
||||
<!--
|
||||
<Style Selector="^:horizontal-collapsed:first-level">
|
||||
<Setter Property="Template" Value="{StaticResource TopLevelCollapsedNavMenuItemTemplate}" />
|
||||
<Style Selector="^ /template/ Border#PART_Border">
|
||||
<Setter Property="ToolTip.Tip" Value="{Binding Header, RelativeSource={RelativeSource TemplatedParent}}" />
|
||||
<Setter Property="ToolTip.ShowDelay" Value="0" />
|
||||
</Style>
|
||||
<Style Selector="^/template/ Border#PART_Border:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
|
||||
<Style Selector="^[IsSeparator=True]">
|
||||
<Setter Property="Template">
|
||||
<ControlTemplate>
|
||||
<StackPanel Cursor="No" Name="PART_RootPanel" Margin="{DynamicResource NavigationMenuSeparatorMargin}">
|
||||
<ContentPresenter
|
||||
Name="PART_HeaderPresenter"
|
||||
Margin="{DynamicResource NavigationMenuSeparatorHeaderMargin}"
|
||||
HorizontalAlignment="Left"
|
||||
Content="{TemplateBinding Header}"
|
||||
ContentTemplate="{TemplateBinding HeaderTemplate}"
|
||||
Foreground="{DynamicResource TextBlockQuaternaryForeground}"
|
||||
IsVisible="{TemplateBinding Header, Converter={x:Static ObjectConverters.IsNotNull}}">
|
||||
<ContentPresenter.Styles>
|
||||
<Style Selector="TextBlock">
|
||||
<Setter Property="FontSize" Value="{DynamicResource NavigationMenuSeparatorHeaderFontSize}" />
|
||||
</Style>
|
||||
</ContentPresenter.Styles>
|
||||
</ContentPresenter>
|
||||
<Rectangle
|
||||
Name="PART_SeparatorBorder"
|
||||
Height="{DynamicResource NavigationMenuSeparatorBorderHeight}"
|
||||
Margin="{DynamicResource NavigationMenuSeparatorBorderMargin}"
|
||||
HorizontalAlignment="Stretch"
|
||||
Fill="{DynamicResource SemiColorBorder}" />
|
||||
</StackPanel>
|
||||
</ControlTemplate>
|
||||
</Setter>
|
||||
<Style Selector="^:horizontal-collapsed:first-level">
|
||||
<Setter Property="HorizontalAlignment" Value="Center"></Setter>
|
||||
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
|
||||
<Setter Property="IsVisible" Value="False"></Setter>
|
||||
</Style>
|
||||
<Style Selector="^ /template/ Rectangle#PART_SeparatorBorder">
|
||||
<Setter Property="HorizontalAlignment" Value="Center"></Setter>
|
||||
<Setter Property="Width" Value="12"></Setter>
|
||||
</Style>
|
||||
</Style>
|
||||
</Style>
|
||||
<Style Selector="^:horizontal-collapsed:not(:first-level)">
|
||||
<Setter Property="Template" Value="{StaticResource CollapsedNavMenuItemTemplate}" />
|
||||
<Style Selector="^:selected">
|
||||
<Setter Property="Background" Value="{DynamicResource NavigationMenuItemSelectedBackground}" />
|
||||
</Style>
|
||||
<Style Selector="^:empty /template/ PathIcon#PART_ExpanderIcon">
|
||||
<Setter Property="IsVisible" Value="False" />
|
||||
</Style>
|
||||
<Style Selector="^/template/ Border#PART_Border:pointerover">
|
||||
<Setter Property="Background" Value="{DynamicResource NavigationMenuItemPointeroverBackground}" />
|
||||
</Style>
|
||||
</Style>
|
||||
-->
|
||||
</ControlTheme>
|
||||
|
||||
</ResourceDictionary>
|
||||
|
||||
@@ -124,7 +124,15 @@ public class NavMenuItem: HeaderedSelectingItemsControl
|
||||
get => _level;
|
||||
set => SetAndRaise(LevelProperty, ref _level, value);
|
||||
}
|
||||
|
||||
|
||||
public static readonly StyledProperty<bool> IsSeparatorProperty = AvaloniaProperty.Register<NavMenuItem, bool>(
|
||||
nameof(IsSeparator));
|
||||
|
||||
public bool IsSeparator
|
||||
{
|
||||
get => GetValue(IsSeparatorProperty);
|
||||
set => SetValue(IsSeparatorProperty, value);
|
||||
}
|
||||
|
||||
static NavMenuItem()
|
||||
{
|
||||
@@ -222,6 +230,11 @@ public class NavMenuItem: HeaderedSelectingItemsControl
|
||||
|
||||
protected override void OnPointerPressed(PointerPressedEventArgs e)
|
||||
{
|
||||
if (IsSeparator)
|
||||
{
|
||||
e.Handled = true;
|
||||
return;
|
||||
}
|
||||
base.OnPointerPressed(e);
|
||||
if (this.ItemCount == 0)
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user