居中对齐 ExtJS 中的按钮

Posted 2023-02-26

【中文标题】居中对齐 ExtJS 中的按钮

【英文标题】：Center-align a button in ExtJS

【发布时间】：2013-05-27 08:19:51

【问题描述】：

var myWin = new Ext.Window(
        height : 100,
        width : 200,
        maximizable : true,
        items : [ 
            xtype : 'button',
            text : 'myButton'
         // align : center
         ]

    );
    myWin.show();

这是我的代码。我想将按钮对齐到中心，我知道有办法做到这一点，但它们有点长而且棘手，有没有像align : center 或类似的简单解决方案，应该将按钮或文本字段对齐到中心？

【参考方案1】：

你可以试试这个。这是一种方式（我添加了我的窗口图片）

 Ext.define('MyApp.view.MyWindow', 
    extend: 'Ext.window.Window',

    height: 137,
    width: 233,
    layout: 
        align: 'middle',
        pack: 'center',
        type: 'hbox'
    ,
    title: 'My Window',

    initComponent: function() 
        var me = this;

        Ext.applyIf(me, 
            items: [
                
                    xtype: 'button',
                    text: 'MyButton'
                
            ]
        );
        me.callParent(arguments);
    
);

【参考方案2】：

插入buttonAlign: 'center',，它应该居中——我认为默认是right。见this example。