Jak wyświetlić animację ładowania dla aplikacji uniwersalnego sklepu Windows Phone 8.1?

Question

Podczas wykonywania funkcji asynchronicznej w celu uzyskania lokalnych danych, uzyskania dostępu do pliku lub wywołania interfejsu API, w jaki sposób uruchamia się animację ładowania podczas tej, prawdopodobnie długiej procedury?

Oto przykład:

<Button onClick="Button_Click" /> 

public async void Button_Click(object sender, RoutedEventArgs e) 
{ 
    var myData = await MyDataManager.GetMyData(); 
    await new MessageDiaglog("Data Loaded!").ShowAsync(); 
} 

Ponieważ jest to uniwersalny app store, zakładam, że to powinno działać tak samo w obu oknach 8.1 i Windows Phone 8.1.

UPDATE z roztworu

Per odpowiedź igrali, ja updated mój kod do wykorzystania w przyszłości:

<ProgressBar x:Name="LoadingBar" Visibility="Collapsed" IsEnabled="False" IsIndeterminate="true" Height="4" HorizontalAlignment="Stretch"/> 
<Button onClick="Button_Click" /> 

public async void Button_Click(object sender, RoutedEventArgs e) 
{ 
    LoadingBar.IsEnabled = true; 
    LoadingBar.Visibility = Visibility.Visible; 
    var myData = await MyDataManager.GetMyData(); 
    await new MessageDiaglog("Data Loaded!").ShowAsync(); 
    LoadingBar.IsEnabled = false; 
    LoadingBar.Visibility = Visibility.Collapsed; 
} 

Ten kod będzie działać zarówno na telefonie lub tablecie.

Answer 1

Istnieje dość standardowy sposób robienia tego w systemie Windows Phone. Ponieważ jest to aplikacja uniwersalna, prawdopodobnie najlepszym wyborem jest pokazanie pierścienia postępu.

dodać go w XAML

<ProgressRing IsActive="True"/> 

Można go pokazać jawnie w kodzie tyłu po naciśnięciu przycisku lub użyj właściwość bool w viewmodel (jeśli używasz MVVM) i ValueConverter aby pokazać lub ukryj go po prostu zmieniając jedną właściwość z true na false i na odwrót.

Proponuję także czytanie oficjalnej dokumentacji about progress controls i Skończę tę odpowiedź z końcówką z dokumentacją ProgressRing że can be found here

ustawić właściwość IsActive obrócić ProgressRing włączyć lub wyłączyć. Jeśli IsActive ma wartość false, ProgressRing nie jest wyświetlany, ale miejsce na dysku zarezerwowane jest dla niego w układzie interfejsu użytkownika. Aby nie zarezerwować miejsca dla funkcji ProgressRing , ustaw właściwość Visibility na Collapsed.

Wskazówka Gdy ProgressRing jest aktywny, animacja postępu jest kontynuowana , nawet jeśli nie jest widoczna na ekranie, na przykład gdy widoczność jest Zwinięta. Dzięki temu wątek interfejsu użytkownika może się obudzić, korzystać z zasobów i obniżyć wydajność aplikacji. Gdy funkcja ProgressRing nie jest widoczna, należy wyłączyć animację, ustawiając wartość IsActive na wartość false.