当 RTL 为真时，ExtJS 5 工具栏按钮不会右对齐

Posted 2023-02-26

【中文标题】当 RTL 为真时，ExtJS 5 工具栏按钮不会右对齐

【英文标题】：ExtJS 5 toolbar buttons don't align right when RTL is true

【发布时间】：2014-09-24 12:21:09

【问题描述】：

当我创建工具栏并将 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);

);

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

【参考方案1】：

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

.x-rtl 
    direction: rtl;