首页 > 解决方案 > 如何在 nativescript 中显示模态视图时将窗口背景变为黑色

问题描述

如下图 1 所示,当 ios 13 上的模态视图出现时,默认背景为黑色。但是在nativescript上,默认的背景是白色的,如图2。如何使用nativescript核心实现图像1的背景(黑色)?我尝试更改状态栏的颜色,但这实际上改变了图像中部分可见的首页部分的颜色。我试图在 Frame css 上定义背景颜色,但没有奏效。有什么建议么?提前致谢。

图 1:在此处输入图像描述

图 2:在此处输入图像描述

模态视图选项:

const option: ShowModalOptions = {
    context: { selectedAccount: account },
    closeCallback: (a, b, c, action) => {
        //some code
    },
    fullscreen: false
};
mainView.showModal("./modal-add-page", option);

标签: nativescriptangular2-nativescriptnativescript-vuenativescript-telerik-ui

解决方案


您必须在 iOS 上设置窗口的背景颜色。

更新:Nativescript 7

import * as app form "@nativescript/core/application";
import { Color } from "@nativescript/core/color";
import { isIOS } from '@nativescript/core';
    
if (isIOS) {

   if (app.hasLaunched) {
      app.ios.window.backgroundColor = new Color("black").ios;

   } else {
     app.on("launch", _ =>  app.ios.window.backgroundColor = new Color("black").ios)

   }
}

旧版本:

import * as app form "tns-core-modules/application";
import { Color } from "tns-core-modules/color";

// You must run it once application is initiated
app.ios.window.backgroundColor = new Color("black").ios;

推荐阅读