Android lollipop change navigation bar color

Question

In my app I need to change the bottom navigation bar color. I watched many post but cant find with the solution. I am using appCompat library.

v21/styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light">
       <item name="android:windowBackground">@drawable/bgpreview</item>
       <item name="android:colorPrimary">@color/MyColor</item>
       <item name="android:colorPrimaryDark">@color/MyColor</item>
       <item name="android:windowContentOverlay">@null</item>
       <item name="android:textColorPrimary">@color/MyColor</item>
       <item name="colorAccent">@color/MyColor</item>
       <!-- darker variant for the status bar and contextual app bars -->
       <item name="android:windowContentTransitions">true</item>
       <item name="android:windowAllowEnterTransitionOverlap">true</item>
       <item name="android:windowAllowReturnTransitionOverlap">true</item>
       <item name="android:windowSharedElementEnterTransition">@android:transition/move</item>
       <item name="android:windowSharedElementExitTransition">@android:transition/move</item>

       <item name="windowActionBar">false</item>
       <item name="android:textAllCaps">false</item>

</style>

Answer 1

It can be done inside styles.xml using

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

or

window.setNavigationBarColor(@ColorInt int color)

http://developer.android.com/reference/android/view/Window.html#setNavigationBarColor(int)

Note that the method was introduced in Android Lollipop and won't work on API version < 21.

The second method (works on KitKat) is to set windowTranslucentNavigation to true in the manifest and place a colored view beneath the navigation bar.

Answer 2

Here is how to do it programatically:

if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {                
   getWindow().setNavigationBarColor(getResources().getColor(R.color.your_awesome_color));
}

Using Compat library:

if (android.os.Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    getWindow().setNavigationBarColor(ContextCompat.getColor(this, R.color.primary));
}

Here is how to do it with xml in the values-v21/style.xml folder:

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

Answer 3

Here are some ways to change Navigation Bar color.

By the XML

1- values-v21/style.xml

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

Or if you want to do it only using the values/ folder then-

2- values/style.xml

<resources xmlns:tools="http://schemas.android.com/tools">

<item name="android:navigationBarColor" tools:targetApi="21">@color/navigationbar_color</item>

You can also change navigation bar color By Programming.

 if (Build.VERSION.SDK_INT >= 21)
    getWindow().setNavigationBarColor(getResources().getColor(R.color.navigationbar_color));

By Using Compat Library-

if (Build.VERSION.SDK_INT >= 21) {
    getWindow().setNavigationBarColor(ContextCompat.getColor(this, R.color.primary));
}

please find the link for more details- http://developer.android.com/reference/android/view/Window.html#setNavigationBarColor(int)

Answer 4

You can add the following line in the values-v21/style.xml folder:

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

Answer 5

1. Create Black Color: <color name="blackColorPrimary">#000001</color> (not #000000)
2. Write in Style: <item name="android:navigationBarColor" tools:targetApi="lollipop">@color/blackColorPrimary</item>

Problem is that android higher version make trasparent for #000000

Answer 6

For people using Kotlin you can put this in your MainActivity.kt:

window.navigationBarColor = ContextCompat.getColor(this@MainActivity, R.color.yourColor)

With window being:

val window: Window = [email protected]

Or you can put this in your themes.xml or styles.xml (requires API level 21):

<item name='android:navigationBarColor'>@color/yourColor</item>

Answer 7

You can also modify your theme using theme Editor by clicking :

Tools -> Android -> Theme Editor

Then, you don't even need to put some extra content in your .xml or .class files.

Answer 8

You can change it directly in styles.xml file \app\src\main\res\values\styles.xml

This work on older versions, I was changing it in KitKat and come here.