Add HeaderPadding And ContentPadding for Collapse

This commit is contained in:
qinware
2025-09-02 20:58:45 +08:00
parent a8573f8a1a
commit 9224bf31b0
6 changed files with 175 additions and 46 deletions
+3 -3
View File
@@ -135,12 +135,12 @@ public class Breadcrumb : ItemsControl, IControlSharedTokenResourcesHost, IMotio
{
if (breadcrumbItem.Separator == null)
{
breadcrumbItem.SetValue(SeparatorProperty, Separator, BindingPriority.Template);
breadcrumbItem.SetCurrentValue(SeparatorProperty, Separator);
}
if (breadcrumbItem.SeparatorTemplate == null)
{
breadcrumbItem.SetValue(SeparatorTemplateProperty, SeparatorTemplate, BindingPriority.Template);
breadcrumbItem.SetCurrentValue(SeparatorTemplateProperty, SeparatorTemplate);
}
}
@@ -149,7 +149,7 @@ public class Breadcrumb : ItemsControl, IControlSharedTokenResourcesHost, IMotio
base.OnApplyTemplate(e);
if (Separator == null)
{
SetValue(SeparatorProperty, DefaultSeparator, BindingPriority.Template);
SetCurrentValue(SeparatorProperty, DefaultSeparator);
}
}
+1 -1
View File
@@ -381,6 +381,7 @@ public class Button : AvaloniaButton,
base.OnApplyTemplate(e);
// 为了防止意外被用户改变背景,做了一个 frame
_frame = e.NameScope.Find<Border>(ButtonThemeConstants.FramePart);
UpdatePseudoClasses();
}
protected override void OnLoaded(RoutedEventArgs e)
@@ -414,7 +415,6 @@ public class Button : AvaloniaButton,
{
base.OnAttachedToVisualTree(e);
SetupEffectiveBorderThickness();
UpdatePseudoClasses();
}
private void SetupEffectiveBorderThickness()
+49 -2
View File
@@ -58,8 +58,14 @@ public class Collapse : SelectingItemsControl,
public static readonly StyledProperty<CollapseExpandIconPosition> ExpandIconPositionProperty =
AvaloniaProperty.Register<Collapse, CollapseExpandIconPosition>(nameof(ExpandIconPosition));
public static readonly StyledProperty<bool> IsMotionEnabledProperty
= MotionAwareControlProperty.IsMotionEnabledProperty.AddOwner<Collapse>();
public static readonly StyledProperty<bool> IsMotionEnabledProperty =
MotionAwareControlProperty.IsMotionEnabledProperty.AddOwner<Collapse>();
public static readonly StyledProperty<Thickness?> ItemHeaderPaddingProperty =
AvaloniaProperty.Register<Collapse, Thickness?>(nameof(ItemHeaderPadding));
public static readonly StyledProperty<Thickness?> ItemContentPaddingProperty =
AvaloniaProperty.Register<Collapse, Thickness?>(nameof(ItemContentPadding));
public SizeType SizeType
{
@@ -102,6 +108,18 @@ public class Collapse : SelectingItemsControl,
get => GetValue(IsMotionEnabledProperty);
set => SetValue(IsMotionEnabledProperty, value);
}
public Thickness? ItemHeaderPadding
{
get => GetValue(ItemHeaderPaddingProperty);
set => SetValue(ItemHeaderPaddingProperty, value);
}
public Thickness? ItemContentPadding
{
get => GetValue(ItemContentPaddingProperty);
set => SetValue(ItemContentPaddingProperty, value);
}
#endregion
@@ -223,6 +241,7 @@ public class Collapse : SelectingItemsControl,
_itemsBindingDisposables.Add(collapseItem, disposables);
SetupCollapseBorderThickness(collapseItem, index);
ConfigureItemPaddings(collapseItem);
}
}
@@ -341,6 +360,21 @@ public class Collapse : SelectingItemsControl,
{
SetupItemsBorderThickness();
}
if (change.Property == ItemHeaderPaddingProperty ||
change.Property == ItemContentPaddingProperty)
{
if (Items.Count > 0)
{
for (int i = 0; i < ItemCount; i++)
{
var item = Items[i];
if (item is CollapseItem collapseItem)
{
ConfigureItemPaddings(collapseItem);
}
}
}
}
}
private void SetupEffectiveBorderThickness()
@@ -381,4 +415,17 @@ public class Collapse : SelectingItemsControl,
base.OnDetachedFromLogicalTree(e);
this.DisposeTokenBindings();
}
private void ConfigureItemPaddings(CollapseItem collapseItem)
{
if (collapseItem.HeaderPadding == null)
{
collapseItem.SetCurrentValue(CollapseItem.HeaderPaddingProperty, ItemHeaderPadding);
}
if (collapseItem.ContentPadding == null)
{
collapseItem.SetCurrentValue(CollapseItem.ContentPaddingProperty, ItemContentPadding);
}
}
}
@@ -38,6 +38,12 @@ public class CollapseItem : HeaderedContentControl,
public static readonly StyledProperty<IDataTemplate?> AddOnContentTemplateProperty =
AvaloniaProperty.Register<CollapseItem, IDataTemplate?>(nameof(AddOnContentTemplate));
public static readonly StyledProperty<Thickness?> HeaderPaddingProperty =
AvaloniaProperty.Register<CollapseItem, Thickness?>(nameof(HeaderPadding));
public static readonly StyledProperty<Thickness?> ContentPaddingProperty =
AvaloniaProperty.Register<CollapseItem, Thickness?>(nameof(ContentPadding));
public bool IsSelected
{
@@ -68,7 +74,18 @@ public class CollapseItem : HeaderedContentControl,
get => GetValue(AddOnContentTemplateProperty);
set => SetValue(AddOnContentTemplateProperty, value);
}
public Thickness? HeaderPadding
{
get => GetValue(HeaderPaddingProperty);
set => SetValue(HeaderPaddingProperty, value);
}
public Thickness? ContentPadding
{
get => GetValue(ContentPaddingProperty);
set => SetValue(ContentPaddingProperty, value);
}
#endregion
#region 内部属性定义
@@ -267,6 +284,8 @@ public class CollapseItem : HeaderedContentControl,
_expandButton.Transitions = null;
};
}
UpdatePseudoClasses();
}
protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
@@ -297,6 +316,12 @@ public class CollapseItem : HeaderedContentControl,
}
}
if (change.Property == ContentPaddingProperty ||
change.Property == HeaderPaddingProperty)
{
UpdatePseudoClasses();
}
if (IsLoaded)
{
if (change.Property == IsMotionEnabledProperty)
@@ -420,4 +445,10 @@ public class CollapseItem : HeaderedContentControl,
}
}
}
private void UpdatePseudoClasses()
{
PseudoClasses.Set(CollapseItemPseudoClass.CustomHeaderPadding, HeaderPadding != null);
PseudoClasses.Set(CollapseItemPseudoClass.CustomContentPadding, ContentPadding != null);
}
}
@@ -0,0 +1,7 @@
namespace AtomUI.Controls;
internal static class CollapseItemPseudoClass
{
public const string CustomHeaderPadding = ":custom-header-padding";
public const string CustomContentPadding = ":custom-content-padding";
}
@@ -12,7 +12,8 @@
LastChildFill="True">
<Border Name="{x:Static atom:CollapseItemThemeConstants.HeaderDecoratorPart}"
DockPanel.Dock="Top"
BorderThickness="{TemplateBinding HeaderBorderThickness}">
BorderThickness="{TemplateBinding HeaderBorderThickness}"
Padding="{TemplateBinding HeaderPadding}">
<Grid ColumnDefinitions="Auto, *, Auto, Auto">
<atom:IconButton
Name="{x:Static atom:CollapseItemThemeConstants.ExpandButtonPart}"
@@ -42,12 +43,14 @@
Grid.Column="2" />
</Grid>
</Border>
<atom:LayoutAwareMotionActor Name="{x:Static atom:CollapseItemThemeConstants.ContentMotionActorPart}"
ClipToBounds="True">
<atom:LayoutAwareMotionActor
Name="{x:Static atom:CollapseItemThemeConstants.ContentMotionActorPart}"
ClipToBounds="True">
<ContentPresenter Name="{x:Static atom:CollapseItemThemeConstants.ContentPresenterPart}"
Content="{TemplateBinding Content, Converter={StaticResource StringToTextBlockConverter}}"
ContentTemplate="{TemplateBinding ContentTemplate}"
BorderThickness="{TemplateBinding ContentBorderThickness}" />
BorderThickness="{TemplateBinding ContentBorderThickness}"
Padding="{TemplateBinding ContentPadding}"/>
</atom:LayoutAwareMotionActor>
</DockPanel>
</ControlTemplate>
@@ -58,87 +61,127 @@
<Setter Property="Background" Value="{DynamicResource {x:Static atom:CollapseTokenKey.HeaderBg}}" />
<Setter Property="BorderBrush" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorBorder}}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="BorderBrush" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorBorder}}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_HeaderPresenter">
<Setter Property="Foreground" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextHeading}}" />
</Style>
<Style Selector="^ /template/ atom|IconButton#PART_ExpandButton">
<Setter Property="IconWidth" Value="{DynamicResource {x:Static atom:SharedTokenKey.IconSizeSM}}" />
<Setter Property="IconHeight" Value="{DynamicResource {x:Static atom:SharedTokenKey.IconSizeSM}}" />
<Setter Property="DisabledIconBrush" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextDisabled}}" />
<Setter Property="DisabledIconBrush"
Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextDisabled}}" />
</Style>
<Style Selector="^:selected">
<Style Selector="^ /template/ atom|IconButton#PART_ExpandButton">
<Setter Property="RenderTransform" Value="rotate(90deg)" />
</Style>
</Style>
<Style Selector="^:not(:custom-header-padding)">
<Style Selector="^[SizeType=Large]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseHeaderPaddingLG}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Middle]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.HeaderPadding}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Small]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseHeaderPaddingSM}}" />
</Style>
</Style>
</Style>
<Style Selector="^:not(:custom-content-padding)">
<Style Selector="^[SizeType=Large]">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseContentPaddingLG}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Middle]">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.ContentPadding}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Small]">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseContentPaddingSM}}" />
</Style>
</Style>
</Style>
<Style Selector="^[SizeType=Large]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseHeaderPaddingLG}}" />
<Setter Property="TextElement.FontSize" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSizeLG}}" />
<Setter Property="TextBlock.LineHeight" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeightLG}}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseContentPaddingLG}}" />
<Setter Property="TextElement.FontSize"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSizeLG}}" />
<Setter Property="TextBlock.LineHeight"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeightLG}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Middle]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.HeaderPadding}}" />
<Setter Property="TextElement.FontSize" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSize}}" />
<Setter Property="TextBlock.LineHeight" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeight}}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.ContentPadding}}" />
<Setter Property="TextElement.FontSize"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSize}}" />
<Setter Property="TextBlock.LineHeight"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeight}}" />
</Style>
</Style>
<Style Selector="^[SizeType=Small]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseHeaderPaddingSM}}" />
<Setter Property="TextElement.FontSize" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSize}}" />
<Setter Property="TextBlock.LineHeight" Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeight}}" />
</Style>
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Padding" Value="{DynamicResource {x:Static atom:CollapseTokenKey.CollapseContentPaddingSM}}" />
<Setter Property="TextElement.FontSize"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontSize}}" />
<Setter Property="TextBlock.LineHeight"
Value="{DynamicResource {x:Static atom:SharedTokenKey.FontHeight}}" />
</Style>
</Style>
<Style Selector="^[TriggerType=Header]">
<Style Selector="^ /template/ Border#PART_HeaderDecorator">
<Setter Property="Cursor" Value="Hand" />
</Style>
</Style>
<Style Selector="^[TriggerType=Icon]">
<Style Selector="^ /template/ atom|IconButton#PART_ExpandButton">
<Setter Property="Cursor" Value="Hand" />
</Style>
</Style>
<Style Selector="^[ExpandIconPosition=Start]">
<Style Selector="^ /template/ atom|IconButton#PART_ExpandButton">
<Setter Property="Grid.Column" Value="0" />
<Setter Property="Margin" Value="{DynamicResource {x:Static atom:CollapseTokenKey.LeftExpandButtonMargin}}" />
<Setter Property="Margin"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.LeftExpandButtonMargin}}" />
</Style>
</Style>
<Style Selector="^[ExpandIconPosition=End]">
<Style Selector="^ /template/ atom|IconButton#PART_ExpandButton">
<Setter Property="Grid.Column" Value="3" />
<Setter Property="Margin" Value="{DynamicResource {x:Static atom:CollapseTokenKey.RightExpandButtonMargin}}" />
<Setter Property="Margin"
Value="{DynamicResource {x:Static atom:CollapseTokenKey.RightExpandButtonMargin}}" />
</Style>
</Style>
<Style Selector="^[IsBorderless=True]">
<Style Selector="^ /template/ ContentPresenter#PART_ContentPresenter">
<Setter Property="Background" Value="{DynamicResource {x:Static atom:CollapseTokenKey.HeaderBg}}" />
@@ -150,13 +193,14 @@
<Setter Property="Background" Value="{DynamicResource {x:Static atom:CollapseTokenKey.ContentBg}}" />
</Style>
</Style>
<Style Selector="^:disabled">
<Setter Property="Foreground" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextDisabled}}" />
<Style Selector="^ /template/ Border#PART_HeaderDecorator ContentPresenter">
<Setter Property="Foreground" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextDisabled}}" />
<Setter Property="Foreground"
Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorTextDisabled}}" />
</Style>
</Style>
</ControlTheme>
</ResourceDictionary>