如何在 Android 上使用 NativeScript 和 Angular 更改 StatusBar 颜色或将其设置为透明？

Question

我将 NativeScript 与 Angular 一起使用，但我似乎无法更改项目中的 StatusBar 颜色或将其设置为透明（这些都可以）。相反，它不是完全透明的，而是半透明的黑色，所以背景会在它后面滚动，但会被 StatusBar 变暗。我想将其设置为透明或更改颜色（与页面背景相同）

我的尝试：

• 更改 App_Resources/Android/src/main/res/values/colors.xml 中的“ns_primaryDark”和“ns_primary”颜色 （如果我将 TranslucentStatus" 设置为 false，则在启动屏幕上工作；
• 在 App_Resources/Android/src/main/res/values/styles.xml 中的 <style name="AppThemeBase" parent="Theme.AppCompat.Light.NoActionBar"> 中设置 <item name="android:windowTranslucentStatus"></item> 没有任何区别，尽管在 <style name="LaunchScreenThemeBase" parent="Theme.AppCompat.Light.NoActionBar"> 上工作正常（启动屏幕）；
• 设置 <item name="android:windowLightStatusBar">true</item> 会将文本颜色更改为黑色，并且在启动屏幕和主应用程序上都可以使用；
• 在任何组件的构造函数中使用下面的代码不会改变我的应用程序中的任何内容，但它可以在我尝试过的另一个项目中运行（详情如下），将颜色设置为黑色：

let window = app.android.startActivity.getWindow();
window.setStatusBarColor(new Color("black").android);

我还尝试过的一件事是在我下载的另一个项目上执行这些步骤（确切地说是https://github.com/NativeScript/nativescript-ui-samples/tree/master/chart 这个）并且它有效，所以我认为我在我的应用程序中使用的模板可能会“覆盖”状态栏的任何设置。

然后我尝试使用与我相同的模板制作一个新项目，但我发现 它也不起作用。模板是我的问题吗？如果是这样，有什么办法可以绕过它？

我使用的模板是这个：https://github.com/NativeScript/nativescript-app-templates/tree/master/packages/template-tab-navigation-ng（也适用于“tns create my-app-name --template tns-template-tab-navigation-ng”）。 p>

非常感谢。

Answer 1

将以下代码添加到您的main.ts，应该可以完成这项工作。

import * as application from "tns-core-modules/application";

declare var android;

application.android.on(application.AndroidApplication.activityCreatedEvent, (event) => {

    const activity = event.activity;

    if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
        activity.getWindow().addFlags(android.view.WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
        activity.getWindow().clearFlags(android.view.WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        activity.getWindow().addFlags(android.view.WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
        activity.getWindow().setStatusBarColor(android.graphics.Color.TRANSPARENT);
    } else {
        activity.getWindow().addFlags(android.view.WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
    }

    const parent = activity.findViewById(android.R.id.content);
    for (let i = 0; i < parent.getChildCount(); i++) {
        const childView = parent.getChildAt(i);
        if (childView instanceof android.view.ViewGroup) {
            childView.setFitsSystemWindows(true);
            childView.setClipToPadding(true);
        }
    }
});

这和图书馆里的差不多。如果您喜欢使用该库，则必须将其包含在您的应用程序 grad 中并访问 StatusBarUtil 类。

Answer 2

你可以使用这个库来透明你的状态栏Library

编译'com.jaeger.statusbarutil:library:1.4.0'

要使任何特定活动透明，您可以简单地使用它

StatusBarUtil.setTransparent(Activity 活动)

它看起来像这样