//设置DataView组件的使用样式用itemCls和baseCls:itemsCls:对整个DataView组件添加一个样式类;baseCls:用于对DataView组件中每个子项添加一个样式类:注意:使用baseCls配置选项时,需要在样式类名中添加"-item"后缀
/*********************10 DataView组件 DataView组件使用样式**********************************/ //定义store数据仓库 var store=Ext.create('Ext.data.Store',{ fields:[ 'name','url' ], data:[//数据源 {name:'123',url:'resources/images/phone1.png'}, {name:'html5揭秘',url:'resources/images/phone1.png'}, {name:'html5游戏开发',url:'resources/images/phone1.png'} ] }); //定义数据显示的模板 var tpl=new Ext.XTemplate( '<tpl for=".">', '<div style="font-size:12px;">', '<img src="{url}" title="{name}">', '{name}', '</div>', '</tpl>' ); //定义DataView var dataview10=Ext.create('Ext.DataView',{ fullscreen:true, scrollable:'vertical', store:store, itemTpl:tpl, itemCls:'bookItem',//设置组件的使用样式用itemCls和baseCls,itemsCls:对整个DataView组件添加一个样式类;baseCls:用于对DataView组件中每个子项添加一个样式类:注意:使用baseCls配置选项时,需要在样式类名中添加"-item"后缀 baseCls:'book' }); Ext.Viewport.add(dataview10);
|
|
来自: I_T_馆 > 《Sencha Touch》