Nativescript android удаляет панель действий

Я пытаюсь разработать приложение для Android с помощью Nativescript и пытаюсь удалить панель действий (верхняя панель с названием "testns" ), но не знаю, как это сделать. Я использую код ниже, но не работаю. В настоящее время используется tns v.1.3.0

var frameModule = require("ui/frame"); exports.pageLoaded = function(){ var topmost = frameModule.topmost(); topmost.android.showActionBar = false; };

Ответы

Ответ 1

Вы можете явно контролировать видимость ActionBar, установив свойство actionBarHidden Page, посмотрите на это:

import {Page} from "ui/page";

export class AppComponent {
    constructor(page: Page) {
        page.actionBarHidden = true;
    }
}

Ответ 2

Наконец, я нахожу ответ, как удалить панель действий. Добавив actionBarHidden = "true" внутри тега в файл xml:

<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded" actionBarHidden="true">
</Page>

Ответ 3

Это код для скрытия панели действий в вашем компоненте NativeScript Angular TypeScript.

import { Component, OnInit } from "@angular/core";
import { Page } from "tns-core-modules/ui/page";

export class AppComponent implements OnInit {

    constructor(private page: Page) {
    }

    ngOnInit(): void {
        this.page.actionBarHidden = true;
    }
}

Ответ 4

Если вы используете angular, и вы не используете page в html, или вы используете ленивую загрузку модулей, или у вас есть несколько page-router-outlet, вы пользуетесь директивами.

Создайте новую директиву:

hideActionBar.ts

import { Directive } from '@angular/core';
import { Page } from 'tns-core-modules/ui/page/page';

@Directive({
    selector: '[hideActionBar]'
})
export class HideActionBarDirective {
    constructor(private page: Page) {
        this.page.actionBarHidden = true;
    }
}

и используйте эту директиву для HTML, где вы хотите скрыть панель действий.

SecondPage.html

<GridLayout tkExampleTitle tkToggleNavButton rows="auto,*" hideActionBar>
 ...// other html goes here
</GridLayout>

PS Не забудьте объявить это в NgModule, так как директивы являются декларативными. Это очень полезно для проектов совместного использования кода, так как вы будете объявлять его в ngmodule.tns.ts, и он не будет скомпилирован для веб-проекта.

declarations: [
 AppComponent,
 MyDirective
],

Ответ 5

Есть два способа добиться этого:

Разметка XML: просто добавьте 'actionBarHidden = "true"' к разметке вашей страницы. то есть <Page loaded="pageLoaded" actionBarHidden="true"> </Page>

<StackLayout verticalAlignment="middle"> 
    <Button text="{{ abHidden ? 'Show ActionBar' : 'Hide ActionBar' }}" tap="onTap" textWrap="true" class="fa" />
</StackLayout>

и в твоем .ts

export function onNavigatingTo(args: EventData) {
    const page = <Page>args.object;
    const vm = new Observable();
    vm.set("abHidden", value);
    page.bindingContext = vm;
}

Ответ 6

ActionBar {
  height: 0;
}

<ActionBar [title]="appTitle">
</ActionBar>