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

feat: Badge inherits HeaderedContentControl.

Browse Source
This commit is contained in:
Zhang Dian
2023-08-04 22:55:09 +08:00
parent 2c71f3a0a3
commit e4ff70ad14
3 changed files with 58 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
demo/Ursa.Demo/Pages/BadgeDemo.axaml
View File

@@ -27,152 +27,152 @@
<StackPanel Orientation="Horizontal">
<u:Badge
HorizontalAlignment="Center"
BadgeContent="500"
Header="500"
OverflowCount="100">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="SUCCEED!">
<u:Badge Header="SUCCEED!">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="Hello" />
<u:Badge BadgeContent="Hello" Dot="True" />
<u:Badge Header="Hello" />
<u:Badge Header="Hello" Dot="True" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge BadgeContent="5" CornerPosition="TopLeft">
<u:Badge Header="5" CornerPosition="TopLeft">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="5" CornerPosition="TopRight">
<u:Badge Header="5" CornerPosition="TopRight">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="5" CornerPosition="BottomLeft">
<u:Badge Header="5" CornerPosition="BottomLeft">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="5" CornerPosition="BottomRight">
<u:Badge Header="5" CornerPosition="BottomRight">
<Border Width="100" Height="50" />
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
BadgeContent="VIP"
Header="VIP"
CornerPosition="TopLeft"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="VIP"
Header="VIP"
CornerPosition="TopRight"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="VIP"
Header="VIP"
CornerPosition="BottomLeft"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="VIP"
Header="VIP"
CornerPosition="BottomRight"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
</StackPanel>
<u:Badge HorizontalAlignment="Stretch" BadgeContent="VIP">
<u:Badge HorizontalAlignment="Stretch" Header="VIP">
<Border Height="50" />
</u:Badge>
<StackPanel Orientation="Horizontal">
<u:Badge BadgeContent="URSA" Classes="Primary">
<u:Badge Header="URSA" Classes="Primary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Secondary">
<u:Badge Header="URSA" Classes="Secondary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Tertiary">
<u:Badge Header="URSA" Classes="Tertiary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Warning">
<u:Badge Header="URSA" Classes="Warning">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Danger">
<u:Badge Header="URSA" Classes="Danger">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Success">
<u:Badge Header="URSA" Classes="Success">
<Border Width="100" Height="50" />
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge BadgeContent="URSA" Classes="Light Primary">
<u:Badge Header="URSA" Classes="Light Primary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Light Secondary">
<u:Badge Header="URSA" Classes="Light Secondary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Light Tertiary">
<u:Badge Header="URSA" Classes="Light Tertiary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Light Warning">
<u:Badge Header="URSA" Classes="Light Warning">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Light Danger">
<u:Badge Header="URSA" Classes="Light Danger">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Light Success">
<u:Badge Header="URSA" Classes="Light Success">
<Border Width="100" Height="50" />
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge BadgeContent="URSA" Classes="Inverted Primary">
<u:Badge Header="URSA" Classes="Inverted Primary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Inverted Secondary">
<u:Badge Header="URSA" Classes="Inverted Secondary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Inverted Tertiary">
<u:Badge Header="URSA" Classes="Inverted Tertiary">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Inverted Warning">
<u:Badge Header="URSA" Classes="Inverted Warning">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Inverted Danger">
<u:Badge Header="URSA" Classes="Inverted Danger">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge BadgeContent="URSA" Classes="Inverted Success">
<u:Badge Header="URSA" Classes="Inverted Success">
<Border Width="100" Height="50" />
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Primary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Secondary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Tertiary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Warning"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Danger"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Success"
Dot="True">
<Border Width="100" Height="50" />
@@ -180,37 +180,37 @@
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Primary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Secondary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Tertiary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Warning"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Danger"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Light Success"
Dot="True">
<Border Width="100" Height="50" />
@@ -219,37 +219,37 @@
<Border Background="LightGray" CornerRadius="4">
<StackPanel Orientation="Horizontal">
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Primary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Primary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Secondary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Tertiary"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Warning"
Dot="True">
<Border Width="100" Height="50" />
</u:Badge>
<u:Badge
BadgeContent="URSA"
Header="URSA"
Classes="Inverted Danger"
Dot="True">
<Border Width="100" Height="50" />

8
src/Ursa.Themes.Semi/Controls/Badge.axaml
View File

@@ -45,12 +45,12 @@
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"
IsVisible="{Binding !!BadgeContent, RelativeSource={RelativeSource TemplatedParent}}"
IsVisible="{Binding !!Header, RelativeSource={RelativeSource TemplatedParent}}"
RenderTransformOrigin=".5,.5"
Theme="{TemplateBinding BadgeTheme}"
UseLayoutRounding="False">
<ContentPresenter
Name="{x:Static u:Badge.PART_BadgeContentPresenter}"
Name="{x:Static u:Badge.PART_HeaderPresenter}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Focusable="False"
@@ -59,7 +59,7 @@
TextElement.Foreground="{TemplateBinding Foreground}">
<ContentPresenter.Content>
<MultiBinding Converter="{StaticResource BadgeContentConverter}">
<Binding Path="BadgeContent" RelativeSource="{RelativeSource TemplatedParent}" />
<Binding Path="Header" RelativeSource="{RelativeSource TemplatedParent}" />
<Binding Path="OverflowCount" RelativeSource="{RelativeSource TemplatedParent}" />
</MultiBinding>
</ContentPresenter.Content>
@@ -93,7 +93,7 @@
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"
IsVisible="{Binding !!BadgeContent, RelativeSource={RelativeSource TemplatedParent}}"
IsVisible="{Binding !!Header, RelativeSource={RelativeSource TemplatedParent}}"
RenderTransformOrigin=".5,.5" />
</Grid>
</ControlTemplate>

25
src/Ursa/Controls/Badge.cs
View File

@@ -1,7 +1,6 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Controls.Metadata;
using Avalonia.Controls.Presenters;
using Avalonia.Controls.Primitives;
using Avalonia.Interactivity;
using Avalonia.Media;
@@ -10,18 +9,14 @@ using Ursa.Common;
namespace Ursa.Controls;
[TemplatePart(PART_ContentPresenter, typeof(ContentPresenter))]
[TemplatePart(PART_BadgeContainer, typeof(Border))]
[TemplatePart(PART_BadgeContentPresenter, typeof(ContentPresenter))]
public class Badge: ContentControl
public class Badge: HeaderedContentControl
{
public const string PART_ContentPresenter = "PART_ContentPresenter";
public const string PART_BadgeContainer = "PART_BadgeContainer";
public const string PART_BadgeContentPresenter = "PART_BadgeContentPresenter";
private ContentPresenter? _content;
public const string PART_HeaderPresenter = "PART_HeaderPresenter";
private Border? _badgeContainer;
private ContentPresenter? _badgeContent;
public static readonly StyledProperty<ControlTheme> BadgeThemeProperty = AvaloniaProperty.Register<Badge, ControlTheme>(
nameof(BadgeTheme));
@@ -39,14 +34,6 @@ public class Badge: ContentControl
set => SetValue(DotProperty, value);
}
public static readonly StyledProperty<object?> BadgeContentProperty = AvaloniaProperty.Register<Badge, object?>(
nameof(BadgeContent));
public object? BadgeContent
{
get => GetValue(BadgeContentProperty);
set => SetValue(BadgeContentProperty, value);
}
public static readonly StyledProperty<CornerPosition> CornerPositionProperty = AvaloniaProperty.Register<Badge, CornerPosition>(
nameof(CornerPosition));
public CornerPosition CornerPosition
@@ -65,15 +52,13 @@ public class Badge: ContentControl
static Badge()
{
BadgeContentProperty.Changed.AddClassHandler<Badge>((badge, args) => badge.UpdateBadgePosition());
HeaderProperty.Changed.AddClassHandler<Badge>((badge, args) => badge.UpdateBadgePosition());
}
protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
{
base.OnApplyTemplate(e);
_content = e.NameScope.Find<ContentPresenter>(PART_ContentPresenter);
_badgeContainer = e.NameScope.Find<Border>(PART_BadgeContainer);
_badgeContent = e.NameScope.Find<ContentPresenter>(PART_BadgeContentPresenter);
}
protected override void OnLoaded(RoutedEventArgs e)
@@ -92,7 +77,7 @@ public class Badge: ContentControl
{
var vertical = CornerPosition is CornerPosition.BottomLeft or CornerPosition.BottomRight ? 1 : -1;
var horizontal = CornerPosition is CornerPosition.TopRight or CornerPosition.BottomRight ? 1 : -1;
if (_badgeContainer is not null && _content?.Child is not null)
if (_badgeContainer is not null && base.Presenter?.Child is not null)
{
_badgeContainer.RenderTransform = new TransformGroup()
{