ShrlAlgo/Shrlalgo.RvKits
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新

Browse Source
This commit is contained in:
ShrlAlgo
2025-07-11 09:20:23 +08:00
parent c7b104f44f
commit 4d35cadb56
840 changed files with 102347 additions and 11595 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
AntdWpfDemo/Views/AlertView.xaml Normal file
View File

@@ -0,0 +1,200 @@
<UserControl x:Class="AntdWpfDemo.Views.AlertView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Alert" />
<TextBlock Style="{StaticResource Ant.P}" Text="Alert component for feedback." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="When you need to show alert messages to users.&#x0a;When you need a persistent static container which is closable by user actions." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Alert">
<Setter Property="Margin" Value="0 0 0 15" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic" >
<antd:CodeBox.Description>
The simplest usage for short messages.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<antd:Alert Type="Success" Message="Success Text" />
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;antd:Alert Type="Success" Message="Success Text" /&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Closable">
<antd:CodeBox.Description>
To show close button.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Type="Warning" Closable="True" VerticalContentAlignment="Top">
Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text
</antd:Alert>
<antd:Alert Type="Error" Message="Error Text" Closable="True">
<antd:Alert.Description>
Error Description Error Description Error Description Error Description Error Description Error Description
</antd:Alert.Description>
</antd:Alert>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Type="Warning" Closable="True" VerticalContentAlignment="Top"&gt;\n
\t\tWarning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text\n
\t&lt;/antd:Alert&gt;\n
\t&lt;antd:Alert Type="Error" Message="Error Text" Closable="True"&gt;\n
\t\t&lt;antd:Alert.Description&gt;\n
\t\tError Description Error Description Error Description Error Description Error Description Error Description\n
\t\t&lt;/antd:Alert.Description&gt;\n
\t&lt;/antd:Alert&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Icon">
<antd:CodeBox.Description>
Decent icon make information more clear and more friendly.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Type="Success" Message="Success Tips" ShowIcon="True" />
<antd:Alert Message="Informational Notes" ShowIcon="True" />
<antd:Alert Type="Warning" Message="Warning" ShowIcon="True" />
<antd:Alert Type="Error" Message="Error" ShowIcon="True" />
<antd:Alert Type="Success" Message="Success Tips" Description="Detailed description and advices about successful copywriting." ShowIcon="True" />
<antd:Alert Message="Informational Notes" Description="Additional description and informations about copywriting." ShowIcon="True" />
<antd:Alert Type="Warning" Message="Warning" Description="This is a warning notice about copywriting." ShowIcon="True" />
<antd:Alert Type="Error" Message="Error" Description="This is an error message about copywriting." ShowIcon="True" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Type="Success" Message="Success Tips" ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Message="Informational Notes" ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Type="Warning" Message="Warning" ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Type="Error" Message="Error" ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Type="Success" Message="Success Tips" Description="Detailed description and advices about successful copywriting." ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Message="Informational Notes" Description="Additional description and informations about copywriting." ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Type="Warning" Message="Warning" Description="This is a warning notice about copywriting." ShowIcon="True" /&gt;\n
\t&lt;antd:Alert Type="Error" Message="Error" Description="This is an error message about copywriting." ShowIcon="True" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="More types">
<antd:CodeBox.Description>
There are 4 types of Alert: `Success`, `Info`, `Warning`, `Error`.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Type="Success" Message="Success Text" />
<antd:Alert Message="Info Text" />
<antd:Alert Type="Warning" Message="Warning Text" />
<antd:Alert Type="Error" Message="Error Text" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Type="Success" Message="Success Text" /&gt;\n
\t&lt;antd:Alert Message="Info Text" /&gt;\n
\t&lt;antd:Alert Type="Warning" Message="Warning Text" /&gt;\n
\t&lt;antd:Alert Type="Error" Message="Error Text" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Description">
<antd:CodeBox.Description>
Additional description for alert message.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Type="Success" Message="Success Text" Description="Success Description Success Description Success Description" />
<antd:Alert Message="Info Text" Description="Info Description Info Description Info Description Info Description" />
<antd:Alert Type="Warning" Message="Warning Text" Description="Warning Description Warning Description Warning Description Warning Description" />
<antd:Alert Type="Error" Message="Error Text" Description="Error Description Error Description Error Description Error Description" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Type="Success" Message="Success Text" Margin="0 0 0 16" /&gt;\n
\t&lt;antd:Alert Message="Info Text" Margin="0 0 0 16" /&gt;\n
\t&lt;antd:Alert Type="Warning" Message="Warning Text" Margin="0 0 0 16" /&gt;\n
\t&lt;antd:Alert Type="Error" Message="Error Text" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Customized Close Text">
<antd:CodeBox.Description>
Replace the default icon with customized text.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Message="Info Text" CloseText="Close Now" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Message="Info Text" CloseText="Close Now" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Smoothly Unmount">
<antd:CodeBox.Description>
Smoothly and unaffectedly unmount Alert.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<antd:Alert Message="Alert Message Text" Closable="True" />
<TextBlock Text="placeholder text here" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;antd:Alert Message="Alert Message Text" Closable="True" /&gt;\n
\t&lt;TextBlock Text="placeholder text here" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

16
AntdWpfDemo/Views/AlertView.xaml.cs Normal file
View File

@@ -0,0 +1,16 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace AntdWpfDemo.Views
{
public partial class AlertView
{
public AlertView()
{
InitializeComponent();
}
}
}

157
AntdWpfDemo/Views/AvatarView.xaml Normal file
View File

@@ -0,0 +1,157 @@
<UserControl x:Class="AntdWpfDemo.Views.AvatarView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Avatar" />
<TextBlock Style="{StaticResource Ant.P}" Text="Avatars can be used to represent people or objects. It supports images, Icons, or letters." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Avatar">
<Setter Property="Margin" Value="0 16 16 0" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
Three sizes and two shapes are available.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Avatar Size="64" Icon="user" />
<antd:Avatar Size="Large" Icon="user" />
<antd:Avatar Icon="user" />
<antd:Avatar Size="Small" Icon="user" />
</WrapPanel>
<WrapPanel>
<antd:Avatar Shape="Square" Size="64" Icon="user" />
<antd:Avatar Shape="Square" Size="Large" Icon="user" />
<antd:Avatar Shape="Square" Icon="user" />
<antd:Avatar Shape="Square" Size="Small" Icon="user" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Avatar Size="64" Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Size="Large" Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Size="Small" Icon="user" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Size="64" Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Size="Large" Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Icon="user" /&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Size="Small" Icon="user" /&gt;\n
\t&lt;/WrapPanel&gt;
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Autoset Font Size">
<antd:CodeBox.Description>
For letter type Avatar, when the letters are too long to display, the font size can be automatically adjusted according to the width of the Avatar.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Avatar Background="{Binding Background}" Margin="0 0 16 0" Text="{Binding Text}" />
<antd:Button x:Name="Change" Size="Small" Content="Change" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Avatar Background="{Binding Background}" Margin="0 0 16 0" Text="{Binding Text}" /&gt;\n
\t&lt;antd:Button x:Name="Change" Size="Small" Content="Change" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Type">
<antd:CodeBox.Description>
Image, Icon and letter are supported, and the latter two kinds avatar can have custom colors and background colors.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Avatar Icon="user" />
<antd:Avatar Text="U" />
<antd:Avatar>USER</antd:Avatar>
<antd:Avatar Source="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
<antd:Avatar Text="U" Background="#FDE3CF" Foreground="#F56A00" />
<antd:Avatar Icon="user" Background="#87D068" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Avatar Icon="user" /&gt;\n
\t&lt;antd:Avatar Text="U" /&gt;\n
\t&lt;antd:Avatar&gt;USER&lt;/antd:Avatar&gt;\n
\t&lt;antd:Avatar Source="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" /&gt;\n
\t&lt;antd:Avatar Text="U" Background="#FDE3CF" Foreground="#F56A00" /&gt;\n
\t&lt;antd:Avatar Icon="user" Background="#87D068" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="With Badge">
<antd:CodeBox.Description>
Usually used for messages remind.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Count="1" Margin="0 0 24 0">
<antd:Avatar Shape="Square" Icon="user" Margin="0" />
</antd:Badge>
<antd:Badge Dot="True">
<antd:Avatar Shape="Square" Icon="user" Margin="0" />
</antd:Badge>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Badge Count="1" Margin="0 0 24 0"&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Icon="user" Margin="0" /&gt;\n
\t&lt;/antd:Badge&gt;\n
\t&lt;antd:Badge Dot="True"&gt;\n
\t\t&lt;antd:Avatar Shape="Square" Icon="user" Margin="0" /&gt;\n
\t&lt;/antd:Badge&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

253
AntdWpfDemo/Views/BadgeView.xaml Normal file
View File

