Xamarin-页面冻结，而不显示活动指示器

Question

我有一个这样构建的页面：

<StackLayout>
    <CollectionView ItemsSource="{Binding Galleries}" x:Name="myCollection" SelectionMode="Single" SelectionChanged="CollectionView_SelectionChanged">
        <CollectionView.ItemsLayout>
            <GridItemsLayout Orientation="Vertical"
                    Span="2" />
        </CollectionView.ItemsLayout>
        <CollectionView.ItemTemplate>
            <DataTemplate>

                <Image Source="{Binding ThumbUrl}"
                   Aspect="AspectFit" />

            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
    <ActivityIndicator BindingContext="{x:Reference myCollection}" IsRunning="{Binding IsLoading}"/>

</StackLayout>

绑定源返回许多URL，这些URL随后显示为图库。由于加载页面需要花费几秒钟，因此我想显示活动指示器。我确实有另一个页面，该页面链接到各个画廊。这是页面加载画廊页面的方式：

   private void CollectionView_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        if (e.CurrentSelection.Count > 0)
        { 
            var item = (GalleryListEntry)e.CurrentSelection.FirstOrDefault();
            ((CollectionView)sender).SelectedItem = null;
            Navigation.PushModalAsync(new Gallery(item.PCode, item.GCode));
        }
    }

问题是，每当我单击此页面时，它都会冻结，直到画廊被加载，然后直接跳到画廊。我希望它显示带有活动指示器的画廊（空），直到画廊被加载，而不是冻结。.

我在做什么错？

编辑：根据要求，图库页面的代码：

Gallery.Xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:vm="clr-namespace:GalShare.ViewModel"
         xmlns:d="http://xamarin.com/schemas/2014/forms/design"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         mc:Ignorable="d"
         x:Class="GalShare.Views.Gallery">

<StackLayout>
    <CollectionView ItemsSource="{Binding Galleries}" x:Name="myCollection" SelectionMode="Single" SelectionChanged="CollectionView_SelectionChanged">
        <CollectionView.ItemsLayout>
            <GridItemsLayout Orientation="Vertical"
                    Span="2" />
        </CollectionView.ItemsLayout>
        <CollectionView.ItemTemplate>
            <DataTemplate>

                <Image Source="{Binding ThumbUrl}"
                   Aspect="AspectFit" />

            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
    <ActivityIndicator BindingContext="{x:Reference myCollection}" IsRunning="{Binding IsLoading}"/>

</StackLayout>

gallery.xaml.cs

using GalShare.Model;
using GalShare.ViewModel;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace GalShare.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]

public partial class Gallery : ContentPage
{
    public Gallery(string photographerCode, string galleryCode)
    {
        InitializeComponent();
        BindingContext = new GalleryViewModel(photographerCode, galleryCode);
    }
}

}

GalleryViewModel.cs

using GalShare.Model;
using GalShare.Service;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;

namespace GalShare.ViewModel
{
    class GalleryViewModel
    {
        public string pCode { get; set; }
        public string gCode { get; set; }
        public ObservableCollection<picdata> Galleries { get; set; }          
        public GalleryViewModel(string pCode, string gCode)
        {
            this.pCode = pCode;
            this.gCode = gCode;

            Galleries = new GalleryService().GetImageList(pCode,gCode);

    }
    }
}

GalleryService.cs

using GalShare.Model;
using Newtonsoft.Json.Linq;
using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Net;
using System.Text;

namespace GalShare.Service
{
public class JsonGalListTxt
{
    public string Galurl { get; set; }
}

public class JsonTxt
{
    public Settings Settings { get; set; }
    public IList<File> Files { get; set; }
}

public class Settings
{
    public string Path { get; set; }
}

public class File
{
    public string file { get; set; }
}

public class galURL
{
    public string galurl { get; set; }
}

class GalleryService
 {

  //  public string pCode { get; set; }
  //  public string gCode { get; set; }

    public ObservableCollection<picdata> Images { get; set; }
    public ObservableCollection<picdata> GetImageList(string pCode, string gCode)
    {

        WebClient client = new WebClient();
        string GalUrl = client.DownloadString("https://www.mypage.it/getUrl.php?pid=" + pCode + "&galid=" + gCode);
        var deserializedUrl = JsonConvert.DeserializeObject<galURL>(GalUrl);

        Images = new ObservableCollection<picdata>();

            string downloadString = client.DownloadString(deserializedUrl.galurl);
            var deserialized = JsonConvert.DeserializeObject<JsonTxt>(downloadString);


            foreach (File img in deserialized.Files)
            {

               Images.Add(new picdata()
               {
                    ImageName = img.file,
                    BaseUrl = deserialized.Settings.Path.ToString(),
                    ThumbUrl = deserialized.Settings.Path.ToString() + "/thumbs" + img.file
               });
            }

        return Images;



    }
}
}

Answer 1

当从构造函数创建VM时，它将在主线程上加载所有图像，从而阻止页面实际显示直到完成为止

public Gallery(string photographerCode, string galleryCode)
{
    InitializeComponent();
    BindingContext = new GalleryViewModel(photographerCode, galleryCode);
}
至少，我将其移至OnAppearing，这样页面将首先显示，然后加载图像。