[NUI] Fix Progress and improve Loading

* Progress
Previously, the Progress did not update the distance of the indeterminate animation on resize.

* Loading
Add a property that can help to set lottie animation image url.
This is for using Theme.

Signed-off-by: Jiyun Yang <ji.yang@samsung.com>

diff --git a/src/Tizen.NUI.Components/Controls/Loading.cs b/src/Tizen.NUI.Components/Controls/Loading.cs
index 139cd22e0ba275e6bde9d1b0b9146b7f39b7da5c..8e3c94a95e01a2be892e39ea5f18542af4be7aa2 100755 (executable)
--- a/src/Tizen.NUI.Components/Controls/Loading.cs
+++ b/src/Tizen.NUI.Components/Controls/Loading.cs
@@ -66,6 +66,19 @@ namespace Tizen.NUI.Components
             Debug.Assert(((Loading)bindable).imageVisual != null);
             return ((Loading)bindable).imageVisual.URLS;
         });
+        /// <summary>The lottie resource url bindable property.</summary>
+        [EditorBrowsable(EditorBrowsableState.Never)]
+        public static readonly BindableProperty LottieResourceUrlProperty = BindableProperty.Create(nameof(LottieResourceUrl), typeof(string), typeof(Loading), null, propertyChanged: (bindable, oldValue, newValue) =>
+        {
+            var instance = (Loading)bindable;
+            instance.RemoveImageVisual();
+            instance.EnsureLottieView(newValue as string ?? string.Empty);
+        },
+        defaultValueCreator: (bindable) =>
+        {
+            var lottie = ((Loading)bindable).defaultLottieView;
+            return lottie == null ? string.Empty : lottie.URL;
+        });
         /// <summary>The Size bindable property.</summary>
         [EditorBrowsable(EditorBrowsableState.Never)]
         public new static readonly BindableProperty SizeProperty = BindableProperty.Create(nameof(Size), typeof(Size), typeof(Loading), new Size(0, 0), propertyChanged: (bindable, oldValue, newValue) =>
@@ -98,6 +111,7 @@ namespace Tizen.NUI.Components
             return ((Loading)bindable).frameRate;
         });
 
+        private const string ImageVisualName = "loadingImageVisual";
         private AnimatedImageVisual imageVisual = null;
         private LottieAnimationView defaultLottieView = null;
         private int frameRate = (int)(1000 / 16.6f);
@@ -162,6 +176,7 @@ namespace Tizen.NUI.Components
 
         /// <summary>
         /// Gets or sets loading image resource array.
+        /// The mutually exclusive with "LottieResourceUrl".
         /// </summary>
         /// <since_tizen> 6 </since_tizen>
         public string[] ImageArray
@@ -172,11 +187,8 @@ namespace Tizen.NUI.Components
             }
             set
             {
-                defaultLottieView?.Stop();
-                defaultLottieView?.Dispose();
-                defaultLottieView = null;
-
-                CreateImageVisual();
+                RemoveLottieView();
+                EnsureImageVisual();
 
                 SetValue(ImageArrayProperty, value);
                 NotifyPropertyChanged();
@@ -200,6 +212,17 @@ namespace Tizen.NUI.Components
             }
         }
 
+        /// <summary>
+        /// Gets or sets an lottie resource url.
+        /// The mutually exclusive with "ImageArray".
+        /// </summary>
+        [EditorBrowsable(EditorBrowsableState.Never)]
+        public string LottieResourceUrl
+        {
+            get => GetValue(LottieResourceUrlProperty) as string;
+            set => SetValue(LottieResourceUrlProperty, value);
+        }
+
         /// <summary>
         /// Gets or sets loading size.
         /// </summary>
@@ -243,14 +266,7 @@ namespace Tizen.NUI.Components
             base.OnInitialize();
             AccessibilityRole = Role.ProgressBar;
 
-            defaultLottieView = new LottieAnimationView()
-            {
-                URL = lottieResource,
-                LoopCount = -1,
-            };
-
-            Add(defaultLottieView);
-            defaultLottieView.Play();
+            EnsureLottieView(lottieResource);
 
             AccessibilityManager.Instance.SetAccessibilityAttribute(this, AccessibilityManager.AccessibilityAttribute.Trait, "Loading");
         }
@@ -374,7 +390,28 @@ namespace Tizen.NUI.Components
             AccessibilityHighlightable = true;
         }
 
-        private void CreateImageVisual()
+        private void EnsureLottieView(string url)
+        {
+            if (defaultLottieView != null)
+            {
+                if (defaultLottieView.URL == url) return;
+                defaultLottieView.Stop();
+            }
+            else Add(defaultLottieView = new LottieAnimationView() { LoopCount = -1 });
+
+            defaultLottieView.URL = url;
+            defaultLottieView.Play();
+        }
+
+        private void RemoveLottieView()
+        {
+            if (defaultLottieView == null) return;
+            defaultLottieView.Stop();
+            defaultLottieView.Dispose();
+            defaultLottieView = null;
+        }
+
+        private void EnsureImageVisual()
         {
             if (imageVisual == null)
             {
@@ -390,8 +427,16 @@ namespace Tizen.NUI.Components
                     Size = new Size2D(1, 1)
                 };
 
-                AddVisual("loadingImageVisual", imageVisual);
+                AddVisual(ImageVisualName, imageVisual);
             }
         }