@@ -0,0 +1,253 @@
<UserControl x:Class="AntdWpfDemo.Views.BadgeView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Badge" />
<TextBlock Style="{StaticResource Ant.P}" Text="Small numerical value or status descriptor for UI elements." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="Badge normally appears in proximity to notifications or user avatars with eye-catching appeal, typically displaying unread messages count." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style x:Key="Badge" TargetType="antd:Badge">
<Setter Property="Margin" Value="0 20 20 0" />
</Style>
<Style x:Key="HeadExample" TargetType="Rectangle">
<Setter Property="Width" Value="42" />
<Setter Property="Height" Value="42" />
<Setter Property="RadiusX" Value="4" />
<Setter Property="RadiusY" Value="4" />
<Setter Property="Fill" Value="#EEEEEE" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
Simplest Usage. Badge will be hidden when count is 0, but we can use showZero to show it.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Style="{StaticResource Badge}" Count="5">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
<antd:Badge Style="{StaticResource Badge}" Count="0" ShowZero="True">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;Style x:Key="Badge" TargetType="antd:Badge"&gt;\n
\t&lt;Setter Property="Margin" Value="0 20 20 0" /&gt;\n
&lt;/Style&gt;\n
&lt;Style x:Key="HeadExample" TargetType="Rectangle"&gt;\n
\t&lt;Setter Property="Width" Value="42" /&gt;\n
\t&lt;Setter Property="Height" Value="42" /&gt;\n
\t&lt;Setter Property="RadiusX" Value="4" /&gt;\n
\t&lt;Setter Property="RadiusY" Value="4" /&gt;\n
\t&lt;Setter Property="Fill" Value="#EEEEEE" /&gt;\n
&lt;/Style&gt;\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="5"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="0" ShowZero="True"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Overflow Count">
<antd:CodeBox.Description>
`${OverflowCount}+` is displayed when count is larger than `OverflowCount`. The default value of `OverflowCount` is 99.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Style="{StaticResource Badge}" Count="99">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
<antd:Badge Style="{StaticResource Badge}" Count="100">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
<antd:Badge Style="{StaticResource Badge}" Count="99" OverflowCount="10">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
<antd:Badge Style="{StaticResource Badge}" Count="1000" OverflowCount="999">
<Rectangle Style="{StaticResource HeadExample}" />
</antd:Badge>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;Style x:Key="Badge" TargetType="antd:Badge"&gt;\n
\t&lt;Setter Property="Margin" Value="0 20 20 0" /&gt;\n
&lt;/Style&gt;\n
&lt;Style x:Key="HeadExample" TargetType="Rectangle"&gt;\n
\t&lt;Setter Property="Width" Value="42" /&gt;\n
\t&lt;Setter Property="Height" Value="42" /&gt;\n
\t&lt;Setter Property="RadiusX" Value="4" /&gt;\n
\t&lt;Setter Property="RadiusY" Value="4" /&gt;\n
\t&lt;Setter Property="Fill" Value="#EEEEEE" /&gt;\n
&lt;/Style&gt;\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="99"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="100"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="99" OverflowCount="10"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
\t&lt;antd:Badge Style="{StaticResource Badge}" Count="1000" OverflowCount="999"&gt;\n
\t\t&lt;Rectangle Style="{StaticResource HeadExample}" /&gt;\n
\t&lt;/antd:Badge&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Status">
<antd:CodeBox.Description>
Standalone badge with status.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<StackPanel Orientation="Horizontal" Margin="0 0 0 16">
<antd:Badge Status="Success" />
<antd:Badge Status="Error" />
<antd:Badge Status="Default" />
<antd:Badge Status="Processing" />
<antd:Badge Status="Warning" />
</StackPanel>
<StackPanel>
<antd:Badge Status="Success" Text="Success" />
<antd:Badge Status="Error" Text="Error" />
<antd:Badge Status="Default" Text="Default" />
<antd:Badge Status="Processing" Text="Processing" />
<antd:Badge Status="Warning" Text="Warning" />
</StackPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;StackPanel Orientation="Horizontal" Margin="0 0 0 16"&gt;\n
\t\t&lt;antd:Badge Status="Success" /&gt;\n
\t\t&lt;antd:Badge Status="Error" /&gt;\n
\t\t&lt;antd:Badge Status="Default" /&gt;\n
\t\t&lt;antd:Badge Status="Processing" /&gt;\n
\t\t&lt;antd:Badge Status="Warning" /&gt;\n
\t&lt;/StackPanel&gt;\n
\t&lt;StackPanel&gt;\n
\t\t&lt;antd:Badge Status="Success" Text="Success" /&gt;\n
\t\t&lt;antd:Badge Status="Error" Text="Error" /&gt;\n
\t\t&lt;antd:Badge Status="Default" Text="Default" /&gt;\n
\t\t&lt;antd:Badge Status="Processing" Text="Processing" /&gt;\n
\t\t&lt;antd:Badge Status="Warning" Text="Warning" /&gt;\n
\t&lt;/StackPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Standalone">
<antd:CodeBox.Description>
Used in standalone when children is empty.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Count="25" />
<antd:Badge Count="4" BadgeBackground="White" BadgeForeground="#999" />
<antd:Badge Count="109" BadgeBackground="#52c41a" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Content="Default" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Danger" Content="Danger" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Red badge">
<antd:CodeBox.Description>
This will simply display a red badge, without a specific count. If count equals 0, it won't display the dot.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Dot="True">
<antd:Icon Type="notification" Foreground="Black" />
</antd:Badge>
<antd:Badge Count="0" Dot="True">
<antd:Icon Type="notification" />
</antd:Badge>
<antd:Badge Dot="True">
<Hyperlink>Link something</Hyperlink>
</antd:Badge>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Content="Default" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Danger" Content="Danger" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="ToolTip">
<antd:CodeBox.Description>
The badge will display `ToolTip` when hovered over, instead of `Count`.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Badge Count="5" ToolTip="Badge ToolTip">
<Rectangle ToolTip="Content ToolTip" Style="{StaticResource HeadExample}" />
</antd:Badge>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Content="Default" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Danger" Content="Danger" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

219
AntdWpfDemo/Views/ButtonView.xaml Normal file
View File

