Javascript Ext JS标头放置顺序

我想在面板标题中有一个按钮。这是我代码的一部分：

var dashboardPanel4 = Ext.create('Ext.Panel', {
        renderTo: Ext.getBody(),
        margin: '0 0 50 0',
        glyph: 'xf2a0@FontAwesome',
        layout: {
            type: 'table',
            columns: 4,
            tableAttrs: {
                width: '100%'
            }
        },
        defaults: {
            // applied to each contained panel
            bodyStyle: 'padding:10px',
            border: 0
        },


        title: '<span class="requests" id="requests"><a href="#" style="">Requests</a></span>',

        header: {
            xtype: 'header',
            titlePosition: 0,
            defaults: {
                margin: '0 10px'
            },
            items: [
                {
                    xtype: 'button',
                    text: "Test Button",
                    tooltip: "Add something",
                    iconCls: 'add',
                    handler: Ext.bind(function() {
                    }, this)
                }
            ]
        },

var dashboardPanel4=Ext.create（'Ext.Panel'{
renderTo:Ext.getBody（），
边距：“0 50 0”，
铭文：'xf2a0@FontAwesome',
布局：{
键入：“表”，
栏目：4，
表格属性：{
宽度：“100%”
}
},
默认值：{
//应用于每个包含的面板
车身风格：“衬垫：10px”，
边界：0
},
标题：“”，
标题：{
xtype:'标题'，
标题位置：0，
默认值：{
边距：“0 10px”
},
项目：[
{
xtype:'按钮'，
文本：“测试按钮”，
工具提示：“添加内容”，
iconCls:“添加”，
处理程序：Ext.bind（函数（）{
}，本页）
}
]
},

但问题是图标排列正确。有没有办法在标题“请求”之前设置FA图标

目前情况是这样的：

header: {
    xtype: 'header',
    titlePosition: 1,
    items: [{
        xtype: 'image',
        glyph: 'xf2a0@FontAwesome',
    }, {
        xtype: 'button',
        text: "Test Button",
        tooltip: "Add something",
        iconCls: 'add',
        handler: Ext.bind(function () {}, this)
    }]
},

---

它应该是：FA图标、请求和右侧的按钮。

您希望标题中的内容如下所示：

我会使用将标题设置为第二项的配置来完成这项工作。接下来需要做的是添加图标，而不是使用

glyph

config，而是将其作为自己的项添加到标题配置中

所以你会得到这样的结果：

header: {
    xtype: 'header',
    titlePosition: 1,
    items: [{
        xtype: 'image',
        glyph: 'xf2a0@FontAwesome',
    }, {
        xtype: 'button',
        text: "Test Button",
        tooltip: "Add something",
        iconCls: 'add',
        handler: Ext.bind(function () {}, this)
    }]
},

这里是fiddle（示例中没有加载字体可怕的图标），但它应该在您自己的代码中工作

---

顺便说一句，这个问题可能有更多的解决方案。

您使用的是哪个版本的ExtJS？对于这个项目，我使用Ext JS 4It。但是图标非常小。有什么办法可以放大它吗？嗯，您可以尝试设置

图像

对象的

高度和
宽度
，您可以尝试设置
样式：'font size:48px；'
 这是一种放大图标的方法，但我认为图标的大小可能会受到标题大小的限制：|