什么是 『动态数据集合』 ?简而言之,就是当集合添加、删除项目或者重置时,能提供一种通知机制,告诉UI动态更新界面。有经验的程序员脑海里迸出的第一个词就是 ObservableCollection。没错,它在WPF中盛行其道,通过它开发者可以很方便的达到动态更新界面。要在Unity 3D中使用ObservableCollection还是有些许困难的,因为Mono并不提供ObservableCollection类。但实际上,自己动手去构建一个『动态数据集合』也非难事,核心在于怎样去传播通知。这也是本篇博客的主题。

实现自定义的ObservableList

既然核心在于构建通知机制,谈到『通知』两字,最常见的形式就是以委托或者事件形式将消息广播给监听者。遗憾的是,.NET中常见的集合数据结构List并不支持事件的通知。所以我在自定义的ObservableList中增加OnAdd,OnRemove,OnInsert事件,当集合添加或者删除项时,能广播通知给客户端UI界面。

以下图为例,当点击+时,『以数据驱动界面的形式』,动态的去更新UI界面:

既然要以数据来驱动界面,首先我们需要定义能存放数据的集合,它就是ObservableList,并且是实现了IList 接口:

  1. public class ObservableList<T>:IList<T>
  2. {
  3. //...省略部分代码...
  4. private List<T> _value=new List<T>();
  5. public delegate void AddHandler(T instance);
  6. public AddHandler OnAdd;
  7. public delegate void InsertHandler(int index,T instance);
  8. public InsertHandler OnInsert;
  9. public delegate void RemoveHandler(T instance);
  10. public RemoveHandler OnRemove;
  11. public void Add(T item)
  12. {
  13. _value.Add(item);
  14. if (OnAdd != null)
  15. {
  16. OnAdd(item);
  17. }
  18. }
  19. public bool Remove(T item)
  20. {
  21. if (_value.Remove(item))
  22. {
  23. if (OnRemove != null)
  24. {
  25. OnRemove(item);
  26. }
  27. return true;
  28. }
  29. return false;
  30. }
  31. public void Insert(int index, T item)
  32. {
  33. _value.Insert(index,item);
  34. if (OnInsert!=null)
  35. {
  36. OnInsert(index, item);
  37. }
  38. }
  39. }

可以看到,自定义的ObservableList实现了 IList 接口,并以泛型的形式约束了数据项类型。当添加或者删除项时,提供了以事件的形式告诉客户端UI界面 ,作为观察者的UI可以顺势做出相应的更新。

岔开话题说一下,为什么要用泛型,这是几天前有同学在群里问的?

  • 好处1:可以约束数据项的类型,让我们不用每时每刻去强转。比如你往ArrayList中添加了若干数据,因为ArrayList的数据项Item是万能的object,所以你每次取出来都需要将object转为你想要的对象,麻烦。
  • 好处2:减少运行时错误,因为是数据项是object,所以在编译时你可以将其强转为任何类型,但万一这个object实际是Datetime类型,但你强转为int,编译时是没问题的,但一运行就报错,泛型约束能有效减少这种情况

完善ObservableList

到目前为止,我们自定义的动态数据集合ObservableList是非常好的设计,但唯一不足的事,它不能支持初始化时通知UI界面更新。 『初始化』 这词可能有点太术语了,我翻译一下就是一般初始化一个List,我们都是像如下方式进行:

  1. public ObservableList<FaceBox> DataSource = new ObservableList<FaceBox>
  2. {
  3. new FaceBox
  4. {
  5. Name = "Eyes",
  6. Level = 10,
  7. Face = "Avatar201_Face",
  8. Badge = new Badge {Icon = "Icon_WeaponRod", ElementColor = "1CB9FFFF"}
  9. },
  10. new FaceBox
  11. {
  12. Name = "Jack",
  13. Level = 8,
  14. Face = "Avatar202_Face",
  15. Badge = new Badge {Icon = "Icon_WeaponSpear", ElementColor = "FF5821FF"}
  16. }
  17. };

显然这即没有触发OnAdd,也没有触发OnRemove等事件,那么初始化或者重置列表时,UI界面还是得不到更新。那我们怎么去解决呢?还记得第一章中BindableProperty吗?对了,解决方案就是它,对列表的初始化或者重置就是对Value进行改变。而BindableProperty内部提供了对Value值改变的监听,一旦Value改变了,将消息广播出去。

OK,我们增强一下ObservableList:

  1. public class ObservableList<T>:IList<T>
  2. {
  3. //省略部分代码...
  4. public delegate void ValueChangedHandler(List<T> oldValue, List<T> newValue);
  5. public ValueChangedHandler OnValueChanged;
  6. //预先初始化,内置的List,防止空异常
  7. private List<T> _value=new List<T>();
  8. public List<T> Value
  9. {
  10. get { return _value; }
  11. set
  12. {
  13. if (!Equals(_value, value))
  14. {
  15. var old = _value;
  16. _value = value;
  17. ValueChanged(old, _value);
  18. }
  19. }
  20. }
  21. private void ValueChanged(List<T> oldValue, List<T> newValue)
  22. {
  23. if (OnValueChanged != null)
  24. {
  25. OnValueChanged(oldValue, newValue);
  26. }
  27. }
  28. }

所以客户端UI界面只要对ObservableList的OnValueChanged事件进行监听,当初始化或者重置时,你也可以得到更新,演示效果如下:

小结

自定义的动态数据集合ObservableList看起来小巧,但五脏俱全,能提供通知机制,可以动态的去更新UI界面。 所有的一切都以数据的改变来驱动UI,这是非常重要的转变。所以看似代码复杂了,但实际上你只要关心数据即可。