@@ -0,0 +1,219 @@
<UserControl x:Class="AntdWpfDemo.Views.ButtonView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Button" />
<TextBlock Style="{StaticResource Ant.P}" Text="To trigger an operation." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="A button means an operation (or a series of operations). Clicking a button will trigger corresponding business logic." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Button">
<Setter Property="Margin" Value="0 0 8 12" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Type">
<antd:CodeBox.Description>
There are `primary` button, `default` button, `dashed` button and `danger` button in antd.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel Orientation="Horizontal">
<antd:Button Type="Primary" Content="Primary" />
<antd:Button Content="Default" />
<antd:Button Type="Dashed" Content="Dashed" />
<antd:Button Type="Danger" Content="Danger" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Content="Default" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Danger" Content="Danger" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Size">
<antd:CodeBox.Description>
Ant Design supports a default button size as well as a large and small size.\n
If a large or small button is desired, set the `Size` property to either `large` or `small` respectively. Omit the `Size` property for a button with the default size.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel Orientation="Horizontal">
<antd:Button Type="Primary" Content="Primary" />
<antd:Button Content="Default" Size="Large" />
<antd:Button Type="Dashed" Content="Dashed" />
<antd:Button Type="Danger" Content="Danger" />
<antd:Button Type="Primary" Icon="search" Shape="Circle" />
<antd:Button Type="Primary" Icon="search" Content="Search" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Content="Default" Size="Large" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Danger" Content="Danger" /&gt;\n
\t&lt;antd:Button Type="Primary" Icon="search" Shape="Circle" /&gt;\n
\t&lt;antd:Button Type="Primary" Icon="search" Content="Search" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Loading">
<antd:CodeBox.Description>
A loading indicator can be added to a button by setting the `Loading` property on the `Button`.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel Orientation="Horizontal">
<antd:Button Type="Primary" Content="Loading" Loading="True" />
<antd:Button Type="Primary" Content="Loading" Loading="True" Size="small" />
<antd:Button x:Name="Click1" Type="Primary" Content="Click Me!" Loading="{Binding Loading1}" />
<antd:Button x:Name="Click2" Type="Primary" Content="Click Me!" Icon="poweroff" Loading="{Binding Loading2}" />
<antd:Button Shape="Circle" Loading="True" />
<antd:Button Type="Primary" Shape="Circle" Loading="True" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Loading" Loading="True" /&gt;\n
\t&lt;antd:Button Type="Primary" Content="Loading" Loading="True" Size="small" /&gt;\n
\t&lt;antd:Button x:Name="Click1" Type="Primary" Content="Click Me!" Loading="{Binding Loading1}" /&gt;\n
\t&lt;antd:Button x:Name="Click2" Type="Primary" Content="Click Me!" Icon="poweroff" Loading="{Binding Loading2}" /&gt;\n
\t&lt;antd:Button Shape="Circle" Loading="True" /&gt;\n
\t&lt;antd:Button Type="Primary" Shape="Circle" Loading="True" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Icon">
<antd:CodeBox.Description>
`Button` components can contain an `Icon`. This is done by setting the `icon` property or placing an `Icon` component within the `Button`\n
If you want specific control over the positioning and placement of the Icon, then that should be done by placing the `Icon` component within the `Button` rather than using the `icon` property.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel Orientation="Horizontal">
<antd:Button Type="Primary" Icon="search" Shape="Circle" />
<antd:Button Type="Primary" Icon="search" Content="Search" />
<antd:Button Icon="search" Shape="Circle" />
<antd:Button Icon="search" Content="Search" />
<antd:Button Type="Dashed" Icon="search" Shape="Circle" />
<antd:Button Type="Dashed" Icon="search" Content="Search" />
<antd:Button Type="Danger" Icon="search" Shape="Circle" />
<antd:Button Type="Danger" Icon="search" Content="Search" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Icon="search" Shape="Circle" /&gt;\n
\t&lt;antd:Button Type="Primary" Icon="search" Content="Search" /&gt;\n
\t&lt;antd:Button Icon="search" Shape="Circle" /&gt;\n
\t&lt;antd:Button Icon="search" Content="Search" /&gt;\n
\t&lt;antd:Button Type="Dashed" Icon="search" Shape="Circle" /&gt;\n
\t&lt;antd:Button Type="Dashed" Icon="search" Content="Search" /&gt;\n
\t&lt;antd:Button Type="Danger" Icon="search" Shape="Circle" /&gt;\n
\t&lt;antd:Button Type="Danger" Icon="search" Content="Search" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Disabled">
<antd:CodeBox.Description>
To mark a button as disabled, set the `IsEnabled` property to `False`
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel Orientation="Horizontal">
<antd:Button Type="Primary" Content="Primary" />
<antd:Button Type="Primary" Content="Primary(disabled)" IsEnabled="False" />
<antd:Button Content="Default" />
<antd:Button Content="Default(disabled)" IsEnabled="False" />
<antd:Button Type="Dashed" Content="Dashed" />
<antd:Button Type="Dashed" Content="Dashed(disabled)" IsEnabled="False" />
<StackPanel Background="#BEC8C8">
<WrapPanel Margin="8 8 8 0">
<antd:Button Content="Ghost" Ghost="True" />
<antd:Button Content="Ghost(disabled)" Ghost="True" IsEnabled="False" />
</WrapPanel>
</StackPanel>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel Orientation="Horizontal"&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary" /&gt;\n
\t&lt;antd:Button Type="Primary" Content="Primary(disabled)" IsEnabled="False" /&gt;\n
\t&lt;antd:Button Content="Default" /&gt;\n
\t&lt;antd:Button Content="Default(disabled)" IsEnabled="False" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed" /&gt;\n
\t&lt;antd:Button Type="Dashed" Content="Dashed(disabled)" IsEnabled="False" /&gt;\n
\t&lt;StackPanel Background="#BEC8C8"&gt;\n
\t\t&lt;WrapPanel Margin="8 8 8 0"&gt;\n
\t\t\t&lt;antd:Button Content="Ghost" Ghost="True" /&gt;\n
\t\t\t&lt;antd:Button Content="Ghost(disabled)" Ghost="True" IsEnabled="False" /&gt;\n
\t\t&lt;/WrapPanel&gt;\n
\t&lt;/StackPanel&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Ghost Button">
<antd:CodeBox.Description>
`Ghost` property will make button's background transparent, it is common used in colored background.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel Background="#BEC8C8">
<WrapPanel Margin="16 26 16 16" Orientation="Horizontal">
<antd:Button Type="Primary" Content="Primary" Ghost="True" />
<antd:Button Content="Default" Ghost="True" />
<antd:Button Type="Dashed" Content="Dashed" Ghost="True" />
<antd:Button Type="Danger" Content="Danger" Ghost="True" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel Background="#BEC8C8"&gt;\n
\t&lt;WrapPanel Margin="16 26 16 16" Orientation="Horizontal"&gt;\n
\t\t&lt;antd:Button Type="Primary" Content="Primary" Ghost="True" /&gt;\n
\t\t&lt;antd:Button Content="Default" Ghost="True" /&gt;\n
\t\t&lt;antd:Button Type="Dashed" Content="Dashed" Ghost="True" /&gt;\n
\t\t&lt;antd:Button Type="Danger" Content="Danger" Ghost="True" /&gt;\n
\t&lt;/WrapPanel&gt;
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

145
AntdWpfDemo/Views/CheckBoxView.xaml Normal file
View File

@@ -0,0 +1,145 @@
<UserControl x:Class="AntdWpfDemo.Views.CheckBoxView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Checkbox" />
<TextBlock Style="{StaticResource Ant.P}" Text="Checkbox component." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}"
TextWrapping="Wrap"
Text="Used for selecting multiple values from several options.&#x0a;If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
Basic usage of checkbox.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<CheckBox Content="Checkbox" />
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;CheckBox Content="Checkbox" /&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Controlled Checkbox">
<antd:CodeBox.Description>
Communicated with other components.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<CheckBox Content="{Binding CheckBox, Mode=OneWay}" IsChecked="{Binding IsChecked}" IsEnabled="{Binding IsEnabled}" />
<StackPanel Grid.Row="1" Orientation="Horizontal" Margin="0 20 0 0">
<antd:Button x:Name="ToggleCheck" Type="Primary" Content="{Binding Check, Mode=OneWay}" Margin="0 0 10 0"/>
<antd:Button x:Name="ToggleEnabled" Type="Primary" Content="{Binding Enabled, Mode=OneWay}" />
</StackPanel>
</Grid>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;Grid&gt;\n
\t&lt;Grid.RowDefinitions&gt;\n
\t\t&lt;RowDefinition /&gt;\n
\t\t&lt;RowDefinition /&gt;\n
\t&lt;/Grid.RowDefinitions&gt;\n
\t&lt;CheckBox Content="{Binding CheckBox, Mode=OneWay}" IsChecked="{Binding IsChecked}" IsEnabled="{Binding IsEnabled}" /&gt;\n
\t&lt;StackPanel Grid.Row="1" Orientation="Horizontal" Margin="0 20 0 0"&gt;\n
\t\t&lt;antd:Button x:Name="ToggleCheck" Type="Primary" Content="{Binding Check, Mode=OneWay}" Margin="0 0 10 0"/&gt;\n
\t\t&lt;antd:Button x:Name="ToggleEnabled" Type="Primary" Content="{Binding Enabled, Mode=OneWay}" /&gt;\n
\t&lt;/StackPanel&gt;\n
&lt;/Grid&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Disabled">
<antd:CodeBox.Description>
Disabled checkbox.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel Orientation="Horizontal">
<CheckBox Content="Checkbox" IsEnabled="False" />
<CheckBox Content="Checkbox" IsEnabled="False" IsChecked="True" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;StackPanel Orientation="Horizontal"&gt;\n
\t&lt;CheckBox Content="Checkbox" IsEnabled="False" /&gt;\n
\t&lt;CheckBox Content="Checkbox" IsEnabled="False" IsChecked="True" /&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Check all">
<antd:CodeBox.Description>
The `indeterminate` state can help you to achieve a 'check all' effect.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Border BorderBrush="#E9E9E9" BorderThickness="0 0 0 1" Padding="0 0 0 2">
<CheckBox x:Name="CheckAll" Content="Check all" />
</Border>
<WrapPanel Grid.Row="1" Orientation="Horizontal" Margin="0 16 0 0">
<CheckBox x:Name="Apple" Content="Apple" />
<CheckBox x:Name="Pear" Content="Pear" />
<CheckBox x:Name="Orange" Content="Orange" />
</WrapPanel>
</Grid>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;Grid&gt;\n
\t&lt;Grid.RowDefinitions&gt;\n
\t\t&lt;RowDefinition /&gt;\n
\t\t&lt;RowDefinition /&gt;\n
\t&lt;/Grid.RowDefinitions&gt;\n
\t&lt;Border BorderBrush="#E9E9E9" BorderThickness="0 0 0 1" Padding="0 0 0 2"&gt;\n
\t\t&lt;CheckBox x:Name="CheckAll" Content="Check all" /&gt;\n
\t&lt;/Border&gt;\n
\t&lt;WrapPanel Grid.Row="1" Orientation="Horizontal" Margin="0 16 0 0"&gt;\n
\t\t&lt;CheckBox x:Name="Apple" Content="Apple" /&gt;\n
\t\t&lt;CheckBox x:Name="Pear" Content="Pear" /&gt;\n
\t\t&lt;CheckBox x:Name="Orange" Content="Orange" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/Grid&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

154
AntdWpfDemo/Views/IconView.xaml Normal file
View File

