Merge pull request #275 from irihitech/avatar

Add Avatar Control
This commit is contained in:
Dong Bin
2024-06-28 21:28:04 +08:00
committed by GitHub
15 changed files with 387 additions and 0 deletions

View File

@@ -0,0 +1,96 @@
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:u="https://irihi.tech/ursa"
xmlns:vm="clr-namespace:Ursa.Demo.ViewModels"
mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
x:Class="Ursa.Demo.Pages.AvatarDemo">
<Design.DataContext>
<vm:AvatarDemoViewModel />
</Design.DataContext>
<UserControl.Resources>
<StreamGeometry x:Key="IconCamera">M7.44721 3.10557C7.786 2.428 8.47852 2 9.23607 2H14.7639C15.5215 2 16.214 2.428 16.5528 3.10557L17.5 5H20C21.6569 5 23 6.34315 23 8V18C23 19.6569 21.6569 21 20 21H4C2.34315 21 1 19.6569 1 18V8C1 6.34315 2.34315 5 4 5H6.5L7.44721 3.10557ZM9 13C9 11.3431 10.3431 10 12 10C13.6569 10 15 11.3431 15 13C15 14.6569 13.6569 16 12 16C10.3431 16 9 14.6569 9 13ZM12 8C9.23858 8 7 10.2386 7 13C7 15.7614 9.23858 18 12 18C14.7614 18 17 15.7614 17 13C17 10.2386 14.7614 8 12 8Z</StreamGeometry>
</UserControl.Resources>
<UserControl.Styles>
<Style Selector="u|Avatar">
<Setter Property="Content" Value="{Binding Content}" />
<Setter Property="Command" Value="{Binding ClickCommand}" />
</Style>
</UserControl.Styles>
<StackPanel>
<StackPanel Orientation="Horizontal" VerticalAlignment="Top">
<u:Avatar />
<u:Avatar Classes="Red">
<u:Avatar.HoverMask>
<Border Opacity="0.6">
<Panel>
<Border
Background="#16161A"
Width="{Binding $parent[u:Avatar].Width}"
Height="{Binding $parent[u:Avatar].Height}" />
<PathIcon
Data="{StaticResource IconCamera}"
Width="{Binding $parent[u:Avatar].FontSize}"
Height="{Binding $parent[u:Avatar].FontSize}" />
</Panel>
</Border>
</u:Avatar.HoverMask>
</u:Avatar>
<u:Avatar Source="../Assets/Ursa.ico" />
<u:Avatar Source="../Assets/IRIHI.png" />
<u:Avatar Source="../Assets/WORLD.png" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Avatar Classes="Red" />
<u:Avatar Classes="Pink" />
<u:Avatar Classes="Purple" />
<u:Avatar Classes="Violet" />
<u:Avatar Classes="Indigo" />
<u:Avatar Classes="Blue" />
<u:Avatar Classes="LightBlue" />
<u:Avatar Classes="Cyan" />
<u:Avatar Classes="Teal" />
<u:Avatar Classes="Green" />
<u:Avatar Classes="LightGreen" />
<u:Avatar Classes="Lime" />
<u:Avatar Classes="Yellow" />
<u:Avatar Classes="Amber" />
<u:Avatar Classes="Orange" />
<u:Avatar Classes="Grey" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Avatar Classes="ExtraExtraSmall" />
<u:Avatar Classes="ExtraSmall" />
<u:Avatar Classes="Small" />
<u:Avatar Classes="Default" />
<u:Avatar Classes="Medium" />
<u:Avatar Classes="Large" />
<u:Avatar Classes="ExtraLarge" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<u:Avatar Classes="Square ExtraExtraSmall Green" />
<u:Avatar Classes="Square ExtraSmall Green" />
<u:Avatar Classes="Square Small Green" />
<u:Avatar Classes="Square Default Green" />
<u:Avatar Classes="Square Medium Green" />
<u:Avatar Classes="Square Large Green" />
<u:Avatar Classes="Square ExtraLarge Green" Source="../Assets/Ursa.ico">
<u:Avatar.HoverMask>
<Border Opacity="0.6">
<Panel>
<Border
Background="#16161A"
Width="{Binding $parent[u:Avatar].Width}"
Height="{Binding $parent[u:Avatar].Height}" />
<PathIcon
Data="{StaticResource IconCamera}"
Width="{Binding $parent[u:Avatar].FontSize}"
Height="{Binding $parent[u:Avatar].FontSize}" />
</Panel>
</Border>
</u:Avatar.HoverMask>
</u:Avatar>
</StackPanel>
</StackPanel>
</UserControl>

View File

@@ -0,0 +1,13 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
namespace Ursa.Demo.Pages;
public partial class AvatarDemo : UserControl
{
public AvatarDemo()
{
InitializeComponent();
}
}