源代码托管在Github上,点击此了解

Unity应用架构设计(6)——设计动态数据集合ObservableList的更多相关文章

  1. Unity 3D Framework Designing(6)——设计动态数据集合ObservableList

    什么是 『动态数据集合』 ?简而言之,就是当集合添加.删除项目或者重置时,能提供一种通知机制,告诉UI动态更新界面.有经验的程序员脑海里迸出的第一个词就是 ObservableCollection.没 ...

  2. silverlight,动态数据集合中,移除动态集合自身的内容

    在xaml的页面上创建一个x:Name为_list1的ListBox,其中ListBox里面的每一项是ListBoxItem if (_list1.SelectedItem == null)//如果_ ...

  3. MySql(十四):MySql架构设计——可扩展性设计之数据切分

    一.前言 通过 MySQL Replication 功能所实现的扩展总是会受到数据库大小的限制,一旦数据库过于庞大,尤其是当写入过于频繁,很难由一台主机支撑的时候,我们还是会面临到扩展瓶颈.这时候,我 ...

  4. MySql(十五):MySql架构设计——可扩展性设计之 Cache 与 Search 的利用

    前言 前面章节部分所分析的可扩展架构方案,基本上都是围绕在数据库自身来进行的,这样是否会使我们在寻求扩展性之路的思维受到“禁锢”,无法更为宽广的发散开来.这一章,我们就将跳出完全依靠数据库自身来改善扩 ...

  5. Java生鲜电商平台-商品基础业务架构设计-商品设计

    Java生鲜电商平台-商品基础业务架构设计-商品设计 在生鲜电商的商品中心,在电子商务公司一般是后台管理商品的地方.在前端而言,是商家为了展示商品信息给用户的地方,它是承担了商品的数据,订单,营销活动 ...

  6. zz《分布式服务架构 原理、设计与实战》综合

    这书以分布式微服务系统为主线,讲解了微服务架构设计.分布式一致性.性能优化等内容,并介绍了与微服务系统紧密联系的日志系统.全局调用链.容器化等. 还是一样,每一章摘抄一些自己觉得有用的内容,归纳整理, ...

  7. 认证鉴权与API权限控制在微服务架构中的设计与实现(四)

    引言: 本文系<认证鉴权与API权限控制在微服务架构中的设计与实现>系列的完结篇,前面三篇已经将认证鉴权与API权限控制的流程和主要细节讲解完.本文比较长,对这个系列进行收尾,主要内容包括 ...

  8. Java生鲜电商平台-App系统架构开发与设计

    Java生鲜电商平台-App系统架构开发与设计 说明:阅读此文,你可以学习到以下的技术分享 1.Java生鲜电商平台-App架构设计经验谈:接口的设计2.Java生鲜电商平台-App架构设计经验谈:技 ...

  9. ​grafana 的主体架构是如何设计的?

    ​grafana 的主体架构是如何设计的? grafana 是非常强大的可视化项目,它最早从 kibana 生成出来,渐渐也已经形成了自己的生态了.研究完 grafana 生态之后,只有一句话:可视化 ...

随机推荐

  1. 从小白到区块链工程师:第一阶段:Go语言的HelloWorld初始(2)

    四.写下第一段Go语言代码“Hello World” 小建议:就是文件夹路径或者文件名称不要出现中文,可能会导致一些不必要的麻烦(编译失败) 在sublime中,我们在src文件夹上面,单击右键“Ne ...

  2. am335x uboot2016.05 (MLO u-boot.img)执行流程(转)

    am335x的cpu上电后,执行流程:ROM->MLO(SPL)->u-boot.img 第一级bootloader:引导加载程序,板子上电后会自动执行这些代码,如启动方式(SDcard. ...

  3. Django基础(三)

    知识预览 Ajax前戏:json Ajax简介 jquery实现的ajax JS实现的ajax 回到顶部 Ajax前戏:json 什么是json? 定义: JSON(JavaScript Object ...

  4. 网上的很多Android项目源码有用吗?Android开发注意的地方。

    在Android项目开发中,我们可以在网上看到很多项目源码,大部分也不是很精致, 比如 06.Android阿福多媒体播放器开发教程+源码 还有什么浏览器源码. 那么这些有用吗?  价值在哪里? 精致 ...

  5. Java并发编程(六)-- 同步块

    上一节已经讲到,使用Synchronzied代码块可以解决共享对象的竞争问题,其实还有其他的方法也可以避免资源竞争问题,我统称他们为Java同步块.Java 同步块(synchronized bloc ...

  6. mac中安装 RabbitMQ

    1.brew install rabbitmq 2.安装后,进入/usr/local/Cellar/rabbitmq/3.7.7 ,输入:sbin/rabbitmq-server 出现下面日志,说明启 ...

  7. BZOJ3022 : [Balkan2012]The Best Teams

    将选手和询问按照年龄排序,即可去掉年龄的限制. 将所有选手按水平排序后维护线段树,显然最优解一定是从大到小贪心选择. 线段树上每个节点维护: $g[0/1]:r+1$不选/选的时候,$l$选不选. $ ...

  8. NIOH

    目录 NIOH中的双刀与阴阳术的应用 作战准备篇 2周目毕业装备: 加点: 双刀: 核心技能: 还行的技能: 被动技能: 忍术: 阴阳术: 必学: 选学: 守护灵: 隐世茶室 & 铁匠铺 出发 ...

  9. hdu2955 Robberies(背包)

    https://vjudge.net/problem/HDU-2955 概率是浮点数,只能做值(而且这里是累乘,也不能化成整数),这里注意要化成安全概率(1-p[i]),求安全概率的最大值. 钱数作二 ...

  10. antv g6

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...