1

我想创建一个带有标题栏和一个带有两个列表和一个输入表单的选项卡面板的视图,所以我先创建一个标题栏,然后创建一个选项卡面板。但是当我点击每个选项卡时,所有选项卡都会上下抖动一下当我将 tabBarPosition 配置为底部时,它看起来不错。那么,如何解决这个问题呢?还有,如何清除 tabBar 的默认背景?

以下是我的看法:</p>

Ext.define('MyApp.view.MyView',
    {
        extend : 'Ext.Container',
        id : 'MyView',
        xtype : 'MyView',
        config : {
            xtype : 'panel',
            layout : 'vbox',
            items : [
                {
                        xtype : 'titlebar',
                        docked : 'top',
                        title : 'MyView',
                        items : [
                            {
                                text : 'goback',
                                ui : 'back',
                                align : 'right',
                                listeners : {
                                    tap : function(){
                                        backwardPage('back');
                                    }
                                }
                            },{
                                text : 'index',
                                ui : 'home',
                                align : 'left',
                                listeners : {
                                    tap : function() {
                                        forwardPage('index','index');
                                    }
                                }
                            }    
                        ]
                }//title bar
                ,{
                            xtype : 'tabpanel',
                            style : 'border:1px solid red;',
                            //tabBarPosition : 'bottom',
                            flex : 1,
                            ui : 'light',
                            layout : {
                                type : 'card',
                                align : 'middle',
                                pack : 'center'
                            },
                            defaults: {
                                styleHtmlContent: true
                            },
                            items : [
                                 {
                                            title : 'One',
                                            html : 'one'
                                 }
                                 , {
                                            title : 'two',
                                            html : 'two'
                                 }
                                ,{
                                            title : 'three',
                                            html : 'three'
                                }
                            ]
                        }//top buttons
            ]
        }//config
});
4

0 回答 0