feat: add loading.

This commit is contained in:
rabbitism
2023-06-23 22:24:43 +08:00
parent 0a14fc2dbe
commit 009498f590
8 changed files with 181 additions and 0 deletions

View File

@@ -0,0 +1,25 @@
<UserControl
x:Class="Ursa.Demo.Pages.LoadingDemo"
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:u="https://irihi.tech/ursa"
d:DesignHeight="450"
d:DesignWidth="800"
mc:Ignorable="d">
<Grid RowDefinitions="Auto, Auto, *">
<ToggleSwitch Name="s" Content="Loading" />
<u:LoadingIcon Grid.Row="1" />
<Panel
Grid.Row="2"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
<u:Banner
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="Hello Ursa!" />
<u:Loading Content="Loading..." IsLoading="{Binding #s.IsChecked}" />
</Panel>
</Grid>
</UserControl>

View File

@@ -0,0 +1,18 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
namespace Ursa.Demo.Pages;
public partial class LoadingDemo : UserControl
{
public LoadingDemo()
{
InitializeComponent();
}
private void InitializeComponent()
{
AvaloniaXamlLoader.Load(this);
}
}

View File

@@ -35,6 +35,9 @@
<TabItem Header="IPv4Box">
<pages:IPv4BoxDemo />
</TabItem>
<TabItem Header="Loading">
<pages:LoadingDemo />
</TabItem>
<TabItem Header="Navigation">
<pages:NavigationMenuDemo />
</TabItem>

View File

@@ -0,0 +1,78 @@
<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:converters="clr-namespace:Ursa.Themes.Semi.Converters"
xmlns:u="clr-namespace:Ursa.Controls;assembly=Ursa">
<!-- Add Resources Here -->
<converters:BrushToColorConverter x:Key="BrushToColorConverter" />
<ControlTheme x:Key="{x:Type u:LoadingIcon}" TargetType="u:LoadingIcon">
<Setter Property="Foreground" Value="{DynamicResource SemiBlue6}" />
<Setter Property="Template">
<ControlTemplate TargetType="u:LoadingIcon">
<Arc
Width="20"
Height="20"
StartAngle="0"
StrokeJoin="Round"
StrokeLineCap="Round"
StrokeThickness="3"
SweepAngle="300">
<Arc.Stroke>
<ConicGradientBrush Angle="70">
<GradientStops>
<GradientStop Offset="0" Color="{Binding Foreground, Converter={StaticResource BrushToColorConverter}, RelativeSource={RelativeSource TemplatedParent}}" />
<GradientStop Offset="0.8" Color="Transparent" />
</GradientStops>
</ConicGradientBrush>
</Arc.Stroke>
<Arc.Styles>
<Style Selector="Arc">
<Style.Animations>
<Animation IterationCount="Infinite" Duration="0:0:0.5">
<KeyFrame Cue="0%">
<Setter Property="RotateTransform.Angle" Value="0.0" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="RotateTransform.Angle" Value="-360.0" />
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
</Arc.Styles>
</Arc>
</ControlTemplate>
</Setter>
</ControlTheme>
<ControlTheme x:Key="{x:Type u:Loading}" TargetType="u:Loading">
<Setter Property="Background">
<SolidColorBrush Opacity="0.13" Color="#2E3238" />
</Setter>
<Setter Property="Indicator">
<Template>
<u:LoadingIcon />
</Template>
</Setter>
<Setter Property="Template">
<ControlTemplate TargetType="u:Loading">
<Panel IsVisible="{TemplateBinding IsLoading}">
<Border
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Background="{TemplateBinding Background}" />
<Grid
HorizontalAlignment="Center"
VerticalAlignment="Center"
RowDefinitions="Auto, *">
<ContentPresenter HorizontalAlignment="Center" Content="{TemplateBinding Indicator}" />
<ContentPresenter
Name="PART_ContentPresenter"
Grid.Row="1"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
</Grid>
</Panel>
</ControlTemplate>
</Setter>
</ControlTheme>
</ResourceDictionary>

View File

@@ -5,6 +5,7 @@
<ResourceInclude Source="Banner.axaml" />
<ResourceInclude Source="Divider.axaml" />
<ResourceInclude Source="IPv4Box.axaml" />
<ResourceInclude Source="Loading.axaml" />
<ResourceInclude Source="Navigation.axaml" />
<ResourceInclude Source="Pagination.axaml" />
<ResourceInclude Source="Timeline.axaml" />

View File

@@ -0,0 +1,22 @@
using System.Globalization;
using Avalonia.Data.Converters;
using Avalonia.Media;
namespace Ursa.Themes.Semi.Converters;
public class BrushToColorConverter: IValueConverter
{
public object? Convert(object? value, Type targetType, object? parameter, CultureInfo culture)
{
if (value is ISolidColorBrush b)
{
return b.Color;
}
return null;
}
public object? ConvertBack(object? value, Type targetType, object? parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}

View File

@@ -0,0 +1,26 @@
using Avalonia;
using Avalonia.Controls;
namespace Ursa.Controls;
public class Loading: ContentControl
{
public static readonly StyledProperty<object?> IndicatorProperty = AvaloniaProperty.Register<Loading, object?>(
nameof(Indicator));
public object? Indicator
{
get => GetValue(IndicatorProperty);
set => SetValue(IndicatorProperty, value);
}
public static readonly StyledProperty<object?> IsLoadingProperty = AvaloniaProperty.Register<Loading, object?>(
nameof(IsLoading));
public object? IsLoading
{
get => GetValue(IsLoadingProperty);
set => SetValue(IsLoadingProperty, value);
}
}

View File

@@ -0,0 +1,8 @@
using Avalonia.Controls;
namespace Ursa.Controls;
public class LoadingIcon: ContentControl
{
}