UWP开发:异步方法返回集合的数据绑定问题

——最近在做UWP开发,其中请求API数据的时候,往往是通过异步请求网络,再处理json数据,返回集合对象。通常,我们的做法是将集合数据在ViewModel层进行处理,让ViewModel实现ObservableCollection接口,然后在View层后台实例化ViewModel对象,前台绑定对象。这样就实现了集合的绑定和通知。这里需要注意,集合的绑定,不单单是绑定,而且要实现绑定通知,才算真正的绑定。

为什么这么说呢?看一下在开发中遇到的问题:

由于一个简单的页面,需要绑定一组集合数据,因为这个界面过于简单,我觉得麻烦,就没有“按套路出牌”,即没有通过ViewModel层实现集合通知。而是通过list直接绑定到界面,后台代码如下,其中通过页面的OnNavigationTo方法用集合list接收异步方法返回的集合数据。

在前台绑定list。这样按理来说,就完成了集合的绑定。但是,结果是不行的。数据并没有显示在界面上。

那么,List集合是不能绑定到前台显示的吗?

于是我去问一另一位搞uwp开发大神-Script,结果他做了一个测试,而且显示List集合是可以绑定到界面上的,如下图:

在OnNavigationTo方法里模拟获取集合,在构造函数里初始化。结果显示绑定成功了!界面上可以正常显示。

那么问题来了,为什么我的绑定不成功呢?

细心的话,可以看到,我的数据请求用的是异步返回数据的方法。而Script大神一开始测试用的是同步,当Script大神将自己的方法改为异步后:

是的,数据绑定失效了。

问题就是出在了异步和同步。那么,为什么同样是list集合,异步方法,绑定会失效,而同步方法的话绑定就可以呢?

其实,还是因为自己没弄清数据绑定的实质,前面说了,数据绑定, 不仅仅是绑定,还要实现数据的变更通知。

同步方法在执行时,会卡在OnNavigationTo方法那里,直到返回数据,才进入界面。当进入界面时,此时,list里面已经有了数据。所以,在前台就可以看到绑定的数据。

异步方法在执行时,会异步加载数据,同时不影响绑定的进行,也就是说,在数据还没有返回的时候,绑定已经完成了,也进入界面了,list此时的值还是null,因为异步方法此时还没有返回数据,而此时,前台就显示的没有内容,当异步方法执行完毕,返回集合数据的时候,由于用的是list集合,而list集合是不具有自动通知前台更新数据的能力。所以,此时,即使list内已经得到了集合数据,但是前台显示的还是空白。明白了吗?

所以,还是乖乖地用ObservableCollection接口比较好!

通过以上的分析,终于明白了问题所在。,对数据绑定,异步加载,等方面的理解也更深了一步。心中的疑惑总算是解决了。好了,时间也不早了,好长时间1点以前没睡过觉了,不过每天能写下自己的学习中的收获,真的很好!如果您也是uwp爱好者,或者有什么疑问,欢迎加入uwp开发交流群:193148992。共同学习交流。

——IT追梦园

时间: 2024-10-12 09:01:44

UWP开发:异步方法返回集合的数据绑定问题的相关文章

uwp开发:MVVM模式和数据绑定结合使用实战示例

——我的<简影uwp>开发了一段时间了,现在各个板块和基本功能已经完工,剩下的就是细节方面的处理和UI排版设计了.开发期间遇到过很多问题,由于是个人独立开发.所以好多问题需要自己想好长时间,或者去网上寻找大神求助,有时候晚上做梦都是满脑子的代码.好的是大部分最终都解决了!真的非常感谢那些帮助我的大神们,和他们交流,我学到了很多... 好了,闲话不多说,前几天,我处理的是集合数据绑定的问题,也就是说返回的是一个集合数据,用MVVM模式来说,让ViewModel层实现ObservableColle

uwp开发:数据绑定——值转换器 的简单使用

今天,我在做最近正在开发的“简影”uwp应用时遇到一个问题,其中有个栏目,叫做“画报”,是分组显示一组一组的 图片,每组图片在界面上只显示9个,点击去以后显示该组的所有图片. 其中,Model 如下: 画报类,其中有个属性是图片类集合. 在View界面,通过ListView嵌套绑定GridView 如下: 但是,要求是每项只能显示9张图片,而集合内的数据不止9张,如果这样直接绑定到GridView上,那么会将ImagList里面的所以图片都显示出来,那么,要想每项都显示9张.这时候,该怎么办呢?

