在sencha touch中更改Ext.Menu中的垂直间距

Question

我正在使用sencha架构师开发一个sencha touch项目。我使用类Ext.Menu创建了一个菜单。我成功地生成了具有不同按钮的菜单，但是当创建菜单时，不同按钮之间存在sapce / padding。我参考了文档，看起来我需要更改

  

$ sheet-button-spacing和$ sheet-padding

我不确定如何在建筑师那样做。还有其他方法可以做到这一点。以下是我的菜单的截图

- 这就是我的面板的样子：

这是我的面板代码

    Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.mylistpanel',

    requires: [
        'Ext.Button'
    ],

    config: {
        layout: 'vbox',
        items: [
            {
                xtype: 'button',
                text: 'MyButton2'
            },
            {
                xtype: 'button',
                text: 'MyButton3'
            }
        ]
    }

});

这就是我创建菜单的方式

    console.log("Menu for side");
var items = [
    {
        xtype: 'panel',
        docked:'left',
        style: {

        },
        items: [
            {
               // xtype: 'mainmenu'
                xtype:'mylistpanel'
            }
        ]
    }
];

var className = 'Ext.Menu';

return Ext.create(className, {

    items: items

    });

Answer 1

您可以使用class：

layout : 'vbox',
class : 'buttonPadding',

在你的css中定义类：

.buttonPadding{
padding: 2px; //as per requirement
}

或

您可以直接使用样式：

layout: 'vbox',
style: 'padding:2px',

和

我不确定，但我想：

$ sheet-button-spacing和$ sheet-padding

这是scss所以你需要更改scss文件。

但是如果您更改scss文件，它将反映到工作表中的所有按钮。

希望它能帮到你!!!