CODEWITHSUNDEEP
javascriptnativescript
TheGoldenD0nut
TheGoldenD0nut

Reputation: 133

Nativescript - Add ActionBar through Code

Original Question: Just trying to find out if you can add an action bar through code in Nativescript JS And if so, How would you go about it?

New Question: So the following code loads the actionbar dynamically:

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

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

page.content = actB;

Now I just need to know how would I load navigation item and action item for android and ios

Thanks

Upvotes: 0

Views: 591

Answers (2)

Narendra
Narendra

Reputation: 4574

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)

and if you want to add navigation button

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;
}

and

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

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

Upvotes: 1

Manoj
Manoj

Reputation: 21908

ActionBar is applicable for Page inside a Frame. Use actionBarHidden property of Page to show / hide ActionBar. Use actionItems property of ActionBar to add action items.

Upvotes: 1

Related Questions