@@ -0,0 +1,154 @@
<UserControl x:Class="AntdWpfDemo.Views.IconView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Icon" />
<TextBlock Style="{StaticResource Ant.P}" Text="Semantic vector graphics." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Icon">
<Setter Property="FontSize" Value="24" />
<Setter Property="Margin" Value="0 0 8 0" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
Use tag `&lt;antd:Icon /&gt;` to create an icon and set its type in the `Type` property. Specific the `Spin` property to show spinning animation and the `Theme` property to switch different themes.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Icon Type="check-circle" />
<antd:Icon Type="check-circle" Theme="Filled" />
<antd:Icon Type="loading" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
&lt;antd:Icon Type="check-circle" /&gt;\n
&lt;antd:Icon Type="check-circle" Theme="Filled" /&gt;\n
&lt;antd:Icon Type="loading" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Custom Icon">
<antd:CodeBox.Description>
Use resources to define a reusable custom icon。Naming the resource `x:Key` must follow the ant icon naming convention.\n\n
We provide semantic name for every icon, and naming rules are as follows:\n
Scanning line icon has the similar name with its solid one，but it's distinguished by `.fill`, for example, `anticon.question-circle` (an empty circle) and `anticon.question-circle.fill` (a full circle);\n
Naming sequence：`[anticon].[[name]-[shape?]].[fill|colorful?]`\n
Icon Type: `[[name]-[shape?]]`\n
`?` means is optional.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<WrapPanel.Resources>
<StreamGeometry x:Key="anticon.heart">M 923 283.6 c -13.4 -31.1 -32.6 -58.9 -56.9 -82.8 c -24.3 -23.8 -52.5 -42.4 -84 -55.5 c -32.5 -13.5 -66.9 -20.3 -102.4 -20.3 c -49.3 0 -97.4 13.5 -139.2 39 c -10 6.1 -19.5 12.8 -28.5 20.1 c -9 -7.3 -18.5 -14 -28.5 -20.1 c -41.8 -25.5 -89.9 -39 -139.2 -39 c -35.5 0 -69.9 6.8 -102.4 20.3 c -31.4 13 -59.7 31.7 -84 55.5 c -24.4 23.9 -43.5 51.7 -56.9 82.8 c -13.9 32.3 -21 66.6 -21 101.9 c 0 33.3 6.8 68 20.3 103.3 c 11.3 29.5 27.5 60.1 48.2 91 c 32.8 48.9 77.9 99.9 133.9 151.6 c 92.8 85.7 184.7 144.9 188.6 147.3 l 23.7 15.2 c 10.5 6.7 24 6.7 34.5 0 l 23.7 -15.2 c 3.9 -2.5 95.7 -61.6 188.6 -147.3 c 56 -51.7 101.1 -102.7 133.9 -151.6 c 20.7 -30.9 37 -61.5 48.2 -91 c 13.5 -35.3 20.3 -70 20.3 -103.3 c 0.1 -35.3 -7 -69.6 -20.9 -101.9 Z</StreamGeometry>
<!-- Colorful -->
<GeometryGroup x:Key="anticon.panda">
<PathGeometry antd:Icon.Fill="#6b676e" Figures="M 99.096 315.634 s -82.58 -64.032 -82.58 -132.13 c 0 -66.064 33.032 -165.162 148.646 -148.646 c 83.37 11.91 99.096 165.162 99.096 165.162 l -165.162 115.614 Z M 924.906 315.634 s 82.58 -64.032 82.58 -132.13 c 0 -66.064 -33.032 -165.162 -148.646 -148.646 c -83.37 11.91 -99.096 165.162 -99.096 165.162 l 165.162 115.614 Z" />
<PathGeometry antd:Icon.Fill="#ffebd2" Figures="M 1024 561.548 c 0 264.526 -229.23 429.42 -512.002 429.42 S 0 826.076 0 561.548 S 283.96 66.064 512.002 66.064 S 1024 297.022 1024 561.548 Z" />
<PathGeometry antd:Icon.Fill="#e9d7c3" Figures="M 330.324 842.126 c 0 82.096 81.34 148.646 181.678 148.646 s 181.678 -66.55 181.678 -148.646 H 330.324 Z" />
<PathGeometry antd:Icon.Fill="#ffffff" Figures="M 644.13 611.098 C 594.582 528.516 561.55 512 512.002 512 c -49.548 0 -82.58 16.516 -132.13 99.096 c -42.488 70.814 -78.73 211.264 -49.548 247.742 c 66.064 82.58 165.162 33.032 181.678 33.032 c 16.516 0 115.614 49.548 181.678 -33.032 c 29.18 -36.476 -7.064 -176.93 -49.55 -247.74 Z" />
<PathGeometry antd:Icon.Fill="#6b676e" Figures="M 611.098 495.484 c 0 -45.608 36.974 -82.58 82.58 -82.58 c 49.548 0 198.194 99.098 198.194 165.162 s -79.934 144.904 -148.646 99.096 c -49.548 -33.032 -132.128 -148.646 -132.128 -181.678 Z M 412.904 495.484 c 0 -45.608 -36.974 -82.58 -82.58 -82.58 c -49.548 0 -198.194 99.098 -198.194 165.162 s 79.934 144.904 148.646 99.096 c 49.548 -33.032 132.128 -148.646 132.128 -181.678 Z" />
<PathGeometry antd:Icon.Fill="#464655" Figures="M 512.002 726.622 c -30.06 0 -115.614 5.668 -115.614 33.032 c 0 49.638 105.484 85.24 115.614 82.58 c 10.128 2.66 115.614 -32.944 115.614 -82.58 c -0.002 -27.366 -85.556 -33.032 -115.614 -33.032 Z" />
<PathGeometry antd:Icon.Fill="#464655" Figures="M 330.324 495.484 m -33.032 0 a 33.032 33.032 0 1 0 66.064 0 a 33.032 33.032 0 1 0 -66.064 0 Z" />
<PathGeometry antd:Icon.Fill="#464655" Figures="M 693.678 495.484 m -33.032 0 a 33.032 33.032 0 1 0 66.064 0 a 33.032 33.032 0 1 0 -66.064 0 Z" />
</GeometryGroup>
</WrapPanel.Resources>
<antd:Icon Type="heart" FontSize="14" VerticalAlignment="Center" Foreground="HotPink" />
<antd:Icon Type="panda" FontSize="32" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;WrapPanel.Resources&gt;\n
\t\t&lt;StreamGeometry x:Key="anticon.heart"&gt;M 923 283.6 c -13.4 -31.1 -32.6 -58.9 -56.9 -82.8 c -24.3 -23.8 -52.5 -42.4 -84 -55.5 c -32.5 -13.5 -66.9 -20.3 -102.4 -20.3 c -49.3 0 -97.4 13.5 -139.2 39 c -10 6.1 -19.5 12.8 -28.5 20.1 c -9 -7.3 -18.5 -14 -28.5 -20.1 c -41.8 -25.5 -89.9 -39 -139.2 -39 c -35.5 0 -69.9 6.8 -102.4 20.3 c -31.4 13 -59.7 31.7 -84 55.5 c -24.4 23.9 -43.5 51.7 -56.9 82.8 c -13.9 32.3 -21 66.6 -21 101.9 c 0 33.3 6.8 68 20.3 103.3 c 11.3 29.5 27.5 60.1 48.2 91 c 32.8 48.9 77.9 99.9 133.9 151.6 c 92.8 85.7 184.7 144.9 188.6 147.3 l 23.7 15.2 c 10.5 6.7 24 6.7 34.5 0 l 23.7 -15.2 c 3.9 -2.5 95.7 -61.6 188.6 -147.3 c 56 -51.7 101.1 -102.7 133.9 -151.6 c 20.7 -30.9 37 -61.5 48.2 -91 c 13.5 -35.3 20.3 -70 20.3 -103.3 c 0.1 -35.3 -7 -69.6 -20.9 -101.9 Z&lt;/StreamGeometry&gt;\n
\t\t&lt;!-- Colorful --&gt;\n
\t\t&lt;GeometryGroup x:Key="anticon.panda"&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#6b676e" Figures="M 99.096 315.634 s -82.58 -64.032 -82.58 -132.13 c 0 -66.064 33.032 -165.162 148.646 -148.646 c 83.37 11.91 99.096 165.162 99.096 165.162 l -165.162 115.614 Z M 924.906 315.634 s 82.58 -64.032 82.58 -132.13 c 0 -66.064 -33.032 -165.162 -148.646 -148.646 c -83.37 11.91 -99.096 165.162 -99.096 165.162 l 165.162 115.614 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#ffebd2" Figures="M 1024 561.548 c 0 264.526 -229.23 429.42 -512.002 429.42 S 0 826.076 0 561.548 S 283.96 66.064 512.002 66.064 S 1024 297.022 1024 561.548 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#e9d7c3" Figures="M 330.324 842.126 c 0 82.096 81.34 148.646 181.678 148.646 s 181.678 -66.55 181.678 -148.646 H 330.324 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#ffffff" Figures="M 644.13 611.098 C 594.582 528.516 561.55 512 512.002 512 c -49.548 0 -82.58 16.516 -132.13 99.096 c -42.488 70.814 -78.73 211.264 -49.548 247.742 c 66.064 82.58 165.162 33.032 181.678 33.032 c 16.516 0 115.614 49.548 181.678 -33.032 c 29.18 -36.476 -7.064 -176.93 -49.55 -247.74 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#6b676e" Figures="M 611.098 495.484 c 0 -45.608 36.974 -82.58 82.58 -82.58 c 49.548 0 198.194 99.098 198.194 165.162 s -79.934 144.904 -148.646 99.096 c -49.548 -33.032 -132.128 -148.646 -132.128 -181.678 Z M 412.904 495.484 c 0 -45.608 -36.974 -82.58 -82.58 -82.58 c -49.548 0 -198.194 99.098 -198.194 165.162 s 79.934 144.904 148.646 99.096 c 49.548 -33.032 132.128 -148.646 132.128 -181.678 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#464655" Figures="M 512.002 726.622 c -30.06 0 -115.614 5.668 -115.614 33.032 c 0 49.638 105.484 85.24 115.614 82.58 c 10.128 2.66 115.614 -32.944 115.614 -82.58 c -0.002 -27.366 -85.556 -33.032 -115.614 -33.032 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#464655" Figures="M 330.324 495.484 m -33.032 0 a 33.032 33.032 0 1 0 66.064 0 a 33.032 33.032 0 1 0 -66.064 0 Z" /&gt;\n
\t\t\t&lt;PathGeometry antd:Icon.Fill="#464655" Figures="M 693.678 495.484 m -33.032 0 a 33.032 33.032 0 1 0 66.064 0 a 33.032 33.032 0 1 0 -66.064 0 Z" /&gt;\n
\t\t&lt;/GeometryGroup&gt;\n
\t&lt;/WrapPanel.Resources&gt;\n
\t&lt;antd:Icon Type="heart" FontSize="14" VerticalAlignment="Center" Foreground="HotPink" /&gt;\n
\t&lt;antd:Icon Type="panda" FontSize="32" Theme="Colorful" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Colourful icon">
<antd:CodeBox.Description>
Specific them property `Theme` to `Colorful` to render colourful icons.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<WrapPanel.Resources>
<GeometryGroup x:Key="anticon.smile.colorful">
<PathGeometry Figures="M 512 64 C 264.6 64 64 264.6 64 512 s 200.6 448 448 448 s 448 -200.6 448 -448 S 759.4 64 512 64 Z m 0 820 c -205.4 0 -372 -166.6 -372 -372 s 166.6 -372 372 -372 s 372 166.6 372 372 s -166.6 372 -372 372 ZM 288 421 a 48 48 0 1 0 96 0 a 48 48 0 1 0 -96 0 Z M 664 533 h -48.1 c -4.2 0 -7.8 3.2 -8.1 7.4 c -3.7 49.5 -45.3 88.6 -95.8 88.6 s -92 -39.1 -95.8 -88.6 c -0.3 -4.2 -3.9 -7.4 -8.1 -7.4 H 360 a 8 8 0 0 0 -8 8.4 c 4.4 84.3 74.5 151.6 160 151.6 s 155.6 -67.3 160 -151.6 a 8 8 0 0 0 -8 -8.4 Z M 640 421 a 48 48 0 1 0 96 0 a 48 48 0 1 0 -96 0 Z" />
<PathGeometry Figures="M 512 140 c -205.4 0 -372 166.6 -372 372 s 166.6 372 372 372 s 372 -166.6 372 -372 s -166.6 -372 -372 -372 Z M 288 421 a 48.01 48.01 0 0 1 96 0 a 48.01 48.01 0 0 1 -96 0 Z m 224 272 c -85.5 0 -155.6 -67.3 -160 -151.6 a 8 8 0 0 1 8 -8.4 h 48.1 c 4.2 0 7.8 3.2 8.1 7.4 C 420 589.9 461.5 629 512 629 s 92.1 -39.1 95.8 -88.6 c 0.3 -4.2 3.9 -7.4 8.1 -7.4 H 664 a 8 8 0 0 1 8 8.4 C 667.6 625.7 597.5 693 512 693 Z m 176 -224 a 48.01 48.01 0 0 1 0 -96 a 48.01 48.01 0 0 1 0 96 Z" />
</GeometryGroup>
<GeometryGroup x:Key="anticon.heart.colorful">
<PathGeometry Figures="M 923 283.6 a 260.04 260.04 0 0 0 -56.9 -82.8 a 264.4 264.4 0 0 0 -84 -55.5 A 265.34 265.34 0 0 0 679.7 125 c -49.3 0 -97.4 13.5 -139.2 39 c -10 6.1 -19.5 12.8 -28.5 20.1 c -9 -7.3 -18.5 -14 -28.5 -20.1 c -41.8 -25.5 -89.9 -39 -139.2 -39 c -35.5 0 -69.9 6.8 -102.4 20.3 c -31.4 13 -59.7 31.7 -84 55.5 a 258.44 258.44 0 0 0 -56.9 82.8 c -13.9 32.3 -21 66.6 -21 101.9 c 0 33.3 6.8 68 20.3 103.3 c 11.3 29.5 27.5 60.1 48.2 91 c 32.8 48.9 77.9 99.9 133.9 151.6 c 92.8 85.7 184.7 144.9 188.6 147.3 l 23.7 15.2 c 10.5 6.7 24 6.7 34.5 0 l 23.7 -15.2 c 3.9 -2.5 95.7 -61.6 188.6 -147.3 c 56 -51.7 101.1 -102.7 133.9 -151.6 c 20.7 -30.9 37 -61.5 48.2 -91 c 13.5 -35.3 20.3 -70 20.3 -103.3 c 0.1 -35.3 -7 -69.6 -20.9 -101.9 Z M 512 814.8 S 156 586.7 156 385.5 C 156 283.6 240.3 201 344.3 201 c 73.1 0 136.5 40.8 167.7 100.4 C 543.2 241.8 606.6 201 679.7 201 c 104 0 188.3 82.6 188.3 184.5 c 0 201.2 -356 429.3 -356 429.3 Z" />
<PathGeometry Figures="M 679.7 201 c -73.1 0 -136.5 40.8 -167.7 100.4 C 480.8 241.8 417.4 201 344.3 201 c -104 0 -188.3 82.6 -188.3 184.5 c 0 201.2 356 429.3 356 429.3 s 356 -228.1 356 -429.3 C 868 283.6 783.7 201 679.7 201 Z" />
</GeometryGroup>
</WrapPanel.Resources>
<antd:Icon Type="smile" Theme="Colorful" Foreground="#1890ff" />
<antd:Icon Type="heart" Theme="Colorful" Foreground="#eb2f96" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;WrapPanel.Resources&gt;\n
\t\t&lt;GeometryGroup x:Key="anticon.smile.colorful"&gt;\n
\t\t\t&lt;PathGeometry Figures="M 512 64 C 264.6 64 64 264.6 64 512 s 200.6 448 448 448 s 448 -200.6 448 -448 S 759.4 64 512 64 Z m 0 820 c -205.4 0 -372 -166.6 -372 -372 s 166.6 -372 372 -372 s 372 166.6 372 372 s -166.6 372 -372 372 ZM 288 421 a 48 48 0 1 0 96 0 a 48 48 0 1 0 -96 0 Z M 664 533 h -48.1 c -4.2 0 -7.8 3.2 -8.1 7.4 c -3.7 49.5 -45.3 88.6 -95.8 88.6 s -92 -39.1 -95.8 -88.6 c -0.3 -4.2 -3.9 -7.4 -8.1 -7.4 H 360 a 8 8 0 0 0 -8 8.4 c 4.4 84.3 74.5 151.6 160 151.6 s 155.6 -67.3 160 -151.6 a 8 8 0 0 0 -8 -8.4 Z M 640 421 a 48 48 0 1 0 96 0 a 48 48 0 1 0 -96 0 Z" /&gt;\n
\t\t\t&lt;PathGeometry Figures="M 512 140 c -205.4 0 -372 166.6 -372 372 s 166.6 372 372 372 s 372 -166.6 372 -372 s -166.6 -372 -372 -372 Z M 288 421 a 48.01 48.01 0 0 1 96 0 a 48.01 48.01 0 0 1 -96 0 Z m 224 272 c -85.5 0 -155.6 -67.3 -160 -151.6 a 8 8 0 0 1 8 -8.4 h 48.1 c 4.2 0 7.8 3.2 8.1 7.4 C 420 589.9 461.5 629 512 629 s 92.1 -39.1 95.8 -88.6 c 0.3 -4.2 3.9 -7.4 8.1 -7.4 H 664 a 8 8 0 0 1 8 8.4 C 667.6 625.7 597.5 693 512 693 Z m 176 -224 a 48.01 48.01 0 0 1 0 -96 a 48.01 48.01 0 0 1 0 96 Z" /&gt;\n
\t&lt;/GeometryGroup&gt;\n
\t&lt;GeometryGroup x:Key="anticon.heart.colorful"&gt;\n
\t\t\t&lt;PathGeometry Figures="M 923 283.6 a 260.04 260.04 0 0 0 -56.9 -82.8 a 264.4 264.4 0 0 0 -84 -55.5 A 265.34 265.34 0 0 0 679.7 125 c -49.3 0 -97.4 13.5 -139.2 39 c -10 6.1 -19.5 12.8 -28.5 20.1 c -9 -7.3 -18.5 -14 -28.5 -20.1 c -41.8 -25.5 -89.9 -39 -139.2 -39 c -35.5 0 -69.9 6.8 -102.4 20.3 c -31.4 13 -59.7 31.7 -84 55.5 a 258.44 258.44 0 0 0 -56.9 82.8 c -13.9 32.3 -21 66.6 -21 101.9 c 0 33.3 6.8 68 20.3 103.3 c 11.3 29.5 27.5 60.1 48.2 91 c 32.8 48.9 77.9 99.9 133.9 151.6 c 92.8 85.7 184.7 144.9 188.6 147.3 l 23.7 15.2 c 10.5 6.7 24 6.7 34.5 0 l 23.7 -15.2 c 3.9 -2.5 95.7 -61.6 188.6 -147.3 c 56 -51.7 101.1 -102.7 133.9 -151.6 c 20.7 -30.9 37 -61.5 48.2 -91 c 13.5 -35.3 20.3 -70 20.3 -103.3 c 0.1 -35.3 -7 -69.6 -20.9 -101.9 Z M 512 814.8 S 156 586.7 156 385.5 C 156 283.6 240.3 201 344.3 201 c 73.1 0 136.5 40.8 167.7 100.4 C 543.2 241.8 606.6 201 679.7 201 c 104 0 188.3 82.6 188.3 184.5 c 0 201.2 -356 429.3 -356 429.3 Z" /&gt;\n
\t\t\t&lt;PathGeometry Figures="M 679.7 201 c -73.1 0 -136.5 40.8 -167.7 100.4 C 480.8 241.8 417.4 201 344.3 201 c -104 0 -188.3 82.6 -188.3 184.5 c 0 201.2 356 429.3 356 429.3 s 356 -228.1 356 -429.3 C 868 283.6 783.7 201 679.7 201 Z" /&gt;\n
\t\t&lt;/GeometryGroup&gt;\n
\t&lt;/WrapPanel.Resources&gt;\n
\t&lt;antd:Icon Type="smile" Theme="Colorful" Foreground="#1890ff" /&gt;\n
\t&lt;antd:Icon Type="heart" Theme="Colorful" Foreground="#eb2f96" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

