feature: show progress bar when loading pages

Pixiview/Illust/IllustCollectionPage.cs

@@ -61,7 +61,6 @@ namespace Pixiview.Illust
         protected double topOffset;
 
         private T illustData;
-        private readonly ParallelOptions parallelOptions = new ParallelOptions { MaxDegreeOfParallelism = Configs.MaxThreads };
 
         public IllustCollectionPage()
         {
@@ -467,12 +466,13 @@ namespace Pixiview.Illust
 
         void DoLoadImages(IllustCollection collection)
         {
-            Parallel.ForEach(collection, parallelOptions, illust =>
+            ParallelTask.Start(0, collection.Count, Configs.MaxThreads, i =>
             {
                 if (!collection.Running)
                 {
-                    return;
+                    return false;
                 }
+                var illust = collection[i];
                 if (illust.ImageUrl != null)
                 {
                     var url = Configs.GetThumbnailUrl(illust.ImageUrl);
@@ -495,6 +495,7 @@ namespace Pixiview.Illust
                         illust.ProfileImage = userImage;
                     }
                 }
+                return true;
             });
         }
 

Pixiview/Illust/ViewIllustPage.xaml

@@ -27,6 +27,10 @@
             </CarouselView.ItemsLayout>
         </CarouselView>
 
+        <ProgressBar x:Name="progress" IsVisible="{Binding ProgressVisible}"
+                     Progress="0.05"
+                     VerticalOptions="Start"/>
+
         <u:RoundLabel Text="{Binding PagePositionText}"
                       BackgroundColor="{DynamicResource MaskColor}" Margin="0, 6, 6, 0"
                       Padding="6, 4" CornerRadius="6"

Pixiview/Illust/ViewIllustPage.xaml.cs

@@ -35,6 +35,8 @@ namespace Pixiview.Illust
             nameof(CurrentAnimeFrame), typeof(double), typeof(ViewIllustPage), propertyChanged: OnCurrentAnimeFramePropertyChanged);
         public static readonly BindableProperty MaximumFrameProperty = BindableProperty.Create(
             nameof(MaximumFrame), typeof(double), typeof(ViewIllustPage), 1.0);
+        public static readonly BindableProperty ProgressVisibleProperty = BindableProperty.Create(
+            nameof(ProgressVisible), typeof(bool), typeof(ViewIllustPage));
 
         private static void OnCurrentPagePropertyChanged(BindableObject obj, object old, object @new)
         {
@@ -106,10 +108,15 @@ namespace Pixiview.Illust
             get => (double)GetValue(MaximumFrameProperty);
             set => SetValue(MaximumFrameProperty, value);
         }
+        public bool ProgressVisible
+        {
+            get => (bool)GetValue(ProgressVisibleProperty);
+            set => SetValue(ProgressVisibleProperty, value);
+        }
 
         public IllustItem IllustItem { get; private set; }
 
-        private readonly ParallelOptions parallelOptions = new ParallelOptions { MaxDegreeOfParallelism = Configs.MaxThreads };
+        private readonly object sync = new object();
         private readonly bool saveFavorites;
         private readonly ImageSource fontIconLove;
         private readonly ImageSource fontIconNotLove;
@@ -130,7 +137,7 @@ namespace Pixiview.Illust
                 ? fontIconLove
                 : fontIconNotLove;
 
-            IsPageVisible = illust != null && illust.PageCount > 1;
+            ProgressVisible = IsPageVisible = illust != null && illust.PageCount > 1;
             Resources.Add("carouselView", GetCarouseTemplate());
 
             InitializeComponent();
@@ -328,9 +335,11 @@ namespace Pixiview.Illust
                         illust.CopyToItem(illustItem);
                         MainThread.BeginInvokeOnMainThread(() =>
                         {
+                            var pageCount = illustItem.PageCount;
                             Title = illustItem.Title;
-                            IsPageVisible = illustItem.PageCount > 1;
+                            IsPageVisible = pageCount > 1;
                             IsAnimateSliderVisible = illustItem.IsAnimeVisible;
+                            ProgressVisible = pageCount > 1;
                         });
                         if (preload.user.TryGetValue(illust.userId, out var user))
                         {
@@ -340,15 +349,13 @@ namespace Pixiview.Illust
                 }
             }
 
-            Task.Run(() => DoLoadImage(0, true));
+            ParallelTask.Start(0, items.Length, Configs.MaxPageThreads, i =>
-            if (items.Length > 1)
             {
-                Parallel.For(1, items.Length, parallelOptions, i =>
+                DoLoadImage(i, i == 0);
-                {
+                return true;
-                    DoLoadImage(i);
+            });
-                });
+
-            }
+            if (illustItem.IsAnimeVisible)
-            else if (illustItem.IsAnimeVisible)
             {
                 // anime
                 ugoiraData = Stores.LoadIllustUgoiraData(illustItem.Id);
@@ -389,6 +396,39 @@ namespace Pixiview.Illust
                 }
             }
             item.Loading = false;
+            RefreshProgress();
+        }
+
+        private void RefreshProgress()
+        {
+            var illusts = Illusts;
+            var length = illusts.Length;
+            if (length <= 1)
+            {
+                return;
+            }
+            lock (sync)
+            {
+                var loading = illusts.Count(i => i.Loading);
+                if (loading <= 0)
+                {
+                    MainThread.BeginInvokeOnMainThread(async () =>
+                    {
+                        await progress.ProgressTo(1, 250, Easing.CubicIn);
+                        await progress.FadeTo(0, easing: Easing.CubicIn);
+                        ProgressVisible = false;
+                    });
+                }
+                else
+                {
+                    var val = (length - loading) / (float)length;
+                    MainThread.BeginInvokeOnMainThread(() =>
+                    {
+                        ViewExtensions.CancelAnimations(progress);
+                        progress.ProgressTo(val, 250, Easing.CubicIn);
+                    });
+                }
+            }
         }
 
         private void TapPrevious_Tapped(object sender, EventArgs e)

Pixiview/Utils/Stores.cs

@@ -450,6 +450,7 @@ namespace Pixiview.Utils
         public const string QueryTypeKey = "query_type";
         public const string QueryDateKey = "query_date";
 
+        public const int MaxPageThreads = 3;
         public const int MaxThreads = 6;
         public const string Referer = "https://www.pixiv.net/";
         public const string RefererIllust = "https://www.pixiv.net/artworks/{0}";