Sencha Touch 使tab底部图标宽度平均分配
Sencha Touch 使tab底部图标宽度平均分配
蓝色浮云 发表于3年前
Sencha Touch 使tab底部图标宽度平均分配
  • 发表于 3年前
  • 阅读 42
  • 收藏 2
  • 点赞 0
  • 评论 0

腾讯云 十分钟定制你的第一个小程序>>>   

摘要: Sencha Touch默认在tabpanel底部的每个tab都会挤在一起,使用不太方便.使底部导航按钮的宽度平均分配才是当前主流.

修改前:

修改后:

在tabpanel对应的controller中添加如下代码

config: {

        views: ['Main'],

        refs : {

main : 'Main',

      },

        control : {

        'Main':{

        initialize:'initialize'

       }

        }

    },

    //使tab底部图标宽度平均分配

    initialize:function(){

    var tabPanelItems = this.getMain().getItems();

    for (var i = 0; i < tabPanelItems.length; i++) {

     if (tabPanelItems.items[i].tab) {

         //因为有四个按钮,所以25%表示每个按钮的宽度比例    

tabPanelItems.items[i].tab.setWidth('25%');

     if(i==tabPanelItems.length-1){

                           //解决最后一个按钮太靠右的问题,不清楚为什么会有这个问题

     tabPanelItems.items[i].tab.setPadding('0px 25px 0px 0px');

     }

     }

    }

   }

标签: Sencha Touch Tabpanel
共有 人打赏支持
粉丝 0
博文 5
码字总数 1340
×
蓝色浮云
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: