Roweditor中的Ext JS復選框

Question

有誰知道如何將RowEditor中的復選框設置為中心位置？ 我在Ext JS 6.0.0中使用主題“ triton”。

該復選框位於該行的頂部，但其他字段（如textfield或combobox）位於中間。

看起來像：

我已經將復選框的樣式對象設置為align: center但是沒有用。

plugins: { ptype: 'rowediting', clicksToEdit: 2, saveBtnText: 'Übernehmen', cancelBtnText: 'Abbrechen' },

initComponent: function() {
    var me = this;
    me.store = 'MeasurementPoint';
    me.columns = [
        {
            xtype: 'actioncolumn',
            width: 50,
            sortable: false,
            hideable: false,
            resizable: false,
            menuDisabled: true,
            draggable: false,
            items: [
                {
                    icon: 'Content/images/icon_32/garbage.png',
                    tooltip: 'Löscht den Eintrag',
                    handler: function(view, rowIdx, colIdx, item, ev, record) {
                        Ext.Msg.show({
                            title: 'Löschen bestätigen!',
                            msg: 'Soll der Messpunkt \"' + record.data.Name + '\" wirklich gelöscht werden?',
                            width: 300,
                            buttons: Ext.Msg.YESNO,
                            fn: function(btn) { if (btn === 'yes') view.ownerCt.getStore().remove(record); },
                            //animateTarget: rowIdx,
                            icon: Ext.window.MessageBox.QUESTION
                        });

                    }
                },
                {
                    icon: 'Content/images/icon_32/pencil.png',
                    tooltip: 'Bearbeitet den Eintrag',
                    handler: function(view, rowIdx, colIdx, item, ev, record) {
                        if (this.__form)
                            return;

                        this.__form = Ext.widget('window', {
                            layout: 'fit',
                            width: 500,
                            title: 'Messpunkt bearbeiten',
                            items: { xtype: 'measurementpointform', header: false },
                        }).show();
                        this.__form.down('button[itemId=save-measurementpoint]').action = 'update-measurementpoint';
                        this.__form.down('form').loadRecord(record);
                        this.__form.on('close', function() { this.__form = false }, this, { single: true });
                    }
                }
            ]
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'Active',
            text: 'Aktiv',
            width: 70,
            renderer: AWA.ImageRenderer.CROSS,
            editor: {
                xtype: 'checkbox',
            }
        },
        {
            xtype: 'gridcolumn',
            dataIndex: 'Manually',
            text: 'Manuell',
            width: 90,
            renderer: AWA.ImageRenderer.TICK,
            editor: {xtype: 'checkbox'}
        }

謝謝你們的幫助

Answer 1

我已經覆蓋了CSS，它對我有用

.x-grid-editor .x-form-cb-wrap {
    vertical-align: middle;
}

謝謝