将新页面推送到导航时显示ActivityIndi​​cator

时间:2016-07-25 13:10:15

标签: c# xamarin xamarin.android xamarin.forms xlabs

我在实现像页面加载时显示ActivityIndi​​cator这样简单的功能时遇到了一些麻烦,但事实证明这很困难。

这是我在App.xaml.cs上使用的代码:

public partial class App : Application
    {
        public App()
        {
            InitializeComponent();

            MainPage = new NavigationPage(new LoginPage());
        }
    }

这是我的登录页面

public partial class LoginPage : ContentPage
    {
        public LoginPage()
        {
            InitializeComponent();

            btnLogin.Clicked += BtnLogin_Clicked;
        }

        protected async void BtnLogin_Clicked(object sender, EventArgs e)
        {
    loadingView.IsVisible = true;
    activityIndicator.IsRunning = true;

            await Navigation.PushAsync(new SchedulePage());

    loadingView.IsVisible = false;
    activityIndicator.IsRunning = false;
        }
    }

没有详细介绍,loadingView是我在xaml文件上的一个视图,它包含我的ActivityIndi​​cator。我的主要问题是当我调用Navigation.PushAsync()时,ActivityIndi​​cator的动画将停止。根据我所读到的,这是因为两个操作都发生在主线程上,所以一个中断另一个。

我需要显示指标的原因是因为我的SchedulePage需要花费大量时间来渲染,因为它具有XLabs日历控件。

你会如何实现这样的目标?

3 个答案:

答案 0 :(得分:2)

您应该尝试将页面导航包装成以下内容:

Device.BeginInvokeOnMainThread (async() => {
await Navigation.PushAsync(new SchedulePage());
});

这允许进程启动并保持UI元素的响应。

答案 1 :(得分:2)

昨天我正在调查这个案例,因为我有一个ActivityIndi​​cator,它在我在PushAsync之前激活时没有显示。我在这里看到stackoverflow和所有解决方案指向在Task.Run内部的Device.BeginInvokeOnMainThread内运行PushAsync,我尝试了但没有任何改变。

然后我意识到我所需要的只是另一个异步任务,它在PushAsync运行之前提供了ActivityIndi​​cator时间。所以这里的代码在我的项目中起作用:

public partial class MyActivities : ContentPage
{
    private bool _isLoading;

    public bool IsLoading //Binded to ActivityIndicator
    {
        get { return _isLoading; }
        private set
        {
            _isLoading = value;
            OnPropertyChanged("IsLoading");
        }
    }

    public MyActivities()
    {
        BindingContext = this;
        InitializeComponent();

        btnNavitage.Clicked += async (s,a) => 
        {
            IsLoading = true;
            var animateEnd = await aiControl.FadeTo(1d); //aiControl is the ActivityIndicator, animate it do the trick
            try
            {
                await Navigation.PushAsync(new CheckInForm()); //when the code reach the PushAsync, ActivityIndicator is already running
            }
            finally
            {
                IsLoading = false;
            }
        }
    }
}

答案 2 :(得分:0)

//作为jotade的后续作品 //无需设置其他属性,只需在XAML中将IsRunning设置为True,然后执行以下操作

        -- code remove for brevity

        ActivityIndicator.IsVisible = true;

        await Task.Delay(500); 
        try
        {
            await Navigation.PushAsync(new TransactionCalculationPage(), true);
        }
        finally
        {
            ActivityIndicator.IsVisible = false;
        }