NativeScript 主题 - 将其设置为浅色模式

Posted 2023-04-13

【中文标题】NativeScript 主题 - 将其设置为浅色模式

【英文标题】：NativeScript Theme - setting it to light mode

【发布时间】：2021-03-18 16:23:36

【问题描述】：

我正在使用 NativeScript 6.8.0 和 Angular 8.2 开发一个应用程序。

我还使用 NativeScript 主题来设置我的应用程序和 sass 的样式： https://github.com/NativeScript/theme

问题出在 ios 上，默认似乎总是暗模式。

我已使用此列表键将其更改为轻模式，它确实有效，但仅适用于 iOS 13+：

https://developer.apple.com/documentation/bundleresources/information_property_list/uiuserinterfacestyle

<key>UIUserInterfaceStyle</key>    
<string>Light</string>

文档说还有一种编程方式可以做到这一点： https://github.com/NativeScript/theme#setting-dark-or-light-mode

但是，当我尝试这样做时，我的应用程序崩溃了。

我试图将这段代码放在我的 app.module 文件中，但是当我试图打开它时我的应用程序崩溃了。

import Theme from "@nativescript/theme";

Theme.setMode(Theme.Dark); // Or Theme.Light

我也尝试过将 app.component 文件中的代码放入各种生命周期挂钩中，但应用程序也崩溃了。

最后，我尝试将它添加到我的 SideDrawer on load 事件中，但这也不起作用。

<RadSideDrawer [drawerTransition]="sideDrawerTransition" [gesturesEnabled]="false" (loaded)="loadedDrawer()">
    <GridLayout tkDrawerContent rows="auto, *" class="sidedrawer sidedrawer-left">
        <ns-side-drawer></ns-side-drawer>
    </GridLayout>
    <page-router-outlet tkMainContent></page-router-outlet>
</RadSideDrawer>

我在哪里可以设置主题以便我的应用不会崩溃？

【参考方案1】：

看看这些：

https://github.com/NativeScript/theme/issues/277

以及建议的修复方法（尚未尝试）：

https://github.com/NativeScript/theme/pull/285

我目前在 main.ts 中这样做

setTimeout(() => 
    Theme.setMode(Theme.Light);
, 200);

【讨论】：

你会把它放在主应用程序组件中还是放在主应用程序模块中？

我在我的应用程序组件的“加载”事件中得到了这个，没有超时。在此之前，我在 main.ts 中有它（有超时）。