WPF数据加载时添加进度条

XML 复制代码
<Window x:Class="YourNamespace.YourWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="YourWindow" Height="350" Width="525">
    <Grid>
        <!-- 其他UI元素 -->

        <!-- 透明的覆盖层,显示在页面上方,包含进度条 -->
        <Grid Visibility="{Binding IsLoading, Converter={StaticResource BoolToVisibilityConverter}}" 
              Background="Transparent" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ZIndex="1">
            <Border Background="Black" Opacity="0.5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                <!-- 进度条居中显示 -->
                <ProgressBar x:Name="LoadingProgressBar"
                             IsIndeterminate="True"
                             Height="100" 
                             Width="200" 
                             HorizontalAlignment="Center"
                             VerticalAlignment="Center" 
                             Margin="0, 50, 0, 0" />
            </Border>
        </Grid>

        <!-- 后面的UI元素 -->
        <StackPanel VerticalAlignment="Top" HorizontalAlignment="Left" ZIndex="0">
            <TextBlock Text="Your content goes here..." />
            <!-- 更多元素 -->
        </StackPanel>
        
    </Grid>
</Window>

viewModel代码

cs 复制代码
 // 控制进度条的可见性
 [ObservableProperty]
 private Visibility isLoading = Visibility.Collapsed; // 默认不显示进度条

private void ChangeLoadingStatus(bool isLoading) {

    if (isLoading)
    {
        IsLoading = Visibility.Visible;
    }
    else
    {
        IsLoading = Visibility.Collapsed;
    }

}

[RelayCommand]
private  async void SelectInfo()
{
  string sql ="....."
  ChangeLoadingStatus(true);
  
  var result = await Task.Run(() => dal.db.SqlQueryable<ToolStr50>(sql).ToList());

  ChangeLoadingStatus(false); 

}

页面效果

相关推荐
code_shenbing5 小时前
WPF实现打印机控制及打印
wpf
小盼江8 小时前
水果生鲜农产品推荐系统 协同过滤余弦函数推荐水果生鲜农产品 Springboot Vue Element-UI前后端分离 代码+开发文档+视频教程
vue.js·spring boot·ui
-优势在我12 小时前
Android TabLayout 实现随意控制item之间的间距
android·java·ui
界面开发小八哥1 天前
界面组件DevExpress WPF中文教程:Grid - 如何显示和隐藏列?
wpf·界面控件·devexpress·ui开发·.net9
虚假程序设计1 天前
python用 PythonNet 从 Python 调用 WPF 类库 UI 用XAML
python·ui·wpf
落落落sss1 天前
MongoDB
数据库·windows·redis·mongodb·微服务·wpf
蒋劲豪1 天前
WPF项目暴露WebApi接口;WinForm项目暴露WebApi接口;C#项目暴露WebApi接口;
开发语言·c#·wpf
敢嗣先锋1 天前
鸿蒙5.0实战案例:基于原生能力的深色模式适配
ui·移动开发·harmonyos·arkui·组件化·鸿蒙开发
柳鲲鹏1 天前
Ubuntu编译jetlinks-ui-vue
vue.js·ui
狮歌~资深攻城狮2 天前
未来已来:HBase的新功能与发展趋势展望
大数据·wpf·hbase