1

同じ Ext.TabPanel にもう 1 つボタン (更新ボタン) を追加する方法。Miコードはこちら：

Ext.define('myApp.view.Twitter',{
  extend: 'Ext.TabPanel',
  xtype: 'twitter', 


   config: {
    title:'Twitter',
    iconCls: 'twitter2',

styleHtmlContent: true, 
items: [
    {
        title: 'Twitts',
        html: 'Lista de twitts'
    },
    {
        title: 'Mapa',
        html: 'Lugar de twitts'
    }
 ]

} });

4

3 に答える 3

2

あなたはあなたのにもう1つのアイテムを追加する必要がありますtab panel：

items: [
    {
        title: 'Twitts',
        html: 'Lista de twitts'
    },
    {
        title: 'Mapa',
        html: 'Lugar de twitts'
    },
    {
        iconCls: 'refresh',
        title: 'Refresh',
        html: 'Refresh'
    }
]

バージョン2.0を使用している場合は、tabbar下部にドッキングしない限り、アイコン画像を表示できないことに注意してください。これがバージョン2.1であれば、問題ないはずです。

于 2013-02-14T15:28:56.543 に答える
1

解決：

Ext.define('portofolio.view.Twitter',{
  extend: 'Ext.TabPanel',
  xtype: 'twitter', 


  config: {
    title:'Twitter',
    iconCls: 'twitter2',

    styleHtmlContent: true, 
   tabBar:{
            dockedItems:[{ 
                xtype: 'button',
                iconMask: true,
                dock: 'right',
                ui: 'action',
                stretch: false,
                style: 'height:35px;margin-top:5px;',
                handler: function(){
                    alert('Refresh panel');    
                }
            }]
        },
            items: [
                {
                    iconCls: 'refresh', 

                },
                {     
                    title: 'Twitts',
                    html: 'Aqui van los twitts'
                },
                {                  
                    title: 'Mapa',
                    html: 'Aqui encuntras el oro'
                }           
            ]
        },
});
于 2013-02-15T11:30:05.273 に答える
0

更新ボタンで、内部に表示されているデータを更新したいと思いますtabPanel。アプリ全体で役立つさまざまなボタンを使用toolbarおよび設定できます。この作業フィドルをセットアップしました。refresh右上隅にボタンがあります。

それが役立つことを願っています。ここにもコードを追加しています-

launch: function() {
        var view = Ext.create('Ext.Container', {
            fullscreen: true,
            layout: {
                type: 'vbox'
            },
            items: [
                {

                    xtype:'toolbar',
                    docked:'top',
                    layout:{
                        type: 'vbox',
                        pack:'center',
                        align: 'right'
                    },
                    flex:1,
                    items:[
                        {
                            xtype:'button',
                            iconMask:true,
                            iconCls:'refresh',

                            handler:function(){
                                console.log('Refresh Button Tapped');
                                alert('Refresh Button Tapped');
                            }
                        }
                    ]

                },
                {
                    xtype:'panel',
                    layout:'fit',
                    flex:2,
                    items:[
                        {
                            xtype:'tabpanel',
                            tabBarPosition:'bottom',
                            defaults:{
                                styleHtmlContent:true
                            },
                            items:[
                                {
                                    title: 'Twitts',
                                    iconCls: 'home',
                                    html: 'Lista de twitts'
                                },
                                {
                                    title: 'Mapa',
                                    iconCls: 'maps',
                                    html: 'Lugar de twitts'
                                }
                            ]
                        }
                    ]
                }
            ]
        });
    }
于 2013-02-14T16:17:02.437 に答える