如何在.NET MAUI中实现等待指示器（Activity/Wait Indicator）？

1. 在XAML布局中添加ActivityIndicator控件 #

首先在你的页面XAML里加入ActivityIndicator，把它放在Grid或AbsoluteLayout中，让它居中显示在页面内容上方：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="YourAppNamespace.YourPage">
    <Grid>
        <!-- 页面原有内容 -->
        <Label Text="主内容区域" HorizontalOptions="Center" VerticalOptions="Center"/>
        
        <!-- 等待指示器 -->
        <ActivityIndicator x:Name="LoadingIndicator"
                           Color="#2563EB"
                           IsRunning="False"
                           HorizontalOptions="Center"
                           VerticalOptions="Center"/>
    </Grid>
</ContentPage>

默认IsRunning设为False隐藏指示器，Color可替换成你的主题色。

2. 控制指示器的显示与隐藏 #

方式一：后台代码直接控制

在页面的.cs文件中，触发耗时操作时开启指示器，操作完成后关闭：

private async void StartLongOperation(object sender, EventArgs e)
{
    // 开启等待指示器
    LoadingIndicator.IsRunning = true;
    
    try
    {
        // 替换成你的实际耗时业务逻辑
        await Task.Run(() =>
        {
            Thread.Sleep(3000);
        });
    }
    finally
    {
        // 无论操作成功/失败都关闭指示器
        LoadingIndicator.IsRunning = false;
    }
}

注意：耗时操作必须放在Task.Run中，避免阻塞UI线程导致页面卡死。

方式二：MVVM模式下绑定控制

如果用MVVM开发，在ViewModel中定义实现INotifyPropertyChanged的属性：

public class YourViewModel : INotifyPropertyChanged
{
    private bool _isBusy;
    public bool IsBusy
    {
        get => _isBusy;
        set
        {
            _isBusy = value;
            OnPropertyChanged();
        }
    }

    public async Task ExecuteLongOperation()
    {
        IsBusy = true;
        try
        {
            await Task.Run(() => Thread.Sleep(3000));
        }
        finally
        {
            IsBusy = false;
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

然后在XAML中绑定IsRunning到ViewModel的IsBusy属性：

<ActivityIndicator IsRunning="{Binding IsBusy}"
                   Color="#2563EB"
                   HorizontalOptions="Center"
                   VerticalOptions="Center"/>

记得在页面构造函数中设置BindingContext：

public YourPage()
{
    InitializeComponent();
    BindingContext = new YourViewModel();
}

3. 进阶：添加半透明遮罩（可选） #

为了防止用户在等待时操作页面，给指示器加上半透明背景遮罩，用Grid分层实现：

<Grid>
    <!-- 页面原有内容 -->
    <StackLayout>
        <Label Text="主内容"/>
        <Button Text="开始操作" Command="{Binding ExecuteLongOperationCommand}"/>
    </StackLayout>
    
    <!-- 遮罩+指示器 -->
    <Grid IsVisible="{Binding IsBusy}" BackgroundColor="#80000000">
        <ActivityIndicator Color="White" IsRunning="True" HorizontalOptions="Center" VerticalOptions="Center"/>
    </Grid>
</ContentPage>

遮罩的BackgroundColor用#80000000表示半透明黑色，既提示等待状态，又能隐约看到下方内容。

内容的提问来源于stack exchange，提问作者balintn