当RTL为真时，ExtJS 5工具栏按钮不能正确对齐

Question

当我创建工具栏并将rtl设置为true时，在我的ExtJS 4应用程序上预先设置，工具栏按钮右侧对齐（手形图标是第一个）

现在我已经尝试过对ExtJS 5做同样的事情，但是发生的事情是图标的顺序保持LTR，而不是定义为RTL：

这是我用来定义面板的代码：

Ext.define('GIS.view.Map', {
extend: 'GeoExt.MapPanel',
region: 'center',
xtype: 'map',
title: 'map',
rtl: true,
controller: 'mapcontroller',
map: map,
stateful: false,
border: true,
tbar: [
    {
        xtype: 'buttongroup',
        title: 'ניווט',
        enableOverflow: true,
        defaults: {
            scale: 'large',
            hideText: true
        },
        items: [
            {
                iconCls: 'pan48',
                handler: 'onPan'
            },
            {
                iconCls: 'zoomin48',                    
                handler: 'onZoomIn'
            },
            {
                iconCls: 'zoomout48',                    
                handler: 'onZoomOut'
            }
        ]
    }
],
initComponent: function () {
    this.callParent(arguments);
}

}）;

知道为什么图标的内部顺序不会发生变化吗？

Answer 1

通过手动添加到css解决问题：

.x-rtl {
direction: rtl;

}