[原]sencha touch之panel和tabpanel】的更多相关文章

最近在弄senchatouch的项目,所以边学习边开发,边记录,直接记录下test code如下: Panel: Ext.application({ name:'itKingApp', launch: function(){ var panel=Ext.create('Ext.Panel',{ fullscreen:true, id:'myPanel', style:'color:red', html:'主面板' }); Ext.Viewport.add(panel) // Ext.get 取得…
现在来说说sencha touch中的表单,举个简单的login的例子,相关的说明我都放在了注释中,看下面代码 Ext.application({ id:'itKingApp', launch:function(){ var formPanel=Ext.create('Ext.form.Panel',{ id:'formPanel1', // 表示是否可以滑动,vertical=上下滑动 horizontal=左右滑动 both=上下左右都可以 flase=不滑动 scrollable:'ver…
今天记录一下关于sencha touch中的几种布局,其实很简单的,还是直接上代码,一目了然 1:box布局,其实就是vbox和hbox,说白了一个是横着摆放,一个是竖着摆放 Ext.application({ name:'myApp', launch: function(){ var myPanel=Ext.create('Ext.Panel',{ id:'myPanel', layout:{ type:'hbox', pack:'end' }, items:[ { html:'One', f…
接着上一篇的登陆页面,来一个最简单的注册页面,几乎包含了常用的field Ext.application({ id:'itKingApp', launch:function(){ var formPanel=Ext.create('Ext.form.Panel',{ id:'formPanel1', scrollable:'vertical', style:{ 'padding':'1px' }, items:[{ xtype:'fieldset', title:'用户注册', instruct…
还是直接上代码,都是基本的几个容器控件,没什么还说的 Ext.application({ name:'itkingApp', launch:function(){ var view =Ext.create('Ext.NavigationView',{ items:[ { title:'title1', html:'one' }] }); var panel=Ext.create('Ext.Panel',{ title:'title2', html:'two' }); var panel2=Ext…
carousel组件是个非常不错的东东,自带可滑动的效果,效果如下图 上面部分可以左右滑动,下面部分可以上下滑动,效果还是不错的,app程序中很有用的布局 代码如下: Ext.application({ name:'itKingApp', /** * Carousel 组件 */ launch:function(){ var carousel1=Ext.create('Ext.Carousel',{ ui:'dark', flex:1, direction:'horizontal', items…
常规的Sencha touch 应用都是"header content footer"结构,这样的结构无疑将使用TabPanel来实现,而且TabPanel肯定是card布局,这样就会如果要实现"view"之间的跳转,animateActiveItem()方法将被使用, 但是通过st的源码 animateActiveItem: function(activeItem, animation) { var layout = this.getLayout(), defau…
笔者在做sencha项目的时候碰到一个需求,就是"好友列表"中分为"未确认好友"和"已确认好友",两个都是一个list,自然想到的就是使用tabpanel来实现. 但是在sencha touch的开发使用过程中,我们总是会碰到不给高度就不显示的问题,非常之恼火,浪费我大把时间研究 笔者在开发这个需求的时候也碰到了,下来就分享一下方案吧: 1,先来看看有问题的方案,以下是代码: Ext.define("mine.view.ListFrie…
一位同学问我一个问题: sencha touch中xtype创建dataview死活不显示!!版本2.3.1,MVC模式,sencha touch创建目录程序很简单,主界面一个tabPanel,两个分页“FoodMain”“UserMain”想在第一个分页显示一个DataView,结果死活不显示,Main.js如下: //file: app/view/Main.js Ext.define('myapp.view.Main', { extend: 'Ext.tab.Panel', xtype: '…
基于sencha touch 2.2所写 代码: /* *模仿tabpanel导航栏 */ Ext.define('ux.TabBar', { alternateClassName: 'tabBar', extend: 'Ext.Toolbar', xtype: 'tabBar', config: { docked: 'bottom', cls: 'navToolbar', layout: { align: 'stretch' }, defaults: { flex: 1 }, //被选中的按钮…