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

feat: update AnchorItem Padding Converter.

Browse Source
This commit is contained in:
Zhang Dian
2025-07-10 19:55:34 +08:00
parent b304d585bd
commit 3ae76efd45
4 changed files with 67 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
demo/Ursa.Demo/Pages/AnchorDemo.axaml
View File

@@ -79,17 +79,15 @@
Width="200" Width="200"
Margin="24" Margin="24"
TargetContainer="{Binding ElementName=container1}"> TargetContainer="{Binding ElementName=container1}">
<u:AnchorItem Header="Rectangle 1" AnchorId="a1" > <u:AnchorItem Header="Rectangle 1" AnchorId="a1">
<u:AnchorItem Header="Rectangle 2" AnchorId="a2" /> <u:AnchorItem Header="Rectangle 2" AnchorId="a2" />
<u:AnchorItem Header="Rectangle 3" AnchorId="a3" /> <u:AnchorItem Header="Rectangle 3" AnchorId="a3" />
</u:AnchorItem> </u:AnchorItem>
<u:AnchorItem Header="Rectangle 4" AnchorId="a4" /> <u:AnchorItem Header="Rectangle 4" AnchorId="a4" />
<u:AnchorItem Header="Rectangle 5" AnchorId="a5" > <u:AnchorItem Header="Rectangle 5" AnchorId="a5">
<u:AnchorItem Header="Rectangle 6" AnchorId="a6" /> <u:AnchorItem Header="Rectangle 6" AnchorId="a6" />
<u:AnchorItem Header="Rectangle 7" AnchorId="a7" /> <u:AnchorItem Header="Rectangle 7" AnchorId="a7" />
</u:AnchorItem> </u:AnchorItem>
</u:Anchor> </u:Anchor>
</Grid> </Grid>
</TabItem> </TabItem>
@@ -201,7 +199,6 @@
</ScrollViewer> </ScrollViewer>
<u:Anchor <u:Anchor
Grid.Column="1" Grid.Column="1"
Classes="Tertiary"
Width="200" Width="200"
Margin="24" Margin="24"
ItemsSource="{Binding AnchorItems}" ItemsSource="{Binding AnchorItems}"
@@ -213,11 +210,56 @@
</u:Anchor.Styles> </u:Anchor.Styles>
<u:Anchor.ItemTemplate> <u:Anchor.ItemTemplate>
<TreeDataTemplate ItemsSource="{Binding Children}"> <TreeDataTemplate ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Header}"/> <TextBlock Text="{Binding Header}" />
</TreeDataTemplate> </TreeDataTemplate>
</u:Anchor.ItemTemplate> </u:Anchor.ItemTemplate>
</u:Anchor> </u:Anchor>
</Grid> </Grid>
</TabItem> </TabItem>
<TabItem Header="Appearance">
<StackPanel
Orientation="Horizontal"
Spacing="100"
Margin="8">
<u:Anchor>
<u:AnchorItem Header="组件" />
<u:AnchorItem Header="设计语言" />
<u:AnchorItem Header="物料平台" />
<u:AnchorItem Header="主题商店" />
</u:Anchor>
<u:Anchor Classes="Small">
<u:AnchorItem Header="组件" />
<u:AnchorItem Header="设计语言" />
<u:AnchorItem Header="物料平台" />
<u:AnchorItem Header="主题商店" />
</u:Anchor>
<u:Anchor Classes="Tertiary">
<u:AnchorItem Header="尺寸" />
<u:AnchorItem Header="组件" />
<u:AnchorItem Header="设计语言" />
<u:AnchorItem Header="物料平台" />
<u:AnchorItem Header="主题商店" />
</u:Anchor>
<u:Anchor Classes="Muted">
<u:AnchorItem Header="尺寸" />
<u:AnchorItem Header="组件" />
<u:AnchorItem Header="设计语言" />
<u:AnchorItem Header="物料平台" />
<u:AnchorItem Header="主题商店" />
</u:Anchor>
<u:Anchor>
<u:AnchorItem Header="1. 动态展示">
<u:AnchorItem Header="1.1 组件">
<u:AnchorItem Header="1.1.1 Avatar" />
<u:AnchorItem Header="1.1.2 Button" />
<u:AnchorItem Header="1.1.3 Icon" />
</u:AnchorItem>
<u:AnchorItem Header="1.2 物料" />
<u:AnchorItem Header="1.3 主题商店" />
</u:AnchorItem>
<u:AnchorItem Header="2. 设计语言" />
</u:Anchor>
</StackPanel>
</TabItem>
</TabControl> </TabControl>
</UserControl> </UserControl>

20
src/Ursa.Themes.Semi/Controls/Anchor.axaml
View File

