dynamic - Sencha Touch 2中动态设置视图标题的正确方法是什么

Question

我目前在 sencha touch 2 视图中设置视图标题，如下所示：

initialize: function() {
     this.callParent();
     var translator = Ext.create('MyApp.util.Translation');
     this.config.title = translator.translateData('pagetitle.detail');
}

翻译类只是根据函数中提供的键从 javascript 对象中查找字符串translator.translateData。

使用这种方法，当视图加载时，标题会稍微向右移动（40 px 左右）。

我还尝试将其放置在activate具有类似结果的视图侦听器中。

在 ST2 中动态设置视图标题的正确方法是什么？

Answer 1

您可以通过控制器执行此操作

Ext.define('MyApp.controller.MyController', {
    extend: 'Ext.app.Controller',

    config: {
        refs: {
            titlebar: {
                autoCreate: true,
                selector: '#mytitlebar',
                xtype: 'titlebar'
            }
        },

        control: {
            "titlebar#mytitlebar": {
                initialize: 'onTitlebarInitialize'
            }
        }
    },

    onTitlebarInitialize: function(component, options) {
        var me = this;
        me.getTitlebar().setTitle("Second Title");
       // OR IN YOUR CASE:
       var translator = Ext.create('MyApp.util.Translation');
       me.getTitlebar().setTitle(translator.translateData('pagetitle.detail'));
    }
});

意见：

Ext.define('MyApp.view.MyContainer', {
    extend: 'Ext.Container',

    config: {
        items: [
            {
                xtype: 'titlebar',
                docked: 'top',
                itemId: 'mytitlebar',
                title: 'First Title'
            }
        ]
    }

});