2012-07-11 56 views
2

我要到正规煎茶按钮,在煎茶触摸2添加按钮的TabPanel

煎茶小提琴添加到的TabPanel http://www.senchafiddle.com/#tRd76

代码:

//define the application 
Ext.application({ 

    launch: function() { 
     addTabPanel(); 

    } 
}); 

function addTabPanel(){ 
    Ext.Viewport.add({ 
     xtype: 'tabpanel', 
     tabBarPosition: 'bottom', 
     fullscreen: true, 
     tabBar:{ 
      dockedItems:[{ 
       xtype: 'button', 
       ui: 'round', 
       text: 'Button1', 
       dock: 'left', 
       handler: function(){ 
        alert('Botton1 Working Now');  
       } 
      }] 
     }, 

     items:[ 
      { 
      title: 'All Market', 
      iconCls: 'home', 
      html: 'Home', 

     }, 

     { 
       title: 'Favorite', 
       iconCls: 'favorites', 
       html:'Favorite', 
       itemTpl: '{mwRow}', 
      } 
     ] 
    }); 
} 

当添加Button1以的TabPanel按钮不会显示。 为什么Button1不显示?

请帮忙?

回答

3

这是一个快速的方法来做到这一点。我不知道有另一种方式......

Ext.application({ 

    launch: function() { 
     addTabPanel(); 
     var tp = Ext.ComponentQuery.query('tabpanel')[0]; 
     var btn = Ext.create('Ext.Button',{ 
      width:80, 
      height:30, 
      text:'BTN', 
      style:'position:absolute;top:auto;bottom:13px;left:5px;z-index:10;' 
     }); 
     tp.element.insertFirst(btn.element); 

    } 
}); 

function addTabPanel(){ 
    Ext.Viewport.add({ 
     xtype: 'tabpanel', 
     tabBarPosition: 'bottom', 
     fullscreen: true, 
     tabBar:{ 
      dockedItems:[{ 
       xtype: 'button', 
       ui: 'round', 
       text: 'Button1', 
       dock: 'left', 
       handler: function(){ 
        alert('Botton1 Working Now');  
       } 
      }] 
     }, 

     items:[ 
      { 
       title: 'All Market', 
       iconCls: 'home', 
       html: 'Home', 

      }, 

      { 
       title: 'Favorite', 
       iconCls: 'favorites', 
       html:'Favorite', 
       itemTpl: '{mwRow}', 
      } 
     ] 
    }); 
} 

这里的小提琴:http://www.senchafiddle.com/#HvTek

希望这有助于

+0

我想在TabBar的左边添加Button而不添加新标签 – 2012-07-11 14:29:40

+2

在这里,我更新了我的答案 – 2012-07-11 20:26:30

+1

这不是本地方法来添加此按钮,但它的工作很好,我非常感谢你。 – 2012-07-14 09:03:22

-3

将代码片段注入首页项目,这样的事情,

.... 
items:[ 
     { 
     title: 'All Market', 
     iconCls: 'home', 
     html: 'Home', 
     items: [ 
      { 
      xtype: 'button', 
      ui: 'round', 
      text: 'Button1', 
      dock: 'left', 
      handler: function(){ 
       alert('Botton1 Working Now');  
      } 
      } 
     ], 
}, 
... 

enter image description here

我希望这有助于。 :)

+1

我想在的TabPanel中的所有市场页面中添加按钮没有。 – 2012-07-11 13:33:16

+0

什么?????????? – hekomobile 2012-07-11 13:35:00

+0

我想在TabPanel中将Button1添加到All Market&Fav图标附近。 – 2012-07-11 13:38:52