事件如何被监听


launch: function() {
       //Ext.fly('appLoadingIndicator').destroy();
       //Ext.Viewport.add(Ext.create('xsd.view.Main'));
       var img = Ext.create('Ext.Img', {
           src: 'resources/startup/320x460.jpg',
           wdith: '80%',
           height: '80%',
           //listeners: {
           //    tap: function () {
           //        Ext.Msg.alert("click");
           //    }
           //}
       });
       var panel = Ext.create('Ext.Panel', {
           id: 'mypanel',
           html:'test html',
           items:[img]
       });
       Ext.Viewport.add(panel);
       var clickImg = function () {
           Ext.Msg.alert("click");
       }
       img.addListener('tap', clickImg, this, {
           single: true,//表示只执行一次事件处理函数,之后再触发该事件时不再执行此处指定的事件处理函数
           delay: 1000//将事件处理函数延迟一段时间执行,参数值为所需延长的毫秒数
       })
       //第一个参数代表需要被监听的事件;第二个参数用于指定事件处理函数;第三个参数代表事件处理函数的作用域,即函数体内的this变量所引用的对象;第四个参数用于对事件处理函数添加使用一些配置选项。
   }

布局配置:

launch:function(){
      var panel=Ext.create('Ext.Panel',{
          id:'mypanel',
          layout:{
              //type: 'hbox',//水平盒布局
              //type:'vbox',//垂直盒布局
              // type:'fit',//自动填充布局,当只有一个组件时使用,自动填充到整个面板
              type:'card',//自动填充布局,可包含多个组件,但同时只显示一个组件。
              align:'stretch'
          },
          items:[
          {
              flex:1,
              html:'html1',
              style:'background-color:#00ff00;'
          },
                      {
                          flex:2,
                          html:'html2',
                          style:'background-color:#0000ff;'
                      }
          ]
      });
      Ext.Viewport.add(panel);
      panel.setActiveItem(0);//与card布局配合使用的函数,读取索引值确定要显示哪个组件。
  },