@@ -4,7 +4,7 @@
xmlns:converters="clr-namespace:Ursa.Themes.Semi.Converters" xmlns:converters="clr-namespace:Ursa.Themes.Semi.Converters"
xmlns:iri="https://irihi.tech/shared" xmlns:iri="https://irihi.tech/shared"
xmlns:u="https://irihi.tech/ursa"> xmlns:u="https://irihi.tech/ursa">
<converters:TreeLevelToMarginConverter x:Key="LevelToMarginConverter" /> <converters:TreeLevelToPaddingConverter x:Key="LevelToPaddingConverter" />
<ControlTheme x:Key="{x:Type u:Anchor}" TargetType="{x:Type u:Anchor}"> <ControlTheme x:Key="{x:Type u:Anchor}" TargetType="{x:Type u:Anchor}">
<Setter Property="Background" Value="Transparent" /> <Setter Property="Background" Value="Transparent" />
<Setter Property="VerticalAlignment" Value="Top" /> <Setter Property="VerticalAlignment" Value="Top" />
@@ -12,7 +12,7 @@
<ControlTemplate> <ControlTemplate>
<Panel> <Panel>
<Rectangle <Rectangle
Width="1" Width="{DynamicResource AnchorPipeWidth}"
Name="PART_Pipe" Name="PART_Pipe"
HorizontalAlignment="Left" HorizontalAlignment="Left"
VerticalAlignment="Stretch" VerticalAlignment="Stretch"
@@ -24,7 +24,7 @@
</Panel> </Panel>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^.Mute /template/ Rectangle#PART_Pipe"> <Style Selector="^.Muted /template/ Rectangle#PART_Pipe">
<Setter Property="Fill" Value="Transparent" /> <Setter Property="Fill" Value="Transparent" />
</Style> </Style>
</ControlTheme> </ControlTheme>
@@ -39,23 +39,23 @@
<Panel Background="{TemplateBinding Background}"> <Panel Background="{TemplateBinding Background}">
<Border <Border
Name="PART_Pipe" Name="PART_Pipe"
Width="2" Width="{DynamicResource AnchorPipeWidth}"
CornerRadius="1" CornerRadius="{DynamicResource AnchorPipeCornerRadius}"
HorizontalAlignment="Left" HorizontalAlignment="Left"
VerticalAlignment="Stretch" /> VerticalAlignment="Stretch" />
<Panel Margin="8,0,0,0"> <Panel>
<ContentPresenter <ContentPresenter
Name="{x:Static iri:PartNames.PART_HeaderPresenter}" Name="{x:Static iri:PartNames.PART_HeaderPresenter}"
VerticalAlignment="Center" VerticalAlignment="Center"
Foreground="{DynamicResource AnchorForeground}" Foreground="{DynamicResource AnchorForeground}"
Content="{TemplateBinding Header}" Content="{TemplateBinding Header}"
ContentTemplate="{TemplateBinding HeaderTemplate}"> ContentTemplate="{TemplateBinding HeaderTemplate}">
<ContentPresenter.Margin> <ContentPresenter.Padding>
<MultiBinding Converter="{StaticResource LevelToMarginConverter}"> <MultiBinding Converter="{StaticResource LevelToPaddingConverter}">
<Binding Path="Level" RelativeSource="{RelativeSource AncestorType={x:Type u:AnchorItem}}" /> <Binding Path="Level" RelativeSource="{RelativeSource AncestorType={x:Type u:AnchorItem}}" />
<DynamicResource ResourceKey="AnchorIndent" /> <DynamicResource ResourceKey="AnchorIndent" />
</MultiBinding> </MultiBinding>
</ContentPresenter.Margin> </ContentPresenter.Padding>
</ContentPresenter> </ContentPresenter>
</Panel> </Panel>
</Panel> </Panel>
@@ -83,7 +83,7 @@
<Style Selector="^.Tertiary /template/ Border#PART_Pipe"> <Style Selector="^.Tertiary /template/ Border#PART_Pipe">
<Setter Property="Background" Value="{DynamicResource AnchorPipeSelectedTertiaryBackground}" /> <Setter Property="Background" Value="{DynamicResource AnchorPipeSelectedTertiaryBackground}" />
</Style> </Style>
<Style Selector="^.Mute /template/ Border#PART_Pipe"> <Style Selector="^.Muted /template/ Border#PART_Pipe">
<Setter Property="Background" Value="Transparent" /> <Setter Property="Background" Value="Transparent" />
</Style> </Style>
</Style> </Style>

7
src/Ursa.Themes.Semi/Converters/TreeLevelToMarginConverter.cs → src/Ursa.Themes.Semi/Converters/TreeLevelToPaddingConverter.cs
View File

@@ -4,14 +4,15 @@ using Avalonia.Data.Converters;
namespace Ursa.Themes.Semi.Converters; namespace Ursa.Themes.Semi.Converters;
public class TreeLevelToMarginConverter: IMultiValueConverter public class TreeLevelToPaddingConverter : IMultiValueConverter
{ {
public object? Convert(IList<object?> values, Type targetType, object? parameter, CultureInfo culture) public object? Convert(IList<object?> values, Type targetType, object? parameter, CultureInfo culture)
{ {
if (values[0] is int i && values[1] is double indent) if (values[0] is int i && values[1] is Thickness indent)
{ {
return new Thickness(Math.Max(i-1, 0) * indent, 0, 0, 0); return new Thickness(Math.Max(i, 0) * indent.Left, indent.Top, indent.Right, indent.Bottom);
} }
return new Thickness(); return new Thickness();
} }
} }

8
src/Ursa.Themes.Semi/Themes/Shared/Anchor.axaml
View File

@@ -1,6 +1,8 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<x:Double x:Key="AnchorIndent">12</x:Double> <Thickness x:Key="AnchorIndent">8,4,0,4</Thickness>
<x:Double x:Key="AnchorPipeWidth">2</x:Double>
<CornerRadius x:Key="AnchorPipeCornerRadius">1</CornerRadius>
<x:Double x:Key="AnchorDefaultHeight">20</x:Double> <x:Double x:Key="AnchorDefaultHeight">20</x:Double>
<x:Double x:Key="AnchorSmallHeight">16</x:Double> <x:Double x:Key="AnchorSmallHeight">16</x:Double>
<StaticResource x:Key="AnchorSmallFontSize" ResourceKey="SemiFontSizeSmall"/> <x:Double x:Key="AnchorSmallFontSize">12</x:Double>
</ResourceDictionary> </ResourceDictionary>