После дополнительных исследований и испытаний я смог найти решение, которое работает как задумано.Кроме того, я объясню причины, по которым некоторые другие методы не работали должным образом.
Прежде всего это <Page actionBarHidden="true">
.Согласно моим исследованиям и тестированию, это работает, только если вы разрабатываете только для nativescript, а не как проект совместного использования кода Angular + Nativescript.Причина этого в том, что при использовании Angular для веб-разработки мы используем <router-outlet></router-outlet>
, для новичков в Angular это обрабатывает изменение маршрутов в приложении и показывает правильный компонент на основе маршрута.
Теперь, когда мы начинаем делать Nativescript, мы хотели бы повторно использовать как можно больше кода, включая наши маршруты.В этом случае мы используем <page-router-outlet></page-router-outlet>
в нашем файле app.component.tns.html
.Так же, как Angular, когда мы меняем маршруты, это будет контролировать показ правильного компонента на основе маршрута.
Проблема возникает из-за того, что <page-router-outlet></page-router-outlet>
автоматически создает <Page></Page>
для нас.Таким образом, размещение одного в нашем шаблоне, будь то app.component.tns.html
или home.component.tns.html
, не будет работать, потому что оно уже есть, мы просто не можем получить легкую ссылку на него в нашем html-файле.
Для решения проблемыпытаясь сделать это через манифест андроида в вашей папке App_Resources
, мне тоже не повезло с этим.Я верю, потому что когда мы используем <page-router-outlet></page-router-outlet>
Nativescript внутренне изменяет манифест, чтобы отражать и по умолчанию навязывать нам панель действий.Я попытался установить его несколькими различными способами, и независимо от того, что он одинаковый.Мне удалось заставить его работать, хотя папка Platform
, однако я бы не рекомендовал это, поскольку иногда нам нужно удалять и добавлять платформы, и это может привести к тому, что мы забудем или будем вынуждены продолжать реализовывать одно и то же решение, тратя драгоценное время на разработку.
Для следующего выпуска, использующего this.page.actionBarHidden = true;
, этот вопрос относится к той же категории, что и первый выпуск.Когда вы попытаетесь сделать это в файле app.component.tns.ts
, он никогда не будет работать только с этой командой, потому что мы используем <page-router-outlet></page-router-outlet>
.По сути, AppComponent
вообще не видит страницу, потому что она ему не принадлежит.Когда приложение загружается, если ваш первый маршрут по умолчанию указывает на домашний компонент, вам нужно будет использовать этот this.page.actionBarHidden
внутри домашнего компонента.Однако, чтобы не дать сбой в сети, вам нужно создать tns-файл для каждого компонента, у которого есть маршрут для конкретной логики, и который не практичен с точки зрения удобства обслуживания.
Для последнего выпуска мыне должен дублировать код.В этом случае это будет вызывать функцию для каждого файла component.tns.ts
только для того, чтобы удалить то, что нам нужно, для всего приложения.А также для создания дополнительных tns files
, которые нам не нужны, и управления другой службой для запуска одного фрагмента кода, который применяется только к nativescript.
Решение
Это самое простое решение, которое я мог бы решить, которое позволяет управлять панелью действий в одном месте, так что ее легко изменить в любое время.Решение состоит в том, чтобы использовать Angular Router
.В наших ngOnInit
мы подписываемся на события маршрутизаторов.Затем, когда происходит событие Маршрутизатора, мы проверяем и проверяем, является ли это концом Навигации до компонента, на который направляется.На этом этапе, когда эта проверка проходит, приложение уже переместилось на маршрут, и теперь для нас безопасно получить ссылку на этот Frame
или Page
и удалить панель действий.
Nativescript имеет функциюназывается topMost()
, что позволяет нам получить ссылку на отображаемый Frame
или Page
.Согласно определению их кода: Получает самый верхний кадр в стеке кадров.Приложение обычно имеет один экземпляр кадра.Несколько кадров обрабатывают вложенные (иерархические) сценарии навигации.
Таким образом, используя это, мы можем легко получить ссылку на Page
, который в настоящее время отображает кадр.Теперь, когда у нас отображается кадр, мы просто устанавливаем actionBarVisibility
в false;
import { Component } from '@angular/core';
import { Page } from 'tns-core-modules/ui/page';
import { Router, NavigationEnd } from '@angular/router';
import { topmost } from 'tns-core-modules/ui/frame/frame';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
constructor(private _Router: Router, private page: Page) {
}
ngOnInit(): void {
this._Router.events.subscribe((ev) => {
if (ev instanceof NavigationEnd) {
const rootFrame = topmost();
rootFrame.actionBarVisibility = 'never';
}
});
}
}