2.0中的GridView有极大的改进,而Grid的UI部分,正是由GridView这个类来实现的。2.0中GridView最主要的新功能有:
* 效能的提升
GridView的底层结构和渲染代码已在2.0完整重构过,并侧重考虑了效能部分。正因性能的原因,锁定列的这一功能已经取消(参阅下一节)。
* 感观(look and feel)的改进
和新2.0的主题一起, grid的外观控制也有新变化,使得Grid比以前更时尚和看上去更具吸引力。
* 单行归组
多个行可被归组到某一指定列,由用户重新归组亦可。
* 多行组摘要
每一组可相应的提供一个数据摘要组
* 进阶插件支持
在2.0中,新加入插件机制。GridView就是这种插件机制的一个典型例子。如范例中所示,Grid优秀的功能便是依靠几个预先做好的插件。插件RowExpander提供了展开、收缩行的功能,插件RowNumberer就提供了行中数字的支持。
列锁定的注意事项(Column Locking)
有些用户或许发现Ext 1.x中列锁定的功能,到2.0因为已经取消,并可以说以后也不再支持了。列锁定(Column locking),虽然对某些用户来说有其的用途, 但与2.0 GridView的新功能有不兼容的地方(如归组、摘要等),而且为了实现锁定会使得Grid渲染性能开销增大。因此,1.x gridView这功能的向上升级,或打补丁,均不会由官方支持。
注意:当前有为2.0而做的用户扩展在进行中,以实现2.0的列锁定,而且看上去写得还蛮不错。更多有用资讯可论坛的帖子找到。
XTemplate
XTemplate使用了多种标签和特殊操作符支持模板,使得模板在应付复杂的数据结构时尤为健壮。这里所列出的高度概括的几项功能,欲了解完整的细节和使用方法,请参阅XTemplate API文档.
* 自动数组填充和作用域切换
* 可在子模板作用域内访问父级对象
* Array item index variable
* 支持数据值的简单匹配
* 自动渲染浮点型数组(不包含非对象的值)
* 基础性的条件逻辑符号if
* 可执行模板中直接写好的任意语句
* 支持模板的配置属性
* 可通过配置项对象自定义模板方法
* 可用于服务端的JavaScript模板
DataView
从表面上看,DataView跟1.x的View类非常相似。两者都支持模版数据渲染,data store数据绑定和内建的选区模型和事件。但是, 随着2.0新架构的设计,DataView赋予了更强大的功能。下面是这次最重要的改动:
* 来自BoxComponent的继承
1.x View类继承自Observable, 作为独立组件而言工作不错,但是它并没提供内建的机制与其他组件融合的能力。而DataView就是针对这种不足作出的改进,该类从BoxComponent继承,因此如前文所述,也具备一般组件的生存周期控制。
* 发挥了XTemplate之功效
1.x View类采用了1.x本身的模版类Template 。较好满足了view自身的需求,但是难以满足一些复杂的渲染任务。DataView采用的模版类也升级到2.0的XtTemplate,以应付制定UI可轻松应付复杂的数据。
* 新增的配置选项
DataView 提供了更为灵活的-几个新选项:
o itemSelector: 必须是一个DomQuery选择符告知该类究竟如何分辨出每个item。相比1.x的做法带来灵活性和速度的提高。
o simpleSelect: This is a new selection mode option that enables multi-selection by clicking on multiple items without requiring the user to hold Shift or Ctrl.
o overClass: 一个CSS的样式类,每个元素onmouseover和onmouseout时生效。
o loadingText:像其他绑定store的Ext组件一样,DataView支持标准的遮罩效果。