197
AntdWpfDemo/Views/InputView.xaml Normal file
View File

@@ -0,0 +1,197 @@
<UserControl x:Class="AntdWpfDemo.Views.InputView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Input" />
<TextBlock Style="{StaticResource Ant.P}" Text="A basic widget for getting the user input is a text field. Keyboard and mouse can be used for providing or changing data." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="A user input in a form field is needed.&#x0a;A search input is required." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style BasedOn="{StaticResource Ant.TextBox}" TargetType="TextBox">
<Setter Property="Margin" Value="0 16 16 0" />
</Style>
<Style BasedOn="{StaticResource Ant.PasswordBox}" TargetType="PasswordBox">
<Setter Property="Margin" Value="0 16 16 0" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic usage">
<antd:CodeBox.Description>
Basic usage example.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<TextBox antd:Input.Placeholder="Basic usage" />
<PasswordBox antd:Input.Placeholder="Basic usage" antd:Input.Eyeable="True" Password="666" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Pre / Post tab">
<antd:CodeBox.Description>
Using pre &amp; post tabs example.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<antd:Border Grid.Column="0"
UseLayoutRounding="True"
CornerRadius="4 0 0 4"
BorderThickness="1 1 0 1"
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
<TextBlock Text="http://" VerticalAlignment="Center" />
</antd:Border>
<TextBox Grid.Column="1" Text="mysite" Margin="0" antd:Control.CornerRadius="0" />
<antd:Border Grid.Column="2"
UseLayoutRounding="True"
CornerRadius="0 4 4 0"
BorderThickness="0 1 1 1"
BorderBrush="{DynamicResource InputBorderBrush}" Padding="11 0">
<TextBlock Text=".com" VerticalAlignment="Center" />
</antd:Border>
</Grid>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Search box">
<antd:CodeBox.Description>
Example of creating a search box by grouping a standard input with a search button.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<TextBox antd:Input.Placeholder="input search text" antd:Input.Clearable="True">
<antd:Input.Suffix>
<antd:Icon Type="search" />
</antd:Input.Suffix>
</TextBox>
<TextBox antd:Input.Placeholder="input search text" Padding="12 0 0 0">
<antd:Input.Suffix>
<antd:Button Margin="8 -1 -2 -1" Type="Primary" Content="Search" antd:Control.CornerRadius="0 4 4 0" />
</antd:Input.Suffix>
</TextBox>
<TextBox antd:Input.Placeholder="input search text" antd:Control.Size="Large" Padding="12 0 0 0">
<antd:Input.Suffix>
<antd:Button Type="Primary" Size="Large" Margin="8 -1 -2 -1" Content="Search" antd:Control.CornerRadius="0 4 4 0" />
</antd:Input.Suffix>
</TextBox>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Prefix and Suffix">
<antd:CodeBox.Description>
Add prefix or suffix icons inside input.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<TextBox antd:Input.Placeholder="Enter your username">
<antd:Input.Prefix>
<antd:Icon Type="user" Foreground="#3F000000" />
</antd:Input.Prefix>
<antd:Input.Suffix>
<antd:Icon Type="close" Foreground="#3F000000" />
</antd:Input.Suffix>
</TextBox>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;TextBox antd:Input.Placeholder="Enter your username"&gt;\n
\t&lt;antd:Input.Prefix&gt;\n
\t\t&lt;antd:Icon Type="user" Foreground="#3F000000" /&gt;\n
\t&lt;/antd:Input.Prefix&gt;\n
\t&lt;antd:Input.Suffix&gt;\n
\t\t&lt;antd:Icon Type="close" Foreground="#3F000000" /&gt;\n
\t&lt;/antd:Input.Suffix&gt;\n
&lt;/TextBox&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Three sizes of Input">
<antd:CodeBox.Description>
There are three sizes of an Input box: `Large` (40px)、`Default` (32px) and `Small` (24px).
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<TextBox antd:Input.Placeholder="large size" antd:Control.Size="Large" />
<TextBox antd:Input.Placeholder="default size" />
<TextBox antd:Input.Placeholder="small size" antd:Control.Size="Small" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

