Merge pull request #419 from irihitech/loading

Introducing background and foreground for LoadingContainer

src/Ursa.Themes.Semi/Controls/Loading.axaml

@@ -7,6 +7,7 @@
     <!--  Add Resources Here  -->
     <converters:BrushToColorConverter x:Key="BrushToColorConverter" />
     <ControlTheme x:Key="{x:Type u:LoadingIcon}" TargetType="u:LoadingIcon">
+        <Setter Property="IsLoading" Value="True"></Setter>
         <Setter Property="Foreground" Value="{DynamicResource LoadingIconForeground}" />
         <Setter Property="Template">
             <ControlTemplate TargetType="u:LoadingIcon">
@@ -29,20 +30,6 @@
                             </GradientStops>
                         </ConicGradientBrush>
                     </Arc.Stroke>
-                    <Arc.Styles>
-                        <Style Selector="Arc[IsVisible=True]">
-                            <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>
@@ -56,13 +43,25 @@
             <Setter Property="Height" Value="32" />
             <Setter Property="StrokeThickness" Value="5" />
         </Style>
+        <Style Selector="^[IsLoading=True] /template/ Arc#PART_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>
     </ControlTheme>
 
     <ControlTheme x:Key="{x:Type u:Loading}" TargetType="u:Loading">
         <Setter Property="Background" Value="{DynamicResource LoadingMaskBackground}" />
         <Setter Property="Indicator">
             <Template>
-                <u:LoadingIcon />
+                <u:LoadingIcon IsLoading="{Binding $parent[u:Loading].IsLoading, Mode=TwoWay}" />
             </Template>
         </Setter>
         <Setter Property="Template">
@@ -93,10 +92,12 @@
 
     <ControlTheme x:Key="{x:Type u:LoadingContainer}" TargetType="u:LoadingContainer">
         <Setter Property="HorizontalContentAlignment" Value="Center" />
+        <Setter Property="MessageForeground" Value="{DynamicResource TextBlockDefaultForeground}"/>
+        <Setter Property="Background" Value="{DynamicResource LoadingMaskBackground}" />
         <Setter Property="VerticalContentAlignment" Value="Center" />
         <Setter Property="Indicator">
             <Template>
-                <u:LoadingIcon />
+                <u:LoadingIcon IsLoading="{Binding $parent[u:LoadingContainer].IsLoading, Mode=TwoWay}" />
             </Template>
         </Setter>
         <Setter Property="Template">
@@ -109,6 +110,8 @@
                         Content="{TemplateBinding Content}"
                         ContentTemplate="{TemplateBinding ContentTemplate}" />
                     <u:Loading
+                        Background="{TemplateBinding Background}"
+                        Foreground="{TemplateBinding MessageForeground}"
                         Content="{TemplateBinding LoadingMessage}"
                         ContentTemplate="{TemplateBinding LoadingMessageTemplate}"
                         Indicator="{TemplateBinding Indicator}"

src/Ursa/Controls/Loading/Loading.cs

@@ -14,10 +14,10 @@ public class Loading: ContentControl
         set => SetValue(IndicatorProperty, value);
     }
 
-    public static readonly StyledProperty<object?> IsLoadingProperty = AvaloniaProperty.Register<Loading, object?>(
+    public static readonly StyledProperty<bool> IsLoadingProperty = AvaloniaProperty.Register<Loading, bool>(
         nameof(IsLoading));
 
-    public object? IsLoading
+    public bool IsLoading
     {
         get => GetValue(IsLoadingProperty);
         set => SetValue(IsLoadingProperty, value);

src/Ursa/Controls/Loading/LoadingContainer.cs

@@ -2,6 +2,7 @@ using Avalonia;
 using Avalonia.Controls;
 using Avalonia.Controls.Metadata;
 using Avalonia.Controls.Templates;
+using Avalonia.Media;
 
 namespace Ursa.Controls;
 
@@ -28,6 +29,15 @@ public class LoadingContainer: ContentControl
         set => SetValue(LoadingMessageProperty, value);
     }
 
+    public static readonly StyledProperty<IBrush?> MessageForegroundProperty = AvaloniaProperty.Register<LoadingContainer, IBrush?>(
+        nameof(MessageForeground));
+
+    public IBrush? MessageForeground
+    {
+        get => GetValue(MessageForegroundProperty);
+        set => SetValue(MessageForegroundProperty, value);
+    }
+
     public static readonly StyledProperty<IDataTemplate> LoadingMessageTemplateProperty = AvaloniaProperty.Register<LoadingContainer, IDataTemplate>(
         nameof(LoadingMessageTemplate));
 

src/Ursa/Controls/Loading/LoadingIcon.cs

@@ -1,8 +1,16 @@
+using Avalonia;
 using Avalonia.Controls;
 
 namespace Ursa.Controls;
 
 public class LoadingIcon: ContentControl
 {
-    
+    public static readonly StyledProperty<bool> IsLoadingProperty = AvaloniaProperty.Register<LoadingIcon, bool>(
+        nameof(IsLoading));
+
+    public bool IsLoading
+    {
+        get => GetValue(IsLoadingProperty);
+        set => SetValue(IsLoadingProperty, value);
+    }
 }