mirror of
https://github.com/AtomUI/AtomUI.git
synced 2026-10-22 00:46:48 +08:00
Refactor Button background
This commit is contained in:
@@ -1,8 +1,11 @@
|
||||
using AtomUI.IconPkg;
|
||||
using AtomUI.Controls.Utils;
|
||||
using AtomUI.IconPkg;
|
||||
using AtomUI.IconPkg.AntDesign;
|
||||
using AtomUI.Media;
|
||||
using AtomUI.Theme;
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia;
|
||||
using Avalonia.Animation;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Controls.Presenters;
|
||||
using Avalonia.Controls.Primitives;
|
||||
@@ -17,6 +20,7 @@ namespace AtomUI.Controls;
|
||||
|
||||
internal abstract class BaseButtonTheme : BaseControlTheme
|
||||
{
|
||||
public const string FramePart = "PART_Frame";
|
||||
public const string LabelPart = "PART_Label";
|
||||
public const string MainInfoLayoutPart = "PART_MainInfoLayout";
|
||||
public const string RootLayoutPart = "PART_RootLayout";
|
||||
@@ -93,14 +97,16 @@ internal abstract class BaseButtonTheme : BaseControlTheme
|
||||
rootLayout.Children.Add(extraContentLayout);
|
||||
rootLayout.Children.Add(mainInfoLayout);
|
||||
|
||||
var frame = new Border();
|
||||
var frame = new Border()
|
||||
{
|
||||
Name = FramePart
|
||||
};
|
||||
|
||||
CreateTemplateParentBinding(frame, Decorator.PaddingProperty, TemplatedControl.PaddingProperty);
|
||||
CreateTemplateParentBinding(frame, Border.BorderThicknessProperty,
|
||||
Button.EffectiveBorderThicknessProperty);
|
||||
CreateTemplateParentBinding(frame, Border.BorderBrushProperty,
|
||||
TemplatedControl.BorderBrushProperty);
|
||||
CreateTemplateParentBinding(frame, Border.BackgroundProperty, TemplatedControl.BackgroundProperty);
|
||||
CreateTemplateParentBinding(frame, Border.BackgroundSizingProperty,
|
||||
TemplatedControl.BackgroundSizingProperty);
|
||||
CreateTemplateParentBinding(frame, Border.CornerRadiusProperty,
|
||||
@@ -149,6 +155,16 @@ internal abstract class BaseButtonTheme : BaseControlTheme
|
||||
BuildSizeStyle();
|
||||
BuildIconStyle();
|
||||
BuildLoadingStyle();
|
||||
|
||||
// 动画设置
|
||||
var isMotionEnabledStyle = new Style(selector => selector.Nesting().PropertyEquals(Button.IsMotionEnabledProperty, true));
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(IconButton.TransitionsProperty, new SetterValueFactory<Transitions>(() => new Transitions()
|
||||
{
|
||||
AnimationUtils.CreateTransition<SolidColorBrushTransition>(TemplatedControl.BackgroundProperty)
|
||||
}));
|
||||
isMotionEnabledStyle.Add(frameStyle);
|
||||
Add(isMotionEnabledStyle);
|
||||
}
|
||||
|
||||
private void BuildSizeStyle()
|
||||
|
||||
@@ -570,7 +570,6 @@ public class Button : AvaloniaButton,
|
||||
var transitions = new Transitions();
|
||||
if (ButtonType == ButtonType.Primary)
|
||||
{
|
||||
transitions.Add(AnimationUtils.CreateTransition<SolidColorBrushTransition>(BackgroundProperty));
|
||||
if (IsGhost)
|
||||
{
|
||||
transitions.Add(
|
||||
@@ -583,10 +582,6 @@ public class Button : AvaloniaButton,
|
||||
transitions.Add(AnimationUtils.CreateTransition<SolidColorBrushTransition>(BorderBrushProperty));
|
||||
transitions.Add(AnimationUtils.CreateTransition<SolidColorBrushTransition>(ForegroundProperty));
|
||||
}
|
||||
else if (ButtonType == ButtonType.Text)
|
||||
{
|
||||
transitions.Add(AnimationUtils.CreateTransition<SolidColorBrushTransition>(BackgroundProperty));
|
||||
}
|
||||
else if (ButtonType == ButtonType.Link)
|
||||
{
|
||||
transitions.Add(AnimationUtils.CreateTransition<SolidColorBrushTransition>(ForegroundProperty));
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Controls.Primitives;
|
||||
using Avalonia.Styling;
|
||||
|
||||
@@ -21,10 +22,15 @@ internal abstract class BaseDefaultButtonTheme : BaseButtonTheme
|
||||
{
|
||||
var enabledStyle = new Style(selector => selector.Nesting());
|
||||
// 正常状态
|
||||
enabledStyle.Add(TemplatedControl.BackgroundProperty, ButtonTokenKey.DefaultBg);
|
||||
enabledStyle.Add(TemplatedControl.BorderBrushProperty, ButtonTokenKey.DefaultBorderColor);
|
||||
enabledStyle.Add(TemplatedControl.ForegroundProperty, ButtonTokenKey.DefaultColor);
|
||||
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, ButtonTokenKey.DefaultBg);
|
||||
enabledStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 正常 hover
|
||||
{
|
||||
var hoverStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.PointerOver));
|
||||
@@ -74,7 +80,11 @@ internal abstract class BaseDefaultButtonTheme : BaseButtonTheme
|
||||
// 正常状态
|
||||
ghostStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorTextLightSolid);
|
||||
ghostStyle.Add(TemplatedControl.BorderBrushProperty, SharedTokenKey.ColorTextLightSolid);
|
||||
ghostStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
ghostStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 正常 hover
|
||||
{
|
||||
@@ -95,9 +105,14 @@ internal abstract class BaseDefaultButtonTheme : BaseButtonTheme
|
||||
|
||||
// 危险按钮状态
|
||||
var dangerStyle = new Style(selector => selector.Nesting().PropertyEquals(Button.IsDangerProperty, true));
|
||||
dangerStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
dangerStyle.Add(TemplatedControl.BorderBrushProperty, SharedTokenKey.ColorError);
|
||||
dangerStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorError);
|
||||
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
dangerStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 危险状态 hover
|
||||
{
|
||||
@@ -124,7 +139,11 @@ internal abstract class BaseDefaultButtonTheme : BaseButtonTheme
|
||||
var disabledStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.Disabled));
|
||||
disabledStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorTextDisabled);
|
||||
disabledStyle.Add(TemplatedControl.BorderBrushProperty, ButtonTokenKey.BorderColorDisabled);
|
||||
disabledStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorBgContainerDisabled);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorBgContainerDisabled);
|
||||
disabledStyle.Add(frameStyle);
|
||||
}
|
||||
Add(disabledStyle);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Controls.Primitives;
|
||||
using Avalonia.Markup.Xaml.MarkupExtensions;
|
||||
using Avalonia.Media;
|
||||
using Avalonia.Styling;
|
||||
|
||||
namespace AtomUI.Controls;
|
||||
@@ -22,8 +24,13 @@ internal abstract class BaseLinkButtonTheme : BaseButtonTheme
|
||||
{
|
||||
var enabledStyle = new Style(selector => selector.Nesting());
|
||||
// 正常状态
|
||||
enabledStyle.Add(TemplatedControl.BackgroundProperty, ButtonTokenKey.DefaultBg);
|
||||
enabledStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorLink);
|
||||
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, ButtonTokenKey.DefaultBg);
|
||||
enabledStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 正常 hover
|
||||
{
|
||||
@@ -68,8 +75,11 @@ internal abstract class BaseLinkButtonTheme : BaseButtonTheme
|
||||
{
|
||||
var ghostStyle = new Style(selector => selector.Nesting().PropertyEquals(Button.IsGhostProperty, true));
|
||||
// 正常状态
|
||||
ghostStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, Brushes.Transparent);
|
||||
ghostStyle.Add(frameStyle);
|
||||
}
|
||||
Add(ghostStyle);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Controls.Primitives;
|
||||
using Avalonia.Media;
|
||||
using Avalonia.Styling;
|
||||
@@ -24,12 +25,21 @@ internal abstract class BasePrimaryButtonTheme : BaseButtonTheme
|
||||
|
||||
// 正常状态
|
||||
enabledStyle.Add(TemplatedControl.ForegroundProperty, ButtonTokenKey.PrimaryColor);
|
||||
enabledStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorPrimary);
|
||||
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorPrimary);
|
||||
enabledStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 正常 hover
|
||||
{
|
||||
var hoverStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.PointerOver));
|
||||
hoverStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorPrimaryHover);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorPrimaryHover);
|
||||
hoverStyle.Add(frameStyle);
|
||||
}
|
||||
enabledStyle.Add(hoverStyle);
|
||||
}
|
||||
|
||||
@@ -37,18 +47,30 @@ internal abstract class BasePrimaryButtonTheme : BaseButtonTheme
|
||||
{
|
||||
var pressedStyle = new Style(selector =>
|
||||
selector.Nesting().Class(StdPseudoClass.PointerOver).Class(StdPseudoClass.Pressed));
|
||||
pressedStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorPrimaryActive);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorPrimaryActive);
|
||||
pressedStyle.Add(frameStyle);
|
||||
}
|
||||
enabledStyle.Add(pressedStyle);
|
||||
}
|
||||
|
||||
// 危险按钮状态
|
||||
var dangerStyle = new Style(selector => selector.Nesting().PropertyEquals(Button.IsDangerProperty, true));
|
||||
dangerStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorError);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorError);
|
||||
dangerStyle.Add(frameStyle);
|
||||
}
|
||||
|
||||
// 危险状态 hover
|
||||
{
|
||||
var hoverStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.PointerOver));
|
||||
hoverStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorErrorHover);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorErrorHover);
|
||||
hoverStyle.Add(frameStyle);
|
||||
}
|
||||
dangerStyle.Add(hoverStyle);
|
||||
}
|
||||
|
||||
@@ -56,7 +78,11 @@ internal abstract class BasePrimaryButtonTheme : BaseButtonTheme
|
||||
{
|
||||
var pressedStyle = new Style(selector =>
|
||||
selector.Nesting().Class(StdPseudoClass.PointerOver).Class(StdPseudoClass.Pressed));
|
||||
pressedStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorErrorActive);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorErrorActive);
|
||||
pressedStyle.Add(frameStyle);
|
||||
}
|
||||
dangerStyle.Add(pressedStyle);
|
||||
}
|
||||
enabledStyle.Add(dangerStyle);
|
||||
@@ -68,7 +94,11 @@ internal abstract class BasePrimaryButtonTheme : BaseButtonTheme
|
||||
private void BuildEnabledGhostStyle()
|
||||
{
|
||||
var ghostStyle = new Style(selector => selector.Nesting().PropertyEquals(Button.IsGhostProperty, true));
|
||||
ghostStyle.Add(TemplatedControl.BackgroundProperty, Brushes.Transparent);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, Brushes.Transparent);
|
||||
ghostStyle.Add(frameStyle);
|
||||
}
|
||||
// 正常状态
|
||||
ghostStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorPrimary);
|
||||
ghostStyle.Add(TemplatedControl.BorderBrushProperty, SharedTokenKey.ColorPrimary);
|
||||
@@ -121,7 +151,11 @@ internal abstract class BasePrimaryButtonTheme : BaseButtonTheme
|
||||
var disabledStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.Disabled));
|
||||
disabledStyle.Add(TemplatedControl.ForegroundProperty, SharedTokenKey.ColorTextDisabled);
|
||||
disabledStyle.Add(TemplatedControl.BorderBrushProperty, ButtonTokenKey.BorderColorDisabled);
|
||||
disabledStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorBgContainerDisabled);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorBgContainerDisabled);
|
||||
disabledStyle.Add(frameStyle);
|
||||
}
|
||||
Add(disabledStyle);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia.Controls;
|
||||
using Avalonia.Controls.Primitives;
|
||||
using Avalonia.Media;
|
||||
using Avalonia.Styling;
|
||||
|
||||
namespace AtomUI.Controls;
|
||||
@@ -96,20 +98,32 @@ internal class TextButtonTheme : BaseTextButtonTheme
|
||||
{
|
||||
var enabledStyle = new Style(selector => selector.Nesting());
|
||||
// 正常状态
|
||||
enabledStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorTransparent);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, Brushes.Transparent);
|
||||
enabledStyle.Add(frameStyle);
|
||||
}
|
||||
enabledStyle.Add(TemplatedControl.ForegroundProperty, ButtonTokenKey.DefaultColor);
|
||||
|
||||
// 正常 hover
|
||||
{
|
||||
var hoverStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.PointerOver));
|
||||
hoverStyle.Add(TemplatedControl.BackgroundProperty, ButtonTokenKey.TextHoverBg);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, ButtonTokenKey.TextHoverBg);
|
||||
hoverStyle.Add(frameStyle);
|
||||
}
|
||||
enabledStyle.Add(hoverStyle);
|
||||
}
|
||||
// 正常按下
|
||||
{
|
||||
var pressedStyle = new Style(selector =>
|
||||
selector.Nesting().Class(StdPseudoClass.PointerOver).Class(StdPseudoClass.Pressed));
|
||||
pressedStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorBgTextActive);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorBgTextActive);
|
||||
pressedStyle.Add(frameStyle);
|
||||
}
|
||||
enabledStyle.Add(pressedStyle);
|
||||
}
|
||||
|
||||
@@ -120,7 +134,11 @@ internal class TextButtonTheme : BaseTextButtonTheme
|
||||
// 危险状态 hover
|
||||
{
|
||||
var hoverStyle = new Style(selector => selector.Nesting().Class(StdPseudoClass.PointerOver));
|
||||
hoverStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorErrorBgHover);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorErrorBgHover);
|
||||
hoverStyle.Add(frameStyle);
|
||||
}
|
||||
dangerStyle.Add(hoverStyle);
|
||||
}
|
||||
|
||||
@@ -128,7 +146,11 @@ internal class TextButtonTheme : BaseTextButtonTheme
|
||||
{
|
||||
var pressedStyle = new Style(selector =>
|
||||
selector.Nesting().Class(StdPseudoClass.PointerOver).Class(StdPseudoClass.Pressed));
|
||||
pressedStyle.Add(TemplatedControl.BackgroundProperty, SharedTokenKey.ColorErrorBgActive);
|
||||
{
|
||||
var frameStyle = new Style(selector => selector.Nesting().Template().Name(FramePart));
|
||||
frameStyle.Add(Border.BackgroundProperty, SharedTokenKey.ColorErrorBgActive);
|
||||
pressedStyle.Add(frameStyle);
|
||||
}
|
||||
dangerStyle.Add(pressedStyle);
|
||||
}
|
||||
enabledStyle.Add(dangerStyle);
|
||||
|
||||
@@ -62,7 +62,6 @@ public class LineEdit : TextBox,
|
||||
protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
|
||||
{
|
||||
base.OnPropertyChanged(change);
|
||||
// TODO 到底是否需要这样,这些控件的管辖区理论上不应该我们控制
|
||||
if (change.Property == LeftAddOnProperty ||
|
||||
change.Property == RightAddOnProperty)
|
||||
{
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
using Avalonia;
|
||||
using Avalonia.Controls.Primitives;
|
||||
|
||||
namespace AtomUI.Controls;
|
||||
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
using AtomUI.Controls.Utils;
|
||||
using AtomUI.Data;
|
||||
using AtomUI.Theme;
|
||||
using AtomUI.Theme.Styling;
|
||||
using Avalonia;
|
||||
|
||||
Reference in New Issue
Block a user