1

我已经用 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;
}

感谢您的任何指点!

附言

这是一个演示项目,它显示了 Android 上的状态栏以及无法在 iOS 上设置活动指示器的问题。

4

1 回答 1

0

对于稍后阅读此内容的任何人:我在 NativeScript论坛上获得了一些帮助,但尚未完成在模式上设置状态栏颜色,但我能够跨越模式组件中状态栏下的背景,这对我来说已经足够好了目的。

我还能够简单地通过ViewChild在指示器元素上使用 Angular 而不是通过查找它来更改模态中的 ActivityIndi​​cator Page(结果不是指模态)。

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();
    }
}
于 2018-07-22T15:50:24.183 回答