0

タブのビューを変更したいのですが、大きくて長方形にしたいのですが、デフォルトのカプセルのように表示されています（曲線の半径を持つ長方形）。それらをカスタマイズする方法は？

コードはこちら

var entryForm = Ext.define("TimeSheet.view.Newentry", {
extend: "Ext.TabPanel",
requires: ["Ext.XTemplate", "Ext.field.DatePicker", "Ext.field.Select", "Ext.TitleBar", "Ext.DateExtras"],
xtype:'newentryview',

config: {
    autodestroy: true,
    fullscreen: true,
    scrollable: true,
    cardSwitchAnimation: 'cube',
    tabBarPosition: 'top',
    tabBar: {
        height: '70px',
        layout: {
            pack: 'center'
        }
    },
    defaults: {
        styleHtmlContent: true
    },
    items: [{
        title: 'Add Entry',
        iconMask: true,
        iconCls: 'info',
        flex: 1,
        style: 'border: none; font: 22px Arial black',
        fullscreen: true,
    },{
        title: 'Dashboard',
        iconMask: true,
        iconCls: 'compose',
        flex: 1,
        cls: 'dashpnl',
        style: 'border: none; font: 22px Arial black',
        fullscreen: true,
    },{
        title: 'Settings',
        iconMask: true,
        iconCls: 'settings',
        fullscreen: true,
        html: 'Page 3',
    }]
}

});

4

1 に答える 1

0

css ファイルで変更できます。

タブ パネルが上部にドッキングされている場合:

.x-tabbar.x-docked-top .x-tab {
    padding: 0.4em 2em;
    -webkit-border-radius: 0em;
    border-radius: 0em;
}

タブ パネルが下部にドッキングされている場合:

.x-tabbar.x-docked-bottom .x-tab {
    padding: 0.4em 2em;
    -webkit-border-radius: 0em;
    border-radius: 0em;
}
于 2012-10-03T12:45:55.560 に答える