示例:WPF中使用IsAsync的方式绑定数据来优化用户体验

一、目的:开发过程中,有时需要绑定大量数据,比如弹出一个窗口,窗口中包含一个ListBox绑定了大量数据,这时会出现点击按钮后出现假死卡顿影响用户体验,这理通过用IsAsync的方式将窗口优先弹出来再加载数据


二、演示


在未使用IsAsync绑定的效果

可以看到,点击按钮时卡了一会才弹出窗口显示数据,代码如下

 首先,生成10000条数据

    internal class MainViewModel : NotifyPropertyChangedBase
    {
        private ObservableCollection<string> _collection = new ObservableCollection<string>();
        public ObservableCollection<string> Collection
        {
            get { return _collection; }
            set
            {
                _collection = value;
                RaisePropertyChanged("Collection");
            }
        }

        public MainViewModel()
        {
            var source = Enumerable.Range(0, 10000).Select(x => x.ToString()).ToObservable();
            this.Collection = source;
        }
    }

之后直接绑定到ListBox

        <ListBox ItemsSource="{Binding Collection}"  
                 VirtualizingPanel.IsVirtualizing="False">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="1.jpeg"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ListBox>

下面演示用IsAnsyc的方式绑定效果

 

可以看到窗口会立即弹出来,之后去加载数据,代码如下

        <ListBox ItemsSource="{Binding Collection,IsAsync=True}"  
                 VirtualizingPanel.IsVirtualizing="False">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Image Source="1.jpeg"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ListBox>

 其中{Binding Collection,IsAsync=True}就是启用IsAsync功能。

本质上启动页面后还是会卡,但用户体验不同,可以在窗口上加一个“正在加载,请等待”,让用户知道这块需要等待一下,而不是感觉程序崩溃掉了。

原理跟BeiginInvoke类似,优先去弹出窗口,后面去加载数据,在不需要立即显示的数据上可以应用IsAsync功能已达到优化加载体验的效果。

三、环境

 VS2022

四、示例

五、需要了解的知识点

Binding.IsAsync 属性 (System.Windows.Data) | Microsoft Learn

六、源码地址

GitHub - HeBianGu/WPF-ControlDemo: 示例

GitHub - HeBianGu/WPF-ControlBase: Wpf封装的自定义控件资源库

GitHub - HeBianGu/WPF-Control: WPF轻量控件和皮肤库

七、了解更多

System.Windows.Controls 命名空间 | Microsoft Learn

https://github.com/HeBianGu

HeBianGu的个人空间-HeBianGu个人主页-哔哩哔哩视频

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/728652.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

AWS Lambda + Flask 应用示例

前言 AWS Lambda 本身是一个以事件驱动的 Serverless 服务, 最简单的应用就是在入口函数中对接收到的事件/请求进行处理并返回响应. 对于像 Flask 这样的 Web 框架, 并不能直接在 Lambda 上提供服务, 不过我们可以借助 AWS Lambda Web Adapter 实现一个基于 Flask 框架的 Web …

ThinkPHP:查询数据库数据之后,更改查询数据的字段名称

一、原始查询数据 含有字段item_no&#xff0c;lot_num&#xff0c;position $data[brushed] db::table(wip_station_transaction) ->where([wip_entity_name>$wip_entity_name,line_code>$line_code,]) ->field([item_no, lot_num, position]) ->select(); …

python 霍夫曼解码

Huffman Tree 进行解码 示例图 c语言&#xff1a;c语言 霍夫曼编码 | 贪婪算法&#xff08;Huffman Coding | Greedy Algo&#xff09;_霍夫曼的贪婪c语言-CSDN博客 c&#xff1a;c 霍夫曼编码 | 贪婪算法&#xff08;Huffman Coding | Greedy Algo&#xff09;_霍夫曼的贪…

适用于所有 Android 手机的 8 大 Android 解锁工具

有时您无法解锁手机&#xff0c;因为您忘记了密码或设备停止响应解锁图案。不要惊慌。我们在这里为您列出了最好的 Android 解锁工具。只需选择一个您喜欢的。 为了保护重要数据&#xff0c;许多手机用户倾向于使用图案锁、密码、指纹甚至面部识别来锁定设备。但有时&#xff…

docker 配置与使用

目录 安装docker 作者遇到的问题1&#xff1a;安装docker 错误说明 解决方法&#xff1a; 作者遇到问题2&#xff1a;GPG密钥问题 问题说明 解决方法&#xff1a; 方法一&#xff1a;使用备用的GPG密钥服务器 方法二&#xff1a;使用国内镜像源 方法3&#xff1a;手动下…

关于IntelliJ IDEA 2024.1版本更新的问题

希望文章能给到你启发和灵感&#xff5e; 感谢支持和关注&#xff5e; 阅读指南 序幕一、基础环境说明1.1 硬件环境1.2 软件环境 二、起因三、解决四、总结 序幕 近期&#xff0c;IntelliJ IDEA 推出了全新2024版本&#xff0c;相信很多编程的爱好者或者刚接触编程的小伙伴都会…

论文阅读--Cross-view Transformers for real-time Map-view Semantic Segmentation

一种新的2D维度的bev特征提取方案&#xff0c;其通过引入相机先验信息&#xff08;相机内参和外参&#xff09;构建了一个多视图交叉注意力机制&#xff0c;能够将多视图特征映射为BEV特征。 cross view attention&#xff1a;BEV位置编码由根据相机标定结果&#xff08;内参和…

工业制造领涉及的8大常见管理系统,如mes、scada、aps、wms等