60
AntdWpfDemo/Views/ProgressView.xaml Normal file
View File

@@ -0,0 +1,60 @@
<UserControl x:Class="AntdWpfDemo.Views.ProgressView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Progress" />
<TextBlock Style="{StaticResource Ant.P}" Text="A simple text popup tip." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="The tip is shown on mouse enter, and is hidden on mouse leave. The Tooltip doesn't support complex text or operations.&#x0a;To provide an explanation of a button/text/operation. It's often used instead of the html title attribute." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Button">
<Setter Property="Margin" Value="8 0 0 8" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Arrow pointing at the center">
<antd:CodeBox.Description>
进度条
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel Height="150">
<Slider x:Name="Slider" Margin="0,0,0,10" Maximum="100" Minimum="0"/>
<ProgressBar Value="{Binding ElementName=Slider,Path=Value}" Margin="0,0,0,10"/>
<ProgressBar IsIndeterminate="True" Margin="0,0,0,10"/>
<ProgressBar MaxWidth="80" Value="{Binding ElementName=Slider,Path=Value}" Style="{StaticResource Ant.CircularProgressBar}"/>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ProgressBar Value="30" Margin="0,0,0,10"/&gt;\n\n
&lt;ProgressBar IsIndeterminate="True" Margin="0,0,0,10"/&gt;\n\n
&lt;ProgressBar MaxWidth="100" Value="50" Style="{StaticResource Ant.CircularProgressBar}"/&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

105
AntdWpfDemo/Views/RadioButtonView.xaml Normal file
View File

@@ -0,0 +1,105 @@
<UserControl x:Class="AntdWpfDemo.Views.RadioButtonView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Radio" />
<TextBlock Style="{StaticResource Ant.P}" Text="Radio." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}"
TextWrapping="Wrap"
Text="Used to select a single state in multiple options.&#x0a;The difference between Select is that Radio is visible to user and can facilitate the comparison of choice, which makes there shouldn't be too many of them." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
The simplest use.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<RadioButton Content="Radio" />
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;RadioButton Content="Radio" /&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Radio Group">
<antd:CodeBox.Description>
A group of radio components.
</antd:CodeBox.Description>
<!--<antd:CodeBox.Content>
<antd:RadioButtonGroup Orientation="Vertical">
<RadioButton Content="A" />
<RadioButton Content="B" GroupName="A" />
<RadioButton Content="C" GroupName="A" />
<RadioButton Content="D" />
</antd:RadioButtonGroup>
</antd:CodeBox.Content>-->
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;RadioButton Content="Radio" /&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="RadioGroup group - ItemsSource">
<antd:CodeBox.Description>
Render radios by configuring `ItemsSource`.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<antd:RadioButtonGroup ItemsSource="{Binding Items}" DisplayMemberPath="Label" Orientation="Vertical" />
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;RadioButton Content="Radio" /&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Disabled">
<antd:CodeBox.Description>
Radio unavailable.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<RadioButton Content="Radio" IsEnabled="{Binding IsEnabled}" Margin="0 0 0 8" />
<RadioButton Content="Radio" IsEnabled="{Binding IsEnabled}" IsChecked="True" />
<antd:Button x:Name="Toggle" Type="Primary" Content="Toggle disabled" Margin="0 20 0 0" />
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Styles/antd.xaml" /&gt;\n\n
&lt;StackPanel&gt;\n
\t&lt;RadioButton Content="Radio" IsEnabled="{Binding IsEnabled}" Margin="0 0 0 8" /&gt;\n
\t&lt;RadioButton Content="Radio" IsEnabled="{Binding IsEnabled}" IsChecked="True" /&gt;\n
\t&lt;antd:Button x:Name="Toggle" Type="Primary" Content="Toggle disabled" Margin="0 20 0 0" /&gt;\n
&lt;/StackPanel&gt;\n
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

77
AntdWpfDemo/Views/SelectView.xaml Normal file
View File

