feat: add loading.

This commit is contained in:
rabbitism
2023-12-27 17:38:42 +08:00
parent 7890071cae
commit a550513925
5 changed files with 37 additions and 17 deletions

View File

@@ -26,22 +26,27 @@
ContentTemplate="{TemplateBinding ContentTemplate}" />
<Border
x:Name="PART_Border"
IsHitTestVisible="{TemplateBinding IsActive}"
IsVisible="{TemplateBinding IsActive}">
Classes.Active="{Binding Path= IsActive, RelativeSource={RelativeSource TemplatedParent}}"
IsHitTestVisible="{TemplateBinding Loading}"
IsVisible="{TemplateBinding Loading}"
>
<Border.Styles>
<Style Selector="Border">
<Setter Property="Background" Value="{DynamicResource SkeletonDefaultBackground}"></Setter>
</Style>
<Style Selector="Border.Active">
<Style.Animations>
<Animation
FillMode="Both"
FillMode="None"
IterationCount="Infinite"
Easing="CubicEaseInOut"
PlaybackDirection="Alternate"
Duration="0:0:1.4">
<KeyFrame Cue="0%">
<Setter Property="Background" Value="{DynamicResource SkeletonStartAnimationBackground}" />
<Setter Property="Border.Background" Value="{DynamicResource SkeletonStartAnimationBackground}" />
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Background" Value="{DynamicResource SkeletonEndAnimationBackground}" />
<Setter Property="Border.Background" Value="{DynamicResource SkeletonEndAnimationBackground}" />
</KeyFrame>
</Animation>
</Style.Animations>

View File

@@ -9,5 +9,6 @@
<GradientStop Offset="1" Color="#FF2E3238" />
<GradientStop Offset="1" Color="#FF1C1F23" />
</LinearGradientBrush>
<SolidColorBrush x:Key="SkeletonDefaultBackground" Color="#FF1C1F23"></SolidColorBrush>
<!-- Add Resources Here -->
</ResourceDictionary>

View File

@@ -9,5 +9,6 @@
<GradientStop Offset="1" Color="#FFE6E8EA" />
<GradientStop Offset="1" Color="#FFF9F9F9" />
</LinearGradientBrush>
<SolidColorBrush x:Key="SkeletonDefaultBackground" Color="#FFF9F9F9"></SolidColorBrush>
<!-- Add Resources Here -->
</ResourceDictionary>

View File

@@ -8,13 +8,22 @@ namespace Ursa.Controls
{
public class Skeleton : ContentControl
{
public static readonly StyledProperty<bool> IsActiveProperty =
AvaloniaProperty.Register<Skeleton, bool>(nameof(IsActive));
public bool IsActive
{
get { return GetValue(IsActiveProperty); }
set { SetValue(IsActiveProperty, value); }
}
}
public static readonly StyledProperty<bool> LoadingProperty =
AvaloniaProperty.Register<Skeleton, bool>(nameof(Loading));
public bool Loading
{
get => GetValue(LoadingProperty);
set => SetValue(LoadingProperty, value);
}
}
}