在工业生产和制造领域有一些常见的管理系统&#xff0c;很多小伙伴分不清&#xff0c;这次大美B端工场带领大家了解清楚。 MES&#xff08;Manufacturing Execution System&#xff0c;制造执行系统&#xff09;&#xff1a; MES是一种用于监控、控制和优化生产过程的软件系统…

商超仓库管理系统

摘要 随着全球经济和互联网技术的快速发展&#xff0c;依靠互联网技术的各种管理系统逐渐应用到社会的方方面面。各行业的有识之士都逐渐开始意识到过去传统的人工管理模式已经逐渐成为企业发展的绊脚石&#xff0c;不再适应现代企业的发展需要。企业想要得到更好的发展&#…

异地如何共享视频文件?

人们对于信息流动的需求越来越高。尤其在分布式团队合作、远程办公的背景下&#xff0c;异地共享视频文件成为了一项重要的技术需求。本文将介绍一款名为【天联】的组网产品&#xff0c;它能够实现不同地区间快速组建局域网&#xff0c;解决不同设备间的信息远程通信问题。 2.…

【C++题解】1741 - 求出1~n中满足条件的数的个数和总和?

问题&#xff1a;1741 - 求出1~n中满足条件的数的个数和总和&#xff1f; 类型&#xff1a;简单循环 题目描述&#xff1a; 请求出 1∼n 之间所有满足 2 的倍数但不是 3 的倍数的数&#xff0c;有多少个&#xff0c;总和是多少&#xff1f; 输入&#xff1a; 读入一个整数 …

【SpringMVC】第1-7章

第1章 初始SpringMVC 1.1 学习本套教程前的知识储备 JavaSEHTMLCSSJavaScriptVueAJAX axiosThymeleafServletMavenSpring 1.2 什么是MVC MVC架构模式相关课程&#xff0c;在老杜的JavaWeb课程中已经详细的讲解了&#xff0c;如果没有学过的&#xff0c;可以看这个视频&…

PostgreSQL的学习心得和知识总结(一百四十六)|深入理解PostgreSQL数据库之客户端侧auto savepoint的使用和实现

目录结构 注&#xff1a;提前言明 本文借鉴了以下博主、书籍或网站的内容&#xff0c;其列表如下&#xff1a; 1、参考书籍&#xff1a;《PostgreSQL数据库内核分析》 2、参考书籍&#xff1a;《数据库事务处理的艺术&#xff1a;事务管理与并发控制》 3、PostgreSQL数据库仓库…

计算机网络:应用层 - 文件传输协议 FTP 电子邮件

计算机网络&#xff1a;应用层 - 文件传输协议 FTP & 电子邮件 文件传输协议 FTP电子邮件 文件传输协议 FTP 文件传送协议 FTP(File Transfer Protocol)&#xff0c;曾是互联网祝频讲解上使用得最广泛的文件传送协议。 其特点是&#xff1a;若要存取一个文件&#xff0c;…

前端基础操作1——利用nvm任意切换(管理)node版本

在实际前端项目开发过程中&#xff0c;同时开发多个项目或者切换新项目时&#xff0c;因为node版本问题造成项目无法运行的问题比比皆是&#xff0c;这时候通过nvm管理切换不同版本的node&#xff0c;就能很快进入开发模式&#xff0c;避免因为环境问题浪费大量精力&#xff0c…

hive on spark 的架构和常见问题 - hive on spark 使用的是 yarn client 模式还是 yarn cluster 模式?

hive on spark 的架构和常见问题 - hive on spark 使用的是 yarn client 模式还是 yarn cluster 模式&#xff1f; 1. 回顾下 spark 的架构图和部署模式 来自官方的经典的 spark 架构图如下&#xff1a; 上述架构图&#xff0c;从进程的角度来讲&#xff0c;有四个角色/组件&…

[C++][数据结构][B-树][上]详细讲解

目录 0.常见的搜索结构1.B树概念2.B-树的插入分析1.流程分析2.插入过程总结 0.常见的搜索结构 种类数据格式时间复杂度顺序查找无要求 O ( N ) O(N) O(N)二分查找有序 O ( l o g 2 N ) O(log_2 N) O(log2​N)二叉搜索树无要求 O ( N ) O(N) O(N)二叉平衡树无要求 O ( l o g 2 …

20212416 2023-2024-2 《移动平台开发与实践》综合实践

移动平台开放综合实践 1.实验内容2.实验过程2.1 确定基础功能2.2 设计UI界面2.3 编写程序运行代码2.4 在基本功能的基础上丰富功能 3. 代码分析3.1设置按钮的点击事件监听器3.2 比分更新模块3.3 比分存储模块 4. 运行结果5.实践中遇到的问题及解决6.学习感悟与思考参考资料 1.实…

k8s中 docker和containerd 镜像相互导入导出

containerd镜像导出并导入docker 1 查看containerd 本地镜像列表 crictl images 2 containerd 导出本地镜像到当前目录下&#xff08;注意&#xff1a; 导出导入需要指定镜像平台类型 --platform&#xff09; ctr -n k8s.io images export nacos-server-24-06-30-13-02-…

【windows|007】DHCP服务详解

&#x1f341;博主简介&#xff1a; &#x1f3c5;云计算领域优质创作者 &#x1f3c5;2022年CSDN新星计划python赛道第一名 &#x1f3c5;2022年CSDN原力计划优质作者 ​ &#x1f3c5;阿里云ACE认证高级工程师 ​ &#x1f3c5;阿里云开发者社区专家博主 &#x1f48a;交流社…