@@ -0,0 +1,77 @@
<UserControl x:Class="AntdWpfDemo.Views.SelectView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Select" />
<TextBlock Style="{StaticResource Ant.P}" Text="Select component to select value from options." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="A dropdown menu for displaying choices - an elegant alternative to the native select element.&#x0a;Utilizing Radio is recommended when there are fewer total options (less than 5)." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style BasedOn="{StaticResource Ant.ComboBox}" TargetType="ComboBox">
<Setter Property="Margin" Value="0 0 8 10" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic usage">
<antd:CodeBox.Description>
Basic usage example.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<ComboBox antd:Input.Placeholder="Basic usage">
<ComboBoxItem>Jack</ComboBoxItem>
<ComboBoxItem>Luck</ComboBoxItem>
<ComboBoxItem IsEnabled="False">Disabled</ComboBoxItem>
<ComboBoxItem>yiminghe</ComboBoxItem>
</ComboBox>
<ComboBox antd:Input.Placeholder="Basic usage" IsEnabled="False">
<ComboBoxItem>Jack</ComboBoxItem>
<ComboBoxItem IsSelected="True">Luck</ComboBoxItem>
<ComboBoxItem IsEnabled="False">Disabled</ComboBoxItem>
<ComboBoxItem>yiminghe</ComboBoxItem>
</ComboBox>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

40
AntdWpfDemo/Views/ShellView.xaml Normal file
View File

@@ -0,0 +1,40 @@
<antd:Window x:Class="AntdWpfDemo.Views.ShellView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="using:AntdWpfDemo.Views"
xmlns:views="clr-namespace:AntdWpfDemo.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Width="930"
Height="600"
mc:Ignorable="d">
<!--<antd:Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" />
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</antd:Window.Resources>-->
<TabControl x:Name="Items" TabStripPlacement="Top" >
<!--<TabItem Header="Tab1" >
<StackPanel >
<views:AlertView/>
</StackPanel>
</TabItem>
<TabItem Header="Tab2" />
<TabItem Header="Tab3" />-->
</TabControl>
<!--<StackPanel>
--><!--<TabControl TabStripPlacement="Left">
<TabItem Header="Tab1" />
<TabItem Header="Tab2" />
<TabItem Header="Tab3" />
</TabControl>-->
<!--<antd:Alert Type="Success" Description="描述"/>
<antd:Button Content="Button"/>--><!--
</StackPanel>-->
</antd:Window>

156
AntdWpfDemo/Views/SpinView.xaml Normal file
View File

@@ -0,0 +1,156 @@
<UserControl x:Class="AntdWpfDemo.Views.SpinView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Spin" />
<TextBlock Style="{StaticResource Ant.P}" Text="A spinner for displaying loading state of a page or a section." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
A simple loading status.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Spin />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Spin /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Customized description">
<antd:CodeBox.Description>
Customized description content.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Spin Tip="Loading...">
<antd:Alert Message="Alert message title" Description="Further details about the context of this alert." />
</antd:Spin>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Spin Tip="Loading..."&gt;\n
\t\t&lt;antd:Alert Message="Alert message title" Description="Further details about the context of this alert." /&gt;\n
\t&lt;/antd:Spin&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Custom spinning indicator">
<antd:CodeBox.Description>
Use custom loading indicator.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Spin>
<antd:Spin.Indicator>
<antd:Icon Type="loading" FontSize="24" />
</antd:Spin.Indicator>
</antd:Spin>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Spin&gt;\n
\t\t&lt;antd:Spin.Indicator&gt;\n
\t\t\t&lt;antd:Icon Type="loading" FontSize="24" /&gt;\n
\t\t&lt;/antd:Spin.Indicator&gt;\n
\t&lt;/antd:Spin&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Size">
<antd:CodeBox.Description>
A small `Spin` use in loading text, default `Spin` use in loading card-level block, and large `Spin` use in loading page.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Spin Size="Small" Margin="0 0 16 16" />
<antd:Spin Margin="0 0 16 16" />
<antd:Spin Size="Large" Margin="0 0 16 16" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Spin Size="Small" Margin="0 0 16 16" /&gt;\n
\t&lt;antd:Spin Margin="0 0 16 16" /&gt;\n
\t&lt;antd:Spin Size="Large" Margin="0 0 16 16" /&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Embedded mode">
<antd:CodeBox.Description>
Embedding content into `Spin` will alter it into loading state.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Spin Spinning="{Binding IsChecked, Mode=OneWay, ElementName=SwitchOne}">
<antd:Alert Message="Alert message title" Description="Further details about the context of this alert." />
</antd:Spin>
</WrapPanel>
<WrapPanel Margin="0 16 0 0">
<Label Content="Loading state：" />
<antd:Switch x:Name="SwitchOne" IsChecked="True" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Spin Spinning="{Binding IsChecked, Mode=OneWay, ElementName=SwitchOne}"&gt;\n
\t\t\t&lt;antd:Alert Message="Alert message title" Description="Further details about the context of this alert." /&gt;\n
\t\t&lt;/antd:Spin&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 16 0 0"&gt;\n
\t\t&lt;Label Content="Loading state：" /&gt;\n
\t\t&lt;antd:Switch x:Name="SwitchOne" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

201
AntdWpfDemo/Views/SwitchView.xaml Normal file
View File

@@ -0,0 +1,201 @@
<UserControl x:Class="AntdWpfDemo.Views.SwitchView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Switch" />
<TextBlock Style="{StaticResource Ant.P}" Text="Switching Selector." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="If you need to represent the switching between two states or on-off state.&#x0a;The difference between Switch and Checkbox is that Switch will trigger a state change directly when you toggle it, while Checkbox is generally used for state marking, which should work in conjunction with submit operation." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
The most basic usage.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Switch IsChecked="True" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;
&lt;antd:Switch IsChecked="True" /&gt;
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Text &amp; icon">
<antd:CodeBox.Description>
With text and icon.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel Margin="8 8 0 0">
<antd:Switch IsChecked="True" Content="开" UnCheckedContent="关" />
</WrapPanel>
<WrapPanel Margin="8 8 0 0">
<antd:Switch Content="1" UnCheckedContent="0" />
</WrapPanel>
<WrapPanel Margin="8 8 0 8">
<antd:Switch IsChecked="True">
<antd:Switch.Content>
<Path Width="12"
Height="12"
Stretch="Uniform"
Fill="White"
Data="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z" />
</antd:Switch.Content>
<antd:Switch.UnCheckedContent>
<Path Width="9"
Height="9"
Stretch="Uniform"
Fill="White"
Data="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" />
</antd:Switch.UnCheckedContent>
</antd:Switch>
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Switch IsChecked="True" Content="开" UnCheckedContent="关" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 8 0 0"&gt;\n
\t\t&lt;antd:Switch IsChecked="True" Content="1" UnCheckedContent="0" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 8 0 0"&gt;\n
\t\t&lt;antd:Switch IsChecked="True"&gt;\n
\t\t\t&lt;antd:Switch.Content&gt;\n
\t\t\t\t&lt;Path Width="12" \n
\t\t\t\t\tHeight="12" \n
\t\t\t\t\tStretch="Uniform" \n
\t\t\t\t\tFill="White" \n
\t\t\t\t\tData="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z" /&gt;\n
\t\t\t&lt;/antd:Switch.Content&gt;\n
\t\t\t&lt;antd:Switch.UnCheckedContent&gt;\n
\t\t\t\t&lt;Path Width="9" \n
\t\t\t\t\tHeight="9"\n
\t\t\t\t\tStretch="Uniform" \n
\t\t\t\t\tFill="White" \n
\t\t\t\t\tData="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" /&gt;\n
\t\t\t&lt;/antd:Switch.UnCheckedContent&gt;\n
\t\t&lt;/antd:Switch&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Loading">
<antd:CodeBox.Description>
Mark a pending state of switch.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Switch IsChecked="True" Loading="True" />
</WrapPanel>
<WrapPanel Margin="0 8 0 0">
<antd:Switch Size="Small" Loading="True" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Switch IsChecked="True" Loading="True" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 8 0 0"&gt;\n
\t\t&lt;antd:Switch Size="Small" Loading="True" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Disabled">
<antd:CodeBox.Description>
Disabled state of `Switch`.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Switch IsChecked="True" IsEnabled="{Binding IsEnabled}" />
</WrapPanel>
<WrapPanel Margin="0 8 0 0">
<antd:Button x:Name="Toggle" Type="Primary" Content="Toggle disabled" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Switch IsChecked="True" IsEnabled="{Binding IsEnabled}" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 8 0 0"&gt;\n
\t\t&lt;antd:Button x:Name="Toggle" Type="Primary" Content="Toggle disabled" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Two sizes">
<antd:CodeBox.Description>
`Size="Small"` represents a small sized switch.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Switch IsChecked="True" />
</WrapPanel>
<WrapPanel Margin="0 8 0 0">
<antd:Switch Size="Small" IsChecked="True" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Switch IsChecked="True" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel Margin="0 8 0 0"&gt;\n
\t\t&lt;antd:Switch Size="Small" IsChecked="True" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

207
AntdWpfDemo/Views/TagView.xaml Normal file
View File