UWP开发:网络请求数据返回:Id =42 , Status = WaitingForActivation, Method = “{null}”, Result = “{Not yet computed}

今天突然遇到一个问题,UWP中网络请求返回:Id = 42, Status = WaitingForActivation, Method = "{null}", Result = "{Not yet computed}. 请求api是正确的,在浏览器内测试可以请求到数据,但是执行程序就是获取不了正确数据.郁闷了半天,突然才发现,由于我写的是异步网络请求的方法,而在调用时,忘记加 await async 关键字,导致没有异步调用.所以返回了Id = 42, Status = W

uwp开发:数据模板选择器

这两天,在做<简影uwp>的首页推荐版块时,用到了数据模板选择器,所以简单介绍一下.数据模板选择器.顾名思义,就是可以选择性的展示不同的数据模板.那么,什么时候用数据模板选择器?怎么用呢?往下看: 应用场景: 同样是以我目前正在做的<简影uwp>为例,在做首页推荐版块时,要展示的数据是不同的版块的,都放在了一个集合中,这样的话,如果直接将数据绑定到ListView或者GridView上显示的话,是不可取的.虽然这些数据在一个集合内,但是因为集合内每个种类都不一样,显示的方式,展示的

UWP开发入门(二十一)——保持Ui线程处于响应状态

GUI的程序有时候会因为等待一个耗时操作完成,导致界面卡死.本篇我们就UWP开发中可能遇到的情况,来讨论如何优化处理. 假设当前存在点击按钮跳转页面的操作,通过按钮打开的新页面,在初始化过程中存在一些耗时的操作. public void OnNavigatedTo(object obj) { var watch = new Stopwatch(); Debug.WriteLine("---------------Start"); watch.Start(); //假设耗时1秒 DoBu

uwp开发:Slider控件和MediaElement绑定,实现拖动播放。

1.实现原理: Slider拖动时,Value值改变,MediaElement播放时,Position值改变.所以,只需将Slider的Value属性和MediaElement的Position属性进行绑定即可. 2.实现方法: Slider的Value属性是double类型的,而MediaElement的Position属性是Timespan类型的,要绑定这两种不同类型的的话,就要用到Converter了,即值转换器.关于值转换器,可以百度,或者看IT追梦圆我写的这篇文章:数据绑定——值转换器

uwp开发:截取当前屏幕中需要的图像并保存至应用内存储

在uwp开发中,有时候需要获取当前屏幕中的图像信息,但是又不适合直接截图保存,因为截图会保存整个屏幕的图像,而且,还需要用户会截屏操作.总之不适合获取屏幕中需要的图像信息.注意题目中的“需要的”. 意思是什么呢?就是我们可以获取当前屏幕中任意一个UIElement中的图像.废话不多说,还是以实战场景为例,因为自己最近就遇到了这种情况. 在做<简影UWP>的“电影台词”模块的时候,显示如下: 需求是:是用户点击保存图片,将会把图片和文字一块保存下来,查看的时候,也是当前显示的这样. 首先贴上前台

UWP开发入门(二十三)——WebView

本篇讨论在UWP开发中使用WebView控件时常见的问题,以及一些小技巧. WebView是实际开发中常用的控件,很多大家抱怨的套网页的应用都是通过WebView来实现的.这里要澄清一个问题,套网页的应用并不一定是差的应用,很多网页采用了响应式设计,假设网页不存在复杂的交互,提取网页的正文部分嵌入WebView,可以说方便快捷省时省力.比如亚马逊.驴妈妈这些UWP APP都还挺不错的,京东那个网页就套的比较差了…… WebView最为简单的用法如下: <WebView Source="ht

Win10 UWP开发系列:使用VS2015 Update2+ionic开发第一个Cordova App

安装VS2015 Update2的过程是非常曲折的.还好经过不懈的努力,终于折腾成功了. 如果开发Cordova项目的话,推荐大家用一下ionic这个框架,效果还不错.对于Cordova.PhoneGap.ionic.AngularJS这些框架或库的关系,我个人理解是这样,PhoneGap是一个商业项目,用来实现HTML5式的跨平台开发,后来Adobe公司将其中的核心代码开源,就是Cordova,Cordova只负责实现JavaScript调用原生代码的功能,是一个壳,而壳里具体用什么样式,在H