Your SlideShare is downloading. ×
[Flash开发者交流][2010.03.28]flex中的数据绑定和列表模式(徐哲)
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

[Flash开发者交流][2010.03.28]flex中的数据绑定和列表模式(徐哲)

324
views

Published on

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
324
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
6
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Flex 中的数据绑定和列表模式
    • 徐哲 Doit.im
  • 2. 问题
    • 谁在用 Flex 做企业应用?
    • 用框架了吗?
  • 3. 丑陋的框架
    • Cairngorm
    • Mate
    • PureMVC
    • ......
  • 4. Flex 开发什么应用?
    • RichClient
    • 像 HTML Web 还是传统 Client ?
  • 5. 传统 HTML 应用的模式
    • 根据页面事件向服务器请求数据
    • 手工数据更新页面
  • 6. Flex 的优点
    • 数据绑定
    • One Page 或者 Less Page 应用、 AIR
  • 7. Flex 的开发模式
    • 数据更新应该由数据绑定自动完成
    • 我们只操作客户端内存中的数据
    • 与服务器或者本地数据的交互应该由框架来完成
    • 服务器交互 REST 或者类 REST 风格
  • 8. 所以需要 ......
    • 数据绑定的列表操作模式
    • Datasource
  • 9. 数据绑定的列表操作模式
    • 定义
      • 针对列表的操作,使集合 A 变换成集合 B
      • 操作的结果符合数据绑定的特性,即数据源更新会触发绑定对象的更新
        • 根据源数据列表 A 的增删操作更新列表,并 Dispatch 对应的 CollectionEvent 事件
        • 如果源数据列表 A 发生 CollectionEventKind.RESET 事件,比如 removeAll ,则更新整个列表 B 并 Dispatch 对应的 CollectionEventKind.RESET 事件
        • 一般来说,对列表 B 只用来做展示使用,而不适合做增删修改操作,所有增删改操作都应该作用在源数据列表 A 上
  • 10. 模式列表
    • 绑定子集:从列表 A ,过滤出一个列表 B
    • 绑定并集:从列表 A1 , A2, 合并成一个并集 B
    • 绑定映射:从列表 A ,映射其元素得到一个新的列表 B
  • 11. 子集模式实现
    • 使用 ListCollectionView 的 filter function 即可
  • 12.
    • 监听列表 A1 、 A2 的 CollectionEvent ,忽略 CollectionEventKind.MOVE 和 UPDATE 事件
    • 维护一个从 A1 、 A2 合并的列表,根据 A1 、 A2 列表的 CollectionEvent ,操作合并后的列表与其同步
    • 该实现不支持对并集 B 的操作,应该通过修改原始列表 (A1 、 A2) 更新并集 B
    并集模式实现
  • 13. 映射模式实现
    • 监听列表 A 所有的 CollectionEvent
    • 列表 B 必须和列表 A 同步,包含每个对象的对于位置
  • 14.  
  • 15. Datasource
    • 监听服务器端的变化更新 Datasource ,并通过数据绑定反映到 UI ,反之亦然
    • 按照类型组织
    • 使用 Dictionary 做一个 id 对应的字典
    • 类 REST 方式保存数据
  • 16. Datasource
    • private var data:Dictionary = new Dictionary();
    • private var lists:Dictionary = new Dictionary();
    • private var filters:Dictionary = new Dictionary();
    • public function listFromServerByExp(type:Class, exp:ExpressionExt, callback:Function = null):void
    • public function list(type:Class):ListCollectionView
    • public function listByExp(type:Class, exp:ExpressionExt):ListCollectionView
    • public function update(entity:RawEntity):void
    • public function remove(entity:RawEntity):void
    • public function detectEntityById(type:Class, id:String):RawEntity
    • public function detectEntityByExp(exp:ExpressionExt):RawEntity
  • 17.  
  • 18. Thank you !