当前位置:首页 > 开发 > 移动开发 > 正文

Sencha-touch之TabPanel的Tab在点击时执行事件

发表于: 2011-12-13   作者:cugbmao09   来源:转载   浏览:
摘要: 前面一直很忙,忙了快有一年了,学习了很多东西,也没有系统的整理一下,现在开始逐渐的将自己的一些学习的心得一点一点的记录下来。   Sencha-touch的前身是ExtJs,前几年我一直在做ExtJs的方面的扩展开发,现在由于自己的项目,做移动端的跨平台开发,因此用到了Sencha-touch。   Sencha-touch中TabPanel的使用频率应该是很高的了,一

前面一直很忙,忙了快有一年了,学习了很多东西,也没有系统的整理一下,现在开始逐渐的将自己的一些学习的心得一点一点的记录下来。

 

Sencha-touch的前身是ExtJs,前几年我一直在做ExtJs的方面的扩展开发,现在由于自己的项目,做移动端的跨平台开发,因此用到了Sencha-touch。

 

Sencha-touch中TabPanel的使用频率应该是很高的了,一般的应用应该都会用到,但是TabPanel的TabBar在点击时,就会切换到对应的容器界面去,而经常会有这种情况,在TabBar中其实只是需要4个容器,而在TabBar上需要一个按钮,让其被点击时执行某个方法,而并不是切换到某个界面下去,在1.1的版本中,是可以给TabBar添加item来实现的,不过那也是存在Bug的,而在2的版本中,这样是无法实现的,为了实现这个功能,需要修改一点源码。

 

在TabPanel的源码中修改doTabChange方法,原本的doTabChange方法的源码是:

 

 

doTabChange: function(tabBar, newTab, oldTab) {

        var index = tabBar.indexOf(newTab);

        this.setActiveItem(index);

}

 

 

在其中添加几行代码:修改成:

 

 

doTabChange: function(tabBar, newTab, oldTab) {

        var index = tabBar.indexOf(newTab);

        var item = this.getInnerItems()[index];

        if(item.handler){

if(typeof(item.handler)== 'string'){

                eval(item.handler); 

}else{

            item.handler(); 

}

        return;

}

        this.setActiveItem(index);

}

 

 

如此修改后,在创建TabPanel时,如果需要某个Tab点击执行事件,只需要给该Tab一个handler属性,如:

 

Ext.create('Ext.tab.Panel',{

tabBar: {

docked: 'bottom',

layout: {

type: 'hbox',

align: 'middle'

}

},

items: [{

title: '首页',

            iconCls: 'home'

},{

title: '好友',

iconCls: 'user',

handler: function(){

alert('==========');

}

},{

title: '信息',

iconCls: 'mail'

},{

iconCls: 'favorites',

title  : '战利品',

},{

iconCls: 'more',

title: '更多'

  }]

});

 

如此在点击好友这个Tab的时候会弹出=========的提示,而在点击其他Tab的时候就会进行页面切换。

Sencha-touch之TabPanel的Tab在点击时执行事件

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号