sencha touch笔记（3）

1.关于sencha对于样式表的使用，配置文件中有一个app.json是专门的app配置文件。

"css": [
        {
            "path": "resources/css/app.css",
            "update": "delta"
        }
    ],

其中这句指明了css文件的路径，想要修改其中的样式只需在app.css中添加或者修改就可以；同理，所用到的js文件也可以在其中找到。

2.sencha对于组件的配置是通过配置对象和配置选项来实现的，这也是extjs的基础语法，例如：

var test = new testFunction({
    Name : 'www',
    Age : '18'
});

所谓配置，即没有参数的限制从而能够更加灵活的调用和设置。

3.在sencha中可以使用2种方法来创建组件，一种是使用Ext.create的方法，第二个参数为该组件的配置对象。例如：

var panel = Ext.create('Ext.Panel', {
    fullscreen:  true,
    id: 'myPanel'
});

另一种是通过new的方法：

var panel = new Ext.Panel({
    id : 'myPanel',
    fullscreen : true
});

4.事件监听器是由listeners来实现的，然后后面跟一个事件的类型和一个处理函数，例如：

listeners: {
    tap: function() {
        alert("hello world!");
    }
}

除了使用listeners之外，还可以用组件的addListener的方法或者on关键字来监听组件的事件，例如：

var test = function() {
    alert("hello world!");
}

img.addListener('tap', test, this, {
   single : true,//只执行一次处理函数
   delay: 1000   //延迟一段时间执行
});

其中this指明了作用域，同理也可以用img,on('tag', test, this)来添加时间监听事件。

5.关于异步加载和同步加载，Ext.require('Ext.Img')算是异步加载，有利于调试，可以实现跨域获取数据等等，但是像其他语言的#include一样，需要把用到的都包含一遍。而同步加载则不需要这些。

6.关于sencha的布局，就那几种布局方式，box，card,list，fit，有的情况下可能需要一个页面里面会有多种布局方式的共存。这个时候可以采用一种办法：

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

即将两个不同的布局放入另外一个布局之中，作为另外一个布局的items。