Image 如何在Sencha Touch 2的标题栏中心放置图像？

我需要在sencha touch 2的标题栏中心放置一个图像，但我不能！我接触了js和CSS，但这是不可能的。。。。有什么想法吗？谢谢

您可以尝试

setTitle（“”）

及

---

试试这个，它会对你有帮助的

这很简单。。。 标题：“为图像标记提供全部位置”

ImageTitleBar类

Ext.define('myapp.controls.ImageTitleBar', {
    extend: 'Ext.TitleBar',
    alias: 'widget.imageTitleBar',

    requires: [
        'Ext.Img'
    ],

    config: {
        imageSource: ''
    },

    applyInitialItems: function(items) {
        var me = this,
            defaults = me.getDefaults() || {};

        me.initialItems = items;

        me.leftBox = me.add({
            xtype: 'container',
            style: 'position: relative',
            layout: {
                type: 'hbox',
                align: 'center'
            },
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.spacer = me.add({
            xtype: 'component',
            style: 'position: relative',
            flex: 1,
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.rightBox = me.add({
            xtype: 'container',
            style: 'position: relative',
            layout: {
                type: 'hbox',
                align: 'center'
            },
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.titleComponent = me.add({
            xtype: 'container',
            hidden: defaults.hidden,
            centered: true,

            layout: {
                type: 'hbox',
                align: 'middle'
            }
        });

        me.titleImage = me.titleComponent.add({
            xtype: 'img',
            width: 36,
            height: 36
        })

        me.titleLabel = me.titleComponent.add({
            xtype: 'title'
        });

        me.doAdd = me.doBoxAdd;
        me.remove = me.doBoxRemove;
        me.doInsert = me.doBoxInsert;
    },


    updateTitle: function(newTitle) {
        this.titleLabel.setTitle(newTitle);
        this.titleLabel.setHidden(!newTitle);

        if (this.isPainted()) {
            this.refreshTitlePosition();
        }
    },

    updateImageSource: function(newImageSource) {
        this.titleImage.setSrc(newImageSource);
        this.titleImage.setHidden(!newImageSource);

        if (this.isPainted()) {
            this.refreshTitlePosition();
        }
    }
})

---

谢谢最后，我在标题栏中放了一个工具栏，并居中显示：再次感谢！这个答案在一般意义上是最好的，但在我看来写得很混乱。它基本上是说你可以这样做：

This.setTitle（“”）

Ext.define('myapp.controls.ImageTitleBar', {
    extend: 'Ext.TitleBar',
    alias: 'widget.imageTitleBar',

    requires: [
        'Ext.Img'
    ],

    config: {
        imageSource: ''
    },

    applyInitialItems: function(items) {
        var me = this,
            defaults = me.getDefaults() || {};

        me.initialItems = items;

        me.leftBox = me.add({
            xtype: 'container',
            style: 'position: relative',
            layout: {
                type: 'hbox',
                align: 'center'
            },
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.spacer = me.add({
            xtype: 'component',
            style: 'position: relative',
            flex: 1,
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.rightBox = me.add({
            xtype: 'container',
            style: 'position: relative',
            layout: {
                type: 'hbox',
                align: 'center'
            },
            listeners: {
                resize: 'refreshTitlePosition',
                scope: me
            }
        });

        me.titleComponent = me.add({
            xtype: 'container',
            hidden: defaults.hidden,
            centered: true,

            layout: {
                type: 'hbox',
                align: 'middle'
            }
        });

        me.titleImage = me.titleComponent.add({
            xtype: 'img',
            width: 36,
            height: 36
        })

        me.titleLabel = me.titleComponent.add({
            xtype: 'title'
        });

        me.doAdd = me.doBoxAdd;
        me.remove = me.doBoxRemove;
        me.doInsert = me.doBoxInsert;
    },


    updateTitle: function(newTitle) {
        this.titleLabel.setTitle(newTitle);
        this.titleLabel.setHidden(!newTitle);

        if (this.isPainted()) {
            this.refreshTitlePosition();
        }
    },

    updateImageSource: function(newImageSource) {
        this.titleImage.setSrc(newImageSource);
        this.titleImage.setHidden(!newImageSource);

        if (this.isPainted()) {
            this.refreshTitlePosition();
        }
    }
})