.NET MAUI: Ladeanzeige mit ActivityIndicator

Auf einen Blick

Gilt für	.NET MAUI 9/10, CommunityToolkit.Mvvm 8.x
Bereich	Softwareentwicklung
Dauer	ca. 15 Minuten
Rechte	Entwicklungsumgebung
Stand	Oktober 2026

Eine Ladeanzeige in .NET MAUI zeigt dem Benutzer, dass die App gerade Daten lädt – etwa beim Abruf einer Kundenliste aus dem Netz. Mit einer IsBusy-Eigenschaft im ViewModel und einem daran gebundenen ActivityIndicator entsteht die Anzeige einmal in XAML und funktioniert auf Android, iOS und Windows gleichermaßen. Die frühere Xamarin-Lösung mit getrenntem Code für ProgressBar und UIActivityIndicatorView entfällt.

Ladeanzeige in .NET MAUI: IsBusy im ViewModel steuert per Binding den ActivityIndicator; finally setzt die Anzeige auch bei Fehlern zurück.

ViewModel mit IsBusy

Mit dem CommunityToolkit.Mvvm erzeugt ein Attribut die Eigenschaften samt Änderungsbenachrichtigung automatisch:

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;

public partial class KundenViewModel(IKundenService kundenService) : ObservableObject
{
    [ObservableProperty]
    [NotifyPropertyChangedFor(nameof(IsNotBusy))]
    private bool isBusy;

    [ObservableProperty]
    private string? fehlermeldung;

    public bool IsNotBusy => !IsBusy;

    public ObservableCollection<Kunde> Kunden { get; } = [];

    [RelayCommand]
    private async Task LadenAsync(int landId)
    {
        if (IsBusy) return;                       // Doppelklick verhindern
        try
        {
            IsBusy = true;
            Fehlermeldung = null;
            Kunden.Clear();
            foreach (var k in await kundenService.GetKundenNachLandAsync(landId))
                Kunden.Add(k);
        }
        catch (Exception ex)
        {
            Fehlermeldung = "Daten konnten nicht geladen werden.";
            System.Diagnostics.Debug.WriteLine(ex);
        }
        finally
        {
            IsBusy = false;                       // auch bei Fehlern zurücksetzen
        }
    }
}

Das Attribut [RelayCommand] erzeugt den Befehl LadenCommand; die Methode ist async Task statt async void, damit Ausnahmen nicht verloren gehen.

Oberfläche in XAML

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:vm="clr-namespace:MeineApp.ViewModels"
             x:Class="MeineApp.Views.KundenPage"
             x:DataType="vm:KundenViewModel">
    <Grid>
        <CollectionView ItemsSource="{Binding Kunden}"
                        IsVisible="{Binding IsNotBusy}">
            <!-- ItemTemplate … -->
        </CollectionView>

        <ActivityIndicator IsRunning="{Binding IsBusy}"
                           IsVisible="{Binding IsBusy}"
                           Color="{StaticResource Primary}"
                           HorizontalOptions="Center"
                           VerticalOptions="Center" />

        <Label Text="{Binding Fehlermeldung}" TextColor="Red"
               VerticalOptions="End" Margin="16" />
    </Grid>
</ContentPage>

x:DataType aktiviert kompilierte Bindungen – schneller und mit Fehlerprüfung beim Build.

Laden beim Öffnen der Seite

protected override async void OnAppearing()
{
    base.OnAppearing();
    if (BindingContext is KundenViewModel vm && vm.Kunden.Count == 0)
        await vm.LadenCommand.ExecuteAsync(49);   // Beispiel: Land-ID
}

Alternative: Pull-to-Refresh

Für Listen, die der Benutzer selbst aktualisieren soll, ist ein RefreshView oft eleganter – er bringt eine eigene Ladeanimation mit:

<RefreshView IsRefreshing="{Binding IsBusy}" Command="{Binding LadenCommand}">
    <CollectionView ItemsSource="{Binding Kunden}" />
</RefreshView>

Hinweise

• Nicht Page.IsBusy verwenden: Die eingebaute Eigenschaft der Seite ist in .NET MAUI 10 als veraltet markiert. Eine eigene IsBusy-Eigenschaft im ViewModel wie oben ist der empfohlene Weg.
• CollectionView statt ListView: ListView ist in .NET 10 ebenfalls veraltet.
• Lange Vorgänge: Bei Ladezeiten über einigen Sekunden zusätzlich einen Abbrechen-Knopf und einen Fortschrittstext anbieten.
• Bei der Entwicklung benutzerfreundlicher Apps unterstützt Sie die individuelle Softwareentwicklung von m.a.x. it.

Siehe auch

• .NET MAUI: MVVM mit dem CommunityToolkit.Mvvm statt MvvmLight
• Von Xamarin zu .NET MAUI migrieren
• Dependency Injection

Links und Quellen

• Microsoft Learn: ActivityIndicator in .NET MAUI
• Individuelle Softwareentwicklung und App-Entwicklung von m.a.x. it

Über m.a.x. it Die m.a.x. Informationstechnologie AG ist seit über 30 Jahren IT-Partner mittelständischer und großer Unternehmen in München und bietet maßgeschneiderte Lösungen und Services in den Bereichen Cloud, Cybersecurity, Netzwerk, Windows, Linux und Softwareentwicklung. Sie haben eine Frage zu diesem Artikel oder brauchen Unterstützung? Kontakt aufnehmen