@@ -0,0 +1,207 @@
<UserControl x:Class="AntdWpfDemo.Views.TagView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:cal="http://www.caliburnproject.org"
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Tag" />
<TextBlock Style="{StaticResource Ant.P}" Text="Tag for categorizing or markup." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="It can be used to tag by dimension or property.&#x0a;When categorizing." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Tag">
<Setter Property="Margin" Value="0 0 8 8" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
Usage of basic Tag, and it could be closable by set `Closable` property. Closable Tag support `Closed` event.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:Tag>Tag 1</antd:Tag>
<antd:Tag>Link</antd:Tag>
<antd:Tag Closable="True">Tag 2</antd:Tag>
<antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]">Prevent Default</antd:Tag>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;antd:Tag&gt;Tag 1&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag&gt;Link&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True"&gt;Tag 2&lt;/antd:Tag&gt;\n
\t&lt;antd:Tag Closable="True" cal:Message.Attach="[Event Closing] = [Action Closing($source, $eventArgs)]"&gt;Prevent Default&lt;/antd:Tag&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Hot Tags">
<antd:CodeBox.Description>
Select your favourite topics.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<TextBlock Text="Categories:" FontSize="10" VerticalAlignment="Center" Margin="0 0 8 0" />
<WrapPanel VerticalAlignment="Center">
<antd:CheckableTag Content="Movies" />
<antd:CheckableTag Content="Books" />
<antd:CheckableTag Content="Music" />
<antd:CheckableTag Content="Sports" />
</WrapPanel>
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;\n
\t&lt;TextBlock Text="Categories:" FontSize="10" VerticalAlignment="Center" Margin="0 0 8 0" /&gt;\n
\t&lt;WrapPanel VerticalAlignment="Center"&gt;\n
\t\t&lt;antd:CheckableTag Content="Movies" /&gt;\n
\t\t&lt;antd:CheckableTag Content="Books" /&gt;\n
\t\t&lt;antd:CheckableTag Content="Music" /&gt;\n
\t\t&lt;antd:CheckableTag Content="Sports" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Colorful Tag">
<antd:CodeBox.Description>
Colorful Tag can be easily implemented by setting the `ColorMode` property.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<Label Style="{StaticResource Ant.H4}" Content="Colorful:" />
<WrapPanel>
<antd:Tag Foreground="#EB2F96" Content="magenta" ColorMode="Colorful" Closable="True" />
<antd:Tag Foreground="#F5222D" Content="red" ColorMode="Colorful" />
<antd:Tag Foreground="#FA541C" Content="volcano" ColorMode="Colorful" />
<antd:Tag Foreground="#FA8C16" Content="orange" ColorMode="Colorful" />
<antd:Tag Foreground="#FAAD14" Content="Gold" ColorMode="Colorful" />
<antd:Tag Foreground="#A0D911" Content="lime" ColorMode="Colorful" />
<antd:Tag Foreground="#52C41A" Content="green" ColorMode="Colorful" />
<antd:Tag Foreground="#13C2C2" Content="cyan" ColorMode="Colorful" />
<antd:Tag Foreground="#1890FF" Content="blue" ColorMode="Colorful" />
<antd:Tag Foreground="#2F54EB" Content="purple" ColorMode="Colorful" />
</WrapPanel>
<Label Style="{StaticResource Ant.H4}" Content="Inverse:" />
<WrapPanel>
<antd:Tag Background="#FF5500" Content="#FF5500" ColorMode="Inverse" Closable="True" />
<antd:Tag Background="#2DB7F5" Content="#2DB7F5" ColorMode="Inverse" />
<antd:Tag Background="#87d068" Content="#87d068" ColorMode="Inverse" />
<antd:Tag Background="#108EE9" Content="#108EE9" ColorMode="Inverse" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;Label Style="{StaticResource Ant.H4}" Content="Colorful:" /&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Tag Foreground="#EB2F96" Content="magenta" ColorMode="Colorful" Closable="True" /&gt;\n
\t\t&lt;antd:Tag Foreground="#F5222D" Content="red" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#FA541C" Content="volcano" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#FA8C16" Content="orange" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#FAAD14" Content="Gold" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#A0D911" Content="lime" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#52C41A" Content="green" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#13C2C2" Content="cyan" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#1890FF" Content="blue" ColorMode="Colorful" /&gt;\n
\t\t&lt;antd:Tag Foreground="#2F54EB" Content="purple" ColorMode="Colorful" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;Label Style="{StaticResource Ant.H4}" Content="Inverse:" /&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Tag Background="#FF5500" Content="#FF5500" ColorMode="Inverse" Closable="True" /&gt;\n
\t\t&lt;antd:Tag Background="#2DB7F5" Content="#2DB7F5" ColorMode="Inverse" /&gt;\n
\t\t&lt;antd:Tag Background="#87d068" Content="#87d068" ColorMode="Inverse" /&gt;\n
\t\t&lt;antd:Tag Background="#108EE9" Content="#108EE9" ColorMode="Inverse" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Checkable">
<antd:CodeBox.Description>
`CheckableTag` works like Checkbox, click it to toggle checked.\n
it is an absolute controlled component and has no uncontrolled mode.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<WrapPanel>
<antd:CheckableTag Content="Tag1" />
<antd:CheckableTag Content="Tag2" />
<antd:CheckableTag Content="Tag3" />
</WrapPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;
&lt;antd:CheckableTag Content="Tag1" /&gt;
&lt;antd:CheckableTag Content="Tag2" /&gt;
&lt;antd:CheckableTag Content="Tag3" /&gt;
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Controlled">
<antd:CodeBox.Description>
By using the `Visibility` property, you can control the close state of Tag.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Tag Content="Movies" Closable="True" Visibility="{Binding Visibility, Mode=TwoWay}" />
</WrapPanel>
<WrapPanel>
<antd:Button x:Name="Toggle" Size="Small" Content="Toggle" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/AntIcons.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;StackPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Tag Content="Movies" Closable="True" Visibility="{Binding Visibility, Mode=TwoWay}" /&gt;\n
\t&lt;/WrapPanel&gt;\n
\t&lt;WrapPanel&gt;\n
\t\t&lt;antd:Button x:Name="Toggle" Size="Small" Content="Toggle" /&gt;\n
\t&lt;/WrapPanel&gt;\n
&lt;/StackPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>

123
AntdWpfDemo/Views/ToolTipView.xaml Normal file
View File

@@ -0,0 +1,123 @@
<UserControl x:Class="AntdWpfDemo.Views.ToolTipView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
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:antd="https://github.com/ShrlAlgo/AntdWpf"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="930">
<ScrollViewer>
<Grid Margin="16 0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel>
<Label Style="{StaticResource Ant.H1}" Content="Tooltip" />
<TextBlock Style="{StaticResource Ant.P}" Text="A simple text popup tip." />
<Label Style="{StaticResource Ant.H2}" Content="When To Use" />
<TextBlock Style="{StaticResource Ant.P}" Text="The tip is shown on mouse enter, and is hidden on mouse leave. The Tooltip doesn't support complex text or operations.&#x0a;To provide an explanation of a button/text/operation. It's often used instead of the html title attribute." />
<Label Style="{StaticResource Ant.H2}" Content="Examples" />
</StackPanel>
<Grid Grid.Row="1">
<Grid.Resources>
<Style TargetType="antd:Button">
<Setter Property="Margin" Value="8 0 0 8" />
</Style>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Margin="8 0">
<antd:CodeBox Title="Basic">
<antd:CodeBox.Description>
The simplest usage.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<TextBlock Text="Tooltip will show when mouse enter." ToolTip="prompt text" ToolTipService.Placement="Top" ToolTipService.ShowDuration="0" />
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;
&lt;antd:Switch IsChecked="True" /&gt;
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
<antd:CodeBox Title="Arrow pointing at the center">
<antd:CodeBox.Description>
By specifying `arrowPointAtCenter` prop, the arrow will point to the center of the target element.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<StackPanel>
<WrapPanel>
<antd:Button Content="Align edge / 边缘对齐" />
</WrapPanel>
<WrapPanel>
<antd:Button Content="Arrow points to center / 箭头指向中心" />
</WrapPanel>
</StackPanel>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;
&lt;antd:Switch IsChecked="True" /&gt;
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
<StackPanel Grid.Column="1" Margin="8 0">
<antd:CodeBox Title="Placement">
<antd:CodeBox.Description>
The ToolTip has 12 placements choice.
</antd:CodeBox.Description>
<antd:CodeBox.Content>
<Grid MaxWidth="335">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<WrapPanel HorizontalAlignment="Center">
<antd:Button Content="TL" />
<antd:Button Content="Top" />
<antd:Button Content="TR" />
</WrapPanel>
<StackPanel Grid.Row="1" HorizontalAlignment="Left">
<antd:Button Content="LT" />
<antd:Button Content="Left" />
<antd:Button Content="LB" />
</StackPanel>
<StackPanel Grid.Row="1" HorizontalAlignment="Right">
<antd:Button Content="RT" />
<antd:Button Content="Right" />
<antd:Button Content="RB" />
</StackPanel>
<WrapPanel Grid.Row="2" HorizontalAlignment="Center">
<antd:Button Content="BL" />
<antd:Button Content="Bottom" />
<antd:Button Content="BR" />
</WrapPanel>
</Grid>
</antd:CodeBox.Content>
<antd:CodeBox.Code>
&lt;ResourceDictionary Source="pack://application:,,,/AntdWpf;component/Themes/Theme.xaml" /&gt;\n\n
xmlns:antd="https://github.com/ShrlAlgo/AntdWpf"\n\n
&lt;WrapPanel&gt;
&lt;antd:Switch IsChecked="True" /&gt;
&lt;/WrapPanel&gt;
</antd:CodeBox.Code>
</antd:CodeBox>
</StackPanel>
</Grid>
</Grid>
</ScrollViewer>
</UserControl>