How to change the color of above Toolbar?

Question

I am new in android development and I do not know that what it is actually called(Above space of Toolbar which is shown in the image below or where time and battery sign is showing.) and I want to fill custom color on it so please tell me how to fill the color on it. thank you...

Below is my XML file

   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#eee">
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="com.devbhoomimedia.maangal.ProfilesActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:titleTextColor="#ffffff"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar"/>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="40dp"
            app:tabTextColor="#ffffff"
            app:tabMode="scrollable"
            app:tabGravity="fill"
            android:background="#2f6b00"
            app:tabIndicatorColor="@android:color/white"
            app:tabIndicatorHeight="4dp"/>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
    <include layout="@layout/content_main" />

</android.support.design.widget.CoordinatorLayout>

<android.support.design.widget.NavigationView
    android:id="@+id/navigation_view"
    android:layout_height="match_parent"
    android:layout_width="wrap_content"
    android:layout_gravity="start"
    app:headerLayout="@layout/nav_header"
    app:menu="@menu/menu_nevigation"
    app:itemTextAppearance="?android:attr/textAppearance"/>

In res there is value folder in that colors.xml file will be there .In that colorPrimaryDark color is there.Change the color code there.It will help you to change the color — R.Anjali, Feb 07 '18 at 12:39
Does this answer your question? [How to change the status bar color in Android?](https://stackoverflow.com/questions/22192291/how-to-change-the-status-bar-color-in-android) — Vega, Jan 06 '23 at 10:19

Abhishek kumar · Answer 1 · 2018-02-07T13:40:41.150

2

Try below :

Go to app -> res -> value -> colors.xml - change colorPrimaryDark color

<color name="colorPrimaryDark">#030239</color>

or,

<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/color_primary</item>
    <item name="colorPrimaryDark">@color/color_secondary</item>
    <item name="colorAccent">@color/color_accent</item>
     <!---Below is the code for status bar color------>
    <item name="android:statusBarColor">@color/color_secondary</item>
</style>

or,

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(Color.RED);
}

edited Feb 07 '18 at 13:40

answered Feb 07 '18 at 12:38

Abhishek kumar

4,347
8
29
44

Let check him @sudha, He is not replying ? – Abhishek kumar Feb 07 '18 at 13:52
I was offline that's why I din reply. now let me check – Paramjeet Singh Feb 08 '18 at 05:06

score 2 · Accepted Answer · answered Feb 07 '18 at 12:46

2

View above the Toolbar is officially know as status bar in android and to change color of status bar check out the answer of this question How to change the status bar color in android

answered Feb 07 '18 at 12:46

Kapil Rajput

11,429
9
50
65

score 0 · Answer 3 · answered Feb 07 '18 at 12:47

You can use this for API Level 21 and above: Place this is your values-v21/styles.xml
-> The space on the top of toolbar is called StatusBar.

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/color_primary</item>
        <item name="colorPrimaryDark">@color/color_secondary</item>
        <item name="colorAccent">@color/color_accent</item>
        <item name="android:statusBarColor">@color/color_primary</item>
    </style>
</resources>

Check popular answer At Here.

Happy Coding...

How to change the color of above Toolbar?

3 Answers3