在 Xamarin 窗体中加载视图内容时显示活动指示器答案

【问题标题】：Show a activity indicator while View content is loading in Xamarin Forms在 Xamarin 窗体中加载视图内容时显示活动指示器
【发布时间】：2020-11-17 12:43:04
【问题描述】：

有没有办法在页面内容视图呈现或加载时显示活动指示器？我问这个是因为当我在页面中有很多控件并且我想导航到该页面时，它需要很少第二个去页面。所以我想知道是否有办法即时导航页面，当页面出现时显示加载内容的活动指示器，当内容加载时，显示它。

【问题讨论】：

标签： c# xamarin.forms

【解决方案1】：

有没有办法在页面内容视图呈现或加载时显示活动指示器？

我们需要在 PCL 中创建服务名称 ILodingPageService 接口。

public interface ILodingPageService
 {
void InitLoadingPage(ContentPage loadingIndicatorPage = null);
void ShowLoadingPage();
void HideLoadingPage();

 }

2.创建透明页面以显示活动指示器。

<ContentPage.Content>
    <StackLayout
        Padding="30"
        BackgroundColor="Black"
        HorizontalOptions="Center"
        VerticalOptions="Center">

        <ActivityIndicator IsRunning="True" Color="White" />

        <Label
            FontAttributes="Bold"
            Text="Loading..."
            TextColor="White" />

    </StackLayout>
</ContentPage.Content>

3.在Android平台实现ILodingPageService接口。

[assembly: Xamarin.Forms.Dependency(typeof(LodingPageServiceDroid))]

命名空间 IndicatorApp.Droid {
公共类 LodingPageServiceDroid : ILodingPageService {

    private Android.Views.View _nativeView;
    private Dialog _dialog;
    private bool _isInitialized;
    public void HideLoadingPage()
    {
        // Hide the page

        _dialog.Hide();
    }

    public void InitLoadingPage(ContentPage loadingIndicatorPage = null)
    {
        // check if the page parameter is available
        if (loadingIndicatorPage != null)
        {
            // build the loading page with native base
            loadingIndicatorPage.Parent = Xamarin.Forms.Application.Current.MainPage;
            loadingIndicatorPage.Layout(new Rectangle(0, 0,
            Xamarin.Forms.Application.Current.MainPage.Width,
            Xamarin.Forms.Application.Current.MainPage.Height));
            var renderer = loadingIndicatorPage.GetOrCreateRenderer();
            _nativeView = renderer.View;
            _dialog = new Dialog(CrossCurrentActivity.Current.Activity);

            _dialog.RequestWindowFeature((int)WindowFeatures.NoTitle);

            _dialog.SetCancelable(false);

            _dialog.SetContentView(_nativeView);

            Window window = _dialog.Window;

            window.SetLayout(ViewGroup.LayoutParams.MatchParent, ViewGroup.LayoutParams.MatchParent);

            window.ClearFlags(WindowManagerFlags.DimBehind);

            window.SetBackgroundDrawable(new ColorDrawable(Android.Graphics.Color.Transparent));
            _isInitialized = true;
        }
    }

    public void ShowLoadingPage()
    {
        // check if the user has set the page or not
        if (!_isInitialized)
            InitLoadingPage(new LoadingIndicatorPage1()); // set the default page

        // showing the native loading page

        _dialog.Show();
    }
}
internal static class PlatformExtension
{
    public static IVisualElementRenderer GetOrCreateRenderer(this VisualElement bindable)
    {
        var renderer = XFPlatform.GetRenderer(bindable);
        if (renderer == null)
        {
            renderer = XFPlatform.CreateRendererWithContext(bindable, CrossCurrentActivity.Current.Activity);

            XFPlatform.SetRenderer(bindable, renderer);

        }

        return renderer;

    }

}

}

我在 githun 新建了一个 simple，你可以下载。

https://github.com/CherryBu/activityindicator

如果我的回复解决了你的问题，请记得标记我的回复，谢谢。

截图在这里：

【讨论】：

太棒了，我一直在寻找这种类型的模型，它真的会帮助我学习一些新的方法，谢谢你:-)
此链接失效请更新此链接

【解决方案2】：

在您的视图模型中，添加一个布尔属性来指示页面是否正在加载。
在模型中实现 INotifyPropertyChanged 并在您更改属性时触发 PropertyChanged 事件（在 setter 代码处）。
将活动指示器的“IsRunning”属性绑定到您在第一步中添加的属性。

现在，在您的内容开始加载时将其设置为 true，在您完成加载时将其设置为 false。

【讨论】：