Question

我已经用NativeScript Angular构建了一个应用程序（现在在v4.1上）。我正在使用下面的代码在Android上设置状态栏颜色，通过使用角形路由，该颜色可以很好地用于“常规”视图：

if (isAndroid) {
  if (app.android && device.sdkVersion >= '21') {
    const nativeColor = new Color('purple').android;
    const window = app.android.startActivity.getWindow();
    window.addFlags(android.view.WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
    app.android.startActivity.getWindow().setStatusBarColor(nativeColor);
  }
}

但是，它不能在模式状态下工作，在模式状态下，状态栏变为黑色。任何人有任何想法为什么会这样吗？我最好的猜测是app.android.startActivity.getWindow()没有引用模式，但是我不清楚如何获取它。

不知道这在多大程度上与之相关，但是我也无法通过使用文档中的以下代码在iOS上的模式中设置不同的加载指示器（同样可以在非模式视图中正常工作）：

if (isIOS) {
  var indicator = this.page.getViewById("spinner");
  indicator.ios.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.WhiteLarge;
}

感谢任何指针！

P.S。

这里是demo project，它既显示Android状态栏上的问题，又无法设置iOS上的活动指示器。

Answer 1

对于以后阅读本文的任何人：我在NativeScript forum上获得了一些帮助，但尚未完成在模态上设置状态栏颜色，但是我能够在模态下的状态栏下显示背景足以满足我的目的的组件。

我还能够简单地通过在指标元素上使用角度ViewChild而不是通过Page找到它来更改模式中的ActivityIndicator（事实证明这并不涉及模式）。

import { Component, OnInit, AfterViewInit, ViewChild, ElementRef } from "@angular/core";
import { ModalDialogParams } from "nativescript-angular/modal-dialog";
import { isIOS, isAndroid, device } from 'platform';
import * as app from "application";

declare var UIActivityIndicatorViewStyle: any;
declare var android: any;

@Component({
    template: `
        <StackLayout #root>
            <StackLayout orientation="horizontal">
                <ActivityIndicator #spinner id="spinner" busy="true"></ActivityIndicator>
                <ActivityIndicator busy="true"></ActivityIndicator>
            </StackLayout>
        </StackLayout>
    `
})
export class ModalTest implements OnInit, AfterViewInit {
    @ViewChild('root') root: ElementRef;
    @ViewChild('spinner') spinner: ElementRef;

    constructor(
        public modalParams: ModalDialogParams
    ) {}

    public ngOnInit() {

        /* show large activity indicator on iOS */

        if (isIOS) {
            this.spinner.nativeElement.ios.activityIndicatorViewStyle = UIActivityIndicatorViewStyle.WhiteLarge;
        }
    }

    public ngAfterViewInit() {
        if (isAndroid) {

            setTimeout(() => {
                if (app.android && device.sdkVersion >= '21') {
                    const dialog = this.root.nativeElement._dialogFragment.getDialog();
                    const window = dialog.getWindow();
                    window.addFlags(android.view.WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
                }
            },1);
        }
    }

    public closeModal() {
        this.modalParams.closeCallback();
    }
}

从NativeScript 4开始如何正确引用模式

1 个答案: