Nativescript - 通过代码添加 ActionBar答案

【问题标题】：Nativescript - Add ActionBar through CodeNativescript - 通过代码添加 ActionBar
【发布时间】：2018-10-18 04:42:45
【问题描述】：

原问题： 只是想看看是否可以通过 Nativescript JS 中的代码添加操作栏如果是这样，你会怎么做？

新问题：所以下面的代码会动态加载actionbar：

var actionB = require("tns-core-modules/ui/action-bar).ActionBar;

var actB = new actionB();
actB.title = "Action Bar";
actB.id = "actionID"

page.content = actB;

现在我只需要知道如何为 android 和 ios 加载导航项和操作项

谢谢

【问题讨论】：

我没有亲自尝试过，但应该与您在stackoverflow.com/questions/52825771/…中添加网格和滚动视图的方式相同
虽然我已经为 android 和 ios 使用不同的 htms 创建了一个用于操作栏的共享组件，并且我在所有其他 html 之上使用它
那将是完美的。我想要完全实现的是添加和删除一个导航项，或者加载一个操作栏，然后如果我想要一个不同的，加载那个。
所以让它动态工作，现在只需要知道如何加载导航项

标签： javascript nativescript

【解决方案1】：

ActionBar 适用于Page 内的Frame。使用Page 的actionBarHidden 属性来显示/隐藏ActionBar。使用ActionBar 的actionItems 属性添加操作项。

【讨论】：

我认为 Op 的问题是如何使用 html 中没有的代码动态添加操作栏 :)
是的，很抱歉不清楚。几天来一直在参加这个计划。只想做类似的事情。 page.addChild(Actionbar);
不，这样不行。它始终是页面的一部分，您可以决定使用该属性隐藏或显示它。如果您愿意，可以动态设置项目/导航按钮。

【解决方案2】：

var actionB = require("tns-core-modules/ui/action-bar).ActionBar;

var actB = new actionB();
actB.title = "Action Bar";
actB.id = "actionID"

var actionItemC = require("tns-core-modules/ui/action-bar).ActionItem;

var actItem = new actionItemC();
actB._addView(actItem)

如果你想添加导航按钮

private getNavigationButton() {
    let navActionItem = new ActionItem();
    navActionItem.icon = 'res://ic_menu_white';
    if (navActionItem.ios) {
        navActionItem.ios.position = 'left';
    }
    navActionItem.on('tap', this.toggleDrawer.bind(this));
    return navActionItem;
}

和

if (isAndroid) {
        page.actionBar.navigationButton = this.getNavigationButton();
    }

    if (isIOS) {
        page.actionBar.actionItems.addItem(this.getNavigationButton());
    }

【讨论】：

如果你想添加 NavigationButton 而不是从同一个操作栏模块导入它。 require("tns-core-modules/ui/action-bar).NavigationButton
我正在尝试添加一个 NavigationButton：var navB = new navButton(); navB.systemIcon = "ic_menu_btn_add": actionB._addView(navB);但我什么也得不到
调试的时候能看到分配给navB的图标是什么吗？
当我 console.log(navB.systemIcon);结果是 ic_menu_btn_add 你是这个意思吗？
那太好了，要不要试试 actionB.content = navB;或者可以将所有导航项添加到网格或堆栈布局中，然后添加。