2

我在导航视图中有一个选项卡面板作为我的初始项目。当我更改选项卡时，我正在通过以下方式更新导航栏中的标题：

activeitemchange: function(container){
    var navigationView = container.up('navigationview'),
        navigationBar = navigationView.getNavigationBar(),
        newTabTitle = value.tab._title;


    navigationBar.setTitle(newTabTitle);
}

问题是当我将新视图推送到导航视图时，后退按钮的文本使用旧的/原始标题，而不是更新的标题。单击后退按钮还将导航视图标题设置为旧/原始标题。

我找到解决方案最接近的是： http://www.sencha.com/forum/showthread.php?189284-Navigation-View-Title-(iPad-App)

但是我在 navigationBar.refreshProxy() 调用中得到一个“未定义”错误，所以我假设它只适用于旧版本的 ST。

任何帮助都会很棒，谢谢。

4

3 回答 3

3

我不知道你是否找到了这个问题的任何答案，或者你自己解决了这个问题，因为这个问题已经很老了。但是我尝试了您想做的事情，并且成功地获得了结果。所以这里是代码。我严格遵循 MVC，因此发布了需要它工作的必要文件。基本上，视图和控制器。

包含 TabPanel 的Main.js

Ext.define('SO.view.Main', {
extend: 'Ext.tab.Panel',
xtype: 'main',
requires: [
    'Ext.TitleBar',
    'Ext.Video'
],
config: {
    tabBarPosition: 'bottom',

    items: [
        {
            title: 'Welcome',
            iconCls: 'home',

            styleHtmlContent: true,
            scrollable: true,

            html: [
                "You've just generated a new Sencha Touch 2 project. What you're looking at right now is the ",
            ].join("")
        },
        {
            title: 'Get Started',
            iconCls: 'action',

            items: [
                {
                    xtype: 'button',
                    text: 'Push a new view!',
                    action:'push_new_view'
                }
            ]
        }
    ]
}

});

Nav.js具有导航视图和默认项目，如上面的选项卡面板

Ext.define('SO.view.Nav', {
extend: 'Ext.NavigationView',
xtype: 'nav',
config:{
    fullscreen: true,

    items: [
        {
            title: 'Default View',
            xtype:'main'
        }
    ]
}

});

最后，控制器。我在控制器本身中进行了每个用户交互处理。

Ext.define('SO.controller.Nav',{
    extend:'Ext.app.Controller',
    config:{
        refs:{
            views:['SO.view.Main','SO.view.Nav'],
            navView:'nav',
            tabView:'main'
        },
        control:{
            tabView:{
                activeitemchange:'changeTitle'
            },
            'button[action=push_new_view]':{
                tap:'pushNewView'
            }
        }
    },
    changeTitle:function(container,value,oldValue,eOpts ){
        console.log(value.title);
        this.getNavView().getNavigationBar().setTitle(value.title);
    },
    pushNewView:function(){
        var activeTabTitle = this.getTabView().getActiveItem().title;
        var controller = this;
        controller.getNavView().push({
            title: 'Second',
            html: 'Second view!'
        });
        controller.getNavView().getNavigationBar().getBackButton().setText(activeTabTitle);
        controller.getNavView().getNavigationBar().getBackButton().on('tap',function(self){             
            controller.getNavView().getNavigationBar().setTitle(activeTabTitle);
        });
    }
}

);

如您所见，我附加了根据功能中所选选项卡更改标题的changeTitle功能。

该功能pushNewView推送新视图，让您在点击时覆盖后退按钮行为。我所做的很简单，activeItem()从选项卡面板中获取，该面板包含一个推送新视图的按钮。一旦我们获得了 activeItem，我们就可以获得它的标题，并且该标题需要设置为backButtnoText. 所以我遍历导航视图和 getBackButton 实例，并简单地通过调用setText()方法更改后退按钮文本。

同时，我将事件处理程序附加到后退按钮，因为我们确实想将导航栏标题更改为前一个标题。因此，一旦使用点击返回按钮，我们将标题设置回我们在上面步骤中获得的标题。一旦你完成了一切，你可能想要分离事件处理程序，因为它可能会导致问题，或者我宁愿说它会很好。

试试这个，它只是工作。

于 2013-03-12T17:09:39.373 回答
0

您将需要更改父视口的标题，而不仅仅是导航视图图块。基本上，导航标题已经根据父视图标题和所有推送的组件标题自行更改。

var view = Ext.create('Ext.NavigationView', {
    fullscreen: true,

    items: [{
        title: 'Change this title ',
        items: [{
            xtype: 'button',
            text: 'Push a new view!',
            handler: function() {
                view.push({
                    title: 'Second Title',
                    html: 'Second view!'
                });
            }
        }]
    }]
});

它应该看起来像这样：

activeitemchange: function(container){
    var newTabTitle = value.tab._title;
    container.setTitle(newTabTitle);
}
于 2013-02-14T02:14:47.157 回答
0 
//viewAppt is the reference of the view 
//Use this 
viewAppts.query('#headerTitlebar')[0].setTitle('Title');
// Instead of this
this.getApptsHeaderTitlebar().setTitle('Title');
于 2017-03-01T11:15:50.173 回答