aaronmgdr
aaronmgdr

Reputation: 83

Android: windowLightNavigationBar not working

Background: My background is in web development, ruby and javascript. I'm working on a mostly react-native app, so very likely I'm missing something basic.

What I want

android navigation bar to be white with dark system buttons see image in link white navigation bar

My Current Code

res/values/style.xml

<resources>
  <style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="android:windowDrawsSystemBarBackgrounds">true</item>
    <item name="android:windowLightNavigationBar">true</item> 
    <item name="android:windowTranslucentNavigation">false</item>
    <item name="android:navigationBarColor">#FFFFFF</item>
  </style>
</resources>

What is happening instead

The background AND the buttons are white. which is not so great for UX.

** What I have Tried **

this is what got me where I am now Change navigation bar icon color on Android

I have tried putting style.xml in a values-v27 folder.

Upvotes: 4

Views: 8023

Answers (3)

Rikkert
Rikkert

Reputation: 100

I just worked on this same topic and found out you need to run at least Android 8.1 (or API level 27) on the device/emulator for this to work.

Also, I had to add this to the color of the bar:

<item name="android:navigationBarColor">@android:color/white</item>

So, recommended steps:

  • Create a values-v27 folder
  • Insert the style:
<item name="android:navigationBarColor">@android:color/white</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:windowLightNavigationBar">true</item>

In your other values folder, you kind of have to live with the fact that this windowsLightNavigationBar doesn't apply...

Small remark

I also found a bug on this change, when putting app in background and then opening it again, the navbar buttons stay white for a second before getting the dark color

Upvotes: 6

yital9
yital9

Reputation: 6702

A new approach would be:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
    window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS)
    window.navigationBarColor = ContextCompat.getColor(this, android.R.color.white)
    WindowInsetsControllerCompat(window, window.decorView).isAppearanceLightNavigationBars = true
}

Upvotes: 1

Gavin Wright
Gavin Wright

Reputation: 3212

Your code is working as intended for me. Make sure you have the file name and file path written correctly:

https://i.sstatic.net/HpB47.jpg

Upvotes: 0

Related Questions