UWP：加载页面时打开 ProgressRing答案

【问题标题】：UWP : open a ProgressRing when a page is loadedUWP：加载页面时打开 ProgressRing
【发布时间】：2018-08-01 21:45:04
【问题描述】：

在我的 UWP 应用的第一页上，我的命令栏中有一个“添加”按钮，可打开第二页。

在第二页的开头，我从一个 SQLite 表中加载了一个列表并过滤了这个列表。这是一个比较长的过程，因为有很多数据。

当我点击第一页上的添加按钮时，它在整个加载列表的过程中保持高亮显示，只有当列表加载到内存中时第二页才会打开。

我希望用户单击“添加”按钮后立即打开第二个页面，并显示 ProgressRing 而不是 ListView，这是运行数据加载的时间。

我试图在第一页放一个 ProgressRing：

private void AddFavori_Click(object sender, RoutedEventArgs e)
{
    MyProgressRing.Visibility = Visibility.Visible;
    Frame.Navigate(typeof(ChoixFavoris), currentListeAchat);
}

但是，没有显示任何内容。第二页也是一样的：

public ChoixFavoris()
{
    this.InitializeComponent();
    MyProgressRing.Visibility = Visibility.Visible;
}

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    currentListeAchat = e.Parameter as ListeAchats;
    textBlock.Text = currentListeAchat.NomListe;
    majtableArticles();
    //
    base.OnNavigatedTo(e);
    // Register for hardware and software back request from the system
    SystemNavigationManager systemNavigationManager = SystemNavigationManager.GetForCurrentView();
    systemNavigationManager.BackRequested += OnBackRequested;
    MyProgressRing.Visibility = Visibility.Collapsed;
}

怎么做？感谢任何可以帮助我的人。

【问题讨论】：

标签： uwp progress-bar

【解决方案1】：

我希望用户单击“添加”按钮后立即打开第二个页面，并显示 ProgressRing 而不是 ListView，这是运行数据加载的时间。我试图在第一页上放一个 ProgressRing：

您最好将majtableArticles() 方法设为异步方法。并且将 ProgressRing 控件放在第二页会更好。

如果您不知道如何制作异步方法，请参阅Asynchronous programming。

我制作了一个简单的代码示例供您参考。我只是用await Task.Delay(10000)来模拟你耗时的加载数据操作。

//MainPage.xaml.cs
private void Button_Click(object sender, RoutedEventArgs e)
{
    Frame.Navigate(typeof(BlankPage1));
}

<!--BalnkPage1.xaml-->
<Grid>
    <ProgressRing x:Name="progressring" Height="100" Width="100" Visibility="Collapsed" IsActive="False"></ProgressRing>
</Grid>

protected async override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);
    progressring.IsActive = true;
    progressring.Visibility = Visibility.Visible;
    await Task.Delay(10000);
    progressring.IsActive = false;
    progressring.Visibility = Visibility.Collapsed;
}

[2018/8/1 更新]

@Marcel Delhaye 这只是一个关于如何将同步方法转换为异步方法的简单示例。

private void Test()
{
    while (true)
    {
        Debug.WriteLine(DateTime.Now);
    }
}

private async Task TestAsync()
{
    await Task.Run(() => {
        while (true)
        {
            Debug.WriteLine(DateTime.Now);
        }
    });
}

//on BalnkPage1.xaml.cs
protected async override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);
    progressring.IsActive = true;
    progressring.Visibility = Visibility.Visible;
    await TestAsync(); 
    progressring.IsActive = false;
    progressring.Visibility = Visibility.Collapsed;
}

【讨论】：

非常感谢您的回复。问题是数据加载（MajtableArticles () 方法）不包含我可以用 await 调用的 API。所以我不明白如何使这个方法异步。我绕过了这个问题，在第一页添加了我在页面上找到的代码：Https://stackoverflow.com/questions/29381626/… 这不是很好，但是用户并没有感觉程序崩溃了。还是谢谢。
@MarcelDelhaye 为什么您认为不能创建异步方法？仅仅因为您没有可等待的方法吗？这是不正确的。请看我更新的回复。我做了一个示例，向您展示如何简单地将同步方法转换为异步方法。
我按照您的示例将更改应用于我的应用程序。当我运行程序时，它在我的异步渲染方法的一行上崩溃：消息=应用程序调用了一个接口，该接口被维护以用于不同的线程。我应该怎么办？无论如何，非常感谢您的建议。
@MarcelDelhaye 这条线是否触及应用程序的用户界面？如果是这样，您需要使用CoreDispatcher.RunAsync。

【解决方案2】：

我在第一页添加了这段代码：

private async void AddFavori_Click(object sender, RoutedEventArgs e)
{
    await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
    {
        MyProgressRing.IsActive = true;
    });
    await Task.Delay(1000);

    Frame.Navigate(typeof(ChoixFavoris), currentListeAchat);

    await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
    {
        MyProgressRing.IsActive = false;
    });
}

另外，在数据加载期间，我在第一页上有 ProgressRing。

【讨论】：