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"
Margin="24"
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 3" AnchorId="a3" />
</u:AnchorItem>
<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 7" AnchorId="a7" />
</u:AnchorItem>
</u:Anchor>
</Grid>
</TabItem>
@@ -201,7 +199,6 @@
</ScrollViewer>
<u:Anchor
Grid.Column="1"
Classes="Tertiary"
Width="200"
Margin="24"
ItemsSource="{Binding AnchorItems}"
@@ -213,11 +210,56 @@
</u:Anchor.Styles>
<u:Anchor.ItemTemplate>
<TreeDataTemplate ItemsSource="{Binding Children}">
<TextBlock Text="{Binding Header}"/>
<TextBlock Text="{Binding Header}" />
</TreeDataTemplate>
</u:Anchor.ItemTemplate>
</u:Anchor>
</Grid>
</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>
</UserControl>

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

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

6
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">
<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="AnchorSmallHeight">16</x:Double>
<StaticResource x:Key="AnchorSmallFontSize" ResourceKey="SemiFontSizeSmall"/>
<x:Double x:Key="AnchorSmallFontSize">12</x:Double>
</ResourceDictionary>