[原]sencha touch之carousel

carousel组件是个非常不错的东东，自带可滑动的效果，效果如下图

上面部分可以左右滑动，下面部分可以上下滑动，效果还是不错的，app程序中很有用的布局

代码如下：

Ext.application({

	name:'itKingApp',
	/**
	 * 	Carousel 组件
	 */
	launch:function(){
		var carousel1=Ext.create('Ext.Carousel',{
			ui:'dark',
			flex:1,
			direction:'horizontal',
			items:[
			{
				html:'left',
				style:'background-color:pink'
			},
			{
				html:'center',
				style:'background-color:green'
			},
			{
				html:'right',
				style:'background-color:blue'
			}
			]
		});

		var carousel2=Ext.create('Ext.Carousel',{
			ui:'dark',
			flex:1,
			direction:'vertical',
			items:[
			{
				html:'left',
				style:'background-color:yellow'
			},
			{
				html:'center',
				style:'background-color:gray'
			},
			{
				html:'right',
				style:'background-color:blue'
			}
			]
		})		

		var panel=Ext.create('Ext.Panel',{
			layout:{
				type:'vbox'},
			items:[carousel1,carousel2]
		});

		Ext.Viewport.add(panel)
	}
})

作者：jjx0224 发表于2013-9-30 10:42:16 原文链接

阅读：192 评论：0 查看评论