将(右)按钮添加到Sencha导航视图 [英] Add (right) Button to Sencha Navigation View

问题描述

我希望根据显示的视图向活动导航视图动态添加一个(右对齐)按钮。有什么合适的方法来做这件事吗？我在网上找到了许多一半好的例子，但没有让它们奏效。以下是我尝试的内容：

Ext.define('Sencha.view.user.Login', {
extend:'Ext.navigation.View',
//fullscreen: true,
xtype: 'loginview',

requires:[
    'Ext.form.FieldSet',
    'Ext.field.Email',
    'Ext.field.Password'
],
config: {
    title: 'Log in',
    iconCls: 'use',
    cls: 'kidsbackground',
    scrollable: false,
    navigationBar: {
        items: [

        ]
    },
    items:[
        {
            xtype: 'loginform'
        }
    ]
},
addRightButton:function(button){
    var navigationBar = this.config.navigationBar;
    console.log("navigationBar: "+navigationBar);
    var rightButton = Ext.Button.create({
        xtype: 'button',
        ui: 'action',
        iconCls: 'action',
        iconMask: true,
        align: 'right' });

    console.log("rightButton: "+rightButton);
    //navigationBar.addItem(rightButton);

    var oNavigationbar = {
        docked: 'top',

        backButton : {
            margin: 7,
            docked: "left",
            ui : 'back'
        },
        items: [
            Ext.create("Ext.Button", {
                text: "Button1"
            }),
            Ext.create("Ext.Button", {
                text: "Button2",
                align: "right"
            })
        ]
    };
    this.setNavigationBar(oNavigationbar);
    /*this.setNavigationBar({
        items: [
            {
             id: 'rightButton',
             xtype: 'button',
             text: 'yes!'
             //placeHolder: 'Search...',
             //align: 'right'
             }
        ]
    });*/
    console.log("wow, no crash, really ?");
}
});

当我运行上面的代码时，我收到奇怪的错误，其中之一是(见附件)：

推荐答案

您可以在Sencha Touch 2 Navigation View example：

上尝试此代码(在Chrome开发人员工具的控制台中)

Ext.ComponentQuery.query('navigationview')[0].getNavigationBar().add({
    xtype:'button',
    text:'Right',
    align:'right'
});

基本上是获取navigationview，然后是该视图的导航栏，最后是添加按钮。

这是将按钮添加到导航栏的正确方法。

希望这能有所帮助

这篇关于将(右)按钮添加到Sencha导航视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！