+
+        private void RemoveImageVisual()
+        {
+            if (imageVisual == null) return;
+            RemoveVisual(ImageVisualName);
+            imageVisual.Dispose();
+            imageVisual = null;
+        }
     }
 }

diff --git a/src/Tizen.NUI.Components/Controls/Progress.cs b/src/Tizen.NUI.Components/Controls/Progress.cs
index 9b0e332db4a3e179f0d2a9c68f5e57cd41723fc4..07561fa1132dca13cc3384ee8e622f81a430316e 100755 (executable)
--- a/src/Tizen.NUI.Components/Controls/Progress.cs
+++ b/src/Tizen.NUI.Components/Controls/Progress.cs
@@ -30,6 +30,8 @@ namespace Tizen.NUI.Components
     /// <since_tizen> 6 </since_tizen>
     public partial class Progress : Control, IAtspiValue
     {
+        private const int IndeterminateAnimationDuration = 2000;
+
         /// <summary>
         /// MaxValueProperty
         /// </summary>
@@ -621,6 +623,8 @@ namespace Tizen.NUI.Components
 
             this.size = new Vector2(size);
             UpdateValue();
+
+            if (state == ProgressStatusType.Indeterminate) UpdateIndeterminateAnimation();
         }
 
         /// <summary>
@@ -668,28 +672,30 @@ namespace Tizen.NUI.Components
         [EditorBrowsable(EditorBrowsableState.Never)]
         private void UpdateIndeterminateAnimation()
         {
-            indeterminateAnimation?.Stop();
+            if (indeterminateImage == null) return;
 
-            if (null != indeterminateImage)
+            if (indeterminateAnimation == null)
             {
-                if (indeterminateAnimation == null)
-                {
-                    indeterminateAnimation = new Animation(2000);
-                }
+                indeterminateAnimation = new Animation(IndeterminateAnimationDuration);
+            }
+            else
+            {
+                indeterminateAnimation.Stop();
+                indeterminateAnimation.Clear();
+            }
 
-                float destination = (this.SizeWidth - indeterminateImage.SizeWidth);
+            float destination = (this.SizeWidth - indeterminateImage.SizeWidth);
 
-                KeyFrames keyFrames = new KeyFrames();
-                keyFrames.Add(0.0f /*  0%*/, new Position(0, 0));
-                AlphaFunction ease = new AlphaFunction(AlphaFunction.BuiltinFunctions.EaseInOut);
-                keyFrames.Add(0.5f /* 50%*/, new Position(destination, 0), ease);
-                keyFrames.Add(1.0f /*100%*/, new Position(0, 0), ease);
-                ease.Dispose();
+            KeyFrames keyFrames = new KeyFrames();
+            keyFrames.Add(0.0f /*  0%*/, new Position(0, 0));
+            AlphaFunction ease = new AlphaFunction(AlphaFunction.BuiltinFunctions.EaseInOut);
+            keyFrames.Add(0.5f /* 50%*/, new Position(destination, 0), ease);
+            keyFrames.Add(1.0f /*100%*/, new Position(0, 0), ease);
+            ease.Dispose();
 
-                indeterminateAnimation.AnimateBetween(indeterminateImage, "Position", keyFrames);
-                indeterminateAnimation.Looping = true;
-                indeterminateAnimation.Play();
-            }
+            indeterminateAnimation.AnimateBetween(indeterminateImage, "Position", keyFrames);
+            indeterminateAnimation.Looping = true;
+            indeterminateAnimation.Play();
         }
 
         /// <summary>

diff --git a/src/Tizen.NUI.Components/Style/LoadingStyle.cs b/src/Tizen.NUI.Components/Style/LoadingStyle.cs
index 37ae5c73ca86e18bffb0fbf840eca8cf184926f8..7cbe9daef94698ddfdff82db438ffbb8291b5e7c 100755 (executable)
--- a/src/Tizen.NUI.Components/Style/LoadingStyle.cs
+++ b/src/Tizen.NUI.Components/Style/LoadingStyle.cs
@@ -67,8 +67,18 @@ namespace Tizen.NUI.Components
         defaultValueCreator: (bindable) => ((LoadingStyle)bindable).images
         );
 
+        /// <summary>The lottie resource url bindable property.</summary>
+        [EditorBrowsable(EditorBrowsableState.Never)]
+        public static readonly BindableProperty LottieResourceUrlProperty = BindableProperty.Create(nameof(LottieResourceUrl), typeof(string), typeof(LoadingStyle), null, propertyChanged: (bindable, oldValue, newValue) =>
+        {
+            ((LoadingStyle)bindable).lottieResourceUrl = newValue as string;
+        },
+        defaultValueCreator: (bindable) => ((LoadingStyle)bindable).lottieResourceUrl
+        );
+
         private Selector<int?> frameRate;
         private List<string> images;
+        private string lottieResourceUrl;
 
         static LoadingStyle() { }
 
@@ -110,6 +120,17 @@ namespace Tizen.NUI.Components
             internal set => SetValue(ImageListProperty, value);
         }
 
+        /// <summary>
+        /// Gets or sets an lottie resource url.
+        /// The mutually exclusive with "ImageArray".
+        /// </summary>
+        [EditorBrowsable(EditorBrowsableState.Never)]
+        public string LottieResourceUrl
+        {
+            get => GetValue(LottieResourceUrlProperty) as string;
+            set => SetValue(LottieResourceUrlProperty, value);
+        }
+
         /// <summary>
         /// Gets or sets loading image size.
         /// </summary>