chuan/Ursa.Avalonia
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
Files
03b3cc8d3bf03709fda57d5b30c8f208f6e738d7
Ursa.Avalonia/demo/Ursa.Demo/Pages/BadgeDemo.axaml
Zhang Dian cb97373643 feat: more precise selector.
2024-02-26 18:13:08 +08:00

359 lines
14 KiB
XML
Raw Blame History

<UserControl
x:Class="Ursa.Demo.Pages.BadgeDemo"
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:u="https://irihi.tech/ursa"
d:DesignHeight="850"
d:DesignWidth="850"
mc:Ignorable="d">
<ScrollViewer HorizontalScrollBarVisibility="Auto">
<StackPanel
Margin="24"
HorizontalAlignment="Left"
ClipToBounds="False">
<StackPanel.Styles>
<Style Selector="u|Badge">
<Setter Property="Margin" Value="14" />
<Style Selector="^ Border">
<Setter Property="Background" Value="{DynamicResource SemiOrange3}" />
<Setter Property="CornerRadius" Value="8" />
<Style Selector="^ TextBlock">
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Style>
</Style>
</StackPanel.Styles>
<StackPanel Orientation="Horizontal">
<u:Badge
HorizontalAlignment="Center"
Header="500"
OverflowCount="100">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge Header="SUCCEED!">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge Header="Hello" />
<u:Badge Header="Hello" Dot="True" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge Header="5" CornerPosition="TopLeft">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge Header="5" CornerPosition="TopRight">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge Header="5" CornerPosition="BottomLeft">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge Header="5" CornerPosition="BottomRight">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
Header="VIP"
CornerPosition="TopLeft"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge
Header="VIP"
CornerPosition="TopRight"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge
Header="VIP"
CornerPosition="BottomLeft"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<u:Badge
Header="VIP"
CornerPosition="BottomRight"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
</StackPanel>
<u:Badge HorizontalAlignment="Stretch" Header="VIP">
<Border Height="50">
<TextBlock Text="■■■"/>
</Border>
</u:Badge>
<StackPanel Orientation="Horizontal">
<u:Badge Header="URSA" Classes="Primary">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Secondary">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Tertiary">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Success">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Warning">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Danger">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge Header="URSA" Classes="Light Primary">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Light Secondary">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Light Tertiary">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Light Success">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Light Warning">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Light Danger">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge Header="URSA" Classes="Inverted Primary">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Inverted Secondary">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Inverted Tertiary">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Inverted Success">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Inverted Warning">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge Header="URSA" Classes="Inverted Danger">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
Header="URSA"
Classes="Primary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Secondary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Tertiary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Success"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Warning"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Danger"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Solid"/>
</Border>
</u:Badge>
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Badge
Header="URSA"
Classes="Light Primary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Light Secondary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Light Tertiary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Light Success"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Light Warning"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Light Danger"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Light"/>
</Border>
</u:Badge>
</StackPanel>
<Border Background="{DynamicResource SemiGrey2}" CornerRadius="4">
<StackPanel Orientation="Horizontal">
<u:Badge
Header="URSA"
Classes="Inverted Primary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Inverted Secondary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Inverted Tertiary"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Inverted Success"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Inverted Warning"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
<u:Badge
Header="URSA"
Classes="Inverted Danger"
Dot="True">
<Border Width="100" Height="50">
<TextBlock Text="Inverted"/>
</Border>
</u:Badge>
</StackPanel>
</Border>
</StackPanel>
</ScrollViewer>
</UserControl>
Reference in New Issue View Git Blame Copy Permalink