How to change the color of Action Bar in an Android App?

In this article, you will learn how to change the colour of the Action Bar in an Android App.

There are two ways to change color.

  1. By changing styles.xml file:
    • Just go to res/values/styles.xml file
    • edit the xml file to change the color of action bar.
    • Code for styles.xml is given below

    styles.xml

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <resources>
      
        <!-- Base application theme. -->
        <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
            <!-- Customize your theme here. -->
            <!-- This code is for changing the color of the bar. -->
            <!-- Type your colour code which you want to set in colorPrimary item -->
            <item name="colorPrimary">#0F9D58</item>
            <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
            <item name="colorAccent">@color/colorAccent</item>
        </style>
        <style name="AppTheme.NoActionBar">
            <item name="windowActionBar">false</item>
            <item name="windowNoTitle">true</item>
        </style>
        <!-- Define other styles to fix theme -->
        <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
        <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
    </resources>

    chevron_right

    
    

    activity_main.xml

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <?xml version="1.0" encoding="utf-8"?>
      
    <!--Relative Layout-->
    <RelativeLayout
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/relativelayout">
      
        <!--Text View-->
       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:id="@+id/textview"
           android:textColor="#0F9D58"
           android:textSize="32dp"
           android:layout_centerInParent="true"/>
    </RelativeLayout>

    chevron_right

    
    

    MainActivity.java

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    package com.geeksforgeeks.changecolor;
    import android.widget.TextView;
    import android.support.v7.app.AppCompatActivity;
      
    public class MainActivity extends AppCompatActivity {
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            // Define text View
            TextView t = findViewById(R.id.textview);
            t.setText("Geeks for Geeks");
        }
    }

    chevron_right

    
    

  2. Through Java file by defining ActionBar object:
    • Define object for ActionBar and colorDrawable class
    • set color using setBackgroundDrawable function with colorDrawable object as its parameter.
    • Here is complete code for MainActivity.java

    MainActivity.java

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    package com.geeksforgeeks.changecolor;
      
    import android.support.v7.app.ActionBar;
    import android.graphics.Color;
    import android.graphics.drawable.ColorDrawable;
    import android.support.v7.app.AppCompatActivity;
      
    public class MainActivity extends AppCompatActivity {
      
        @Override
        protected void onCreate(Bundle savedInstanceState)
        {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
      
            // Define ActionBar object
            ActionBar actionBar;
            actionBar = getSupportActionBar();
      
            // Define ColorDrawable object and parse color
            // using parseColor method
            // with color hash code as its parameter
            ColorDrawable colorDrawable
                = new ColorDrawable(Color.parseColor("#0F9D58"));
      
            // Set BackgroundDrawable
            actionBar.setBackgroundDrawable(colorDrawable);
        }
    }

    chevron_right

    
    

    activity_main.xml

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <?xml version="1.0" encoding="utf-8"?>
      
    <!--Relative Layout-->
    <RelativeLayout 
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/relativelayout">
      
        <!--Text View-->
       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:textColor="#0F9D58"
           android:textSize="30dp"
           android:text="Geeks for Geeks"
           android:layout_centerInParent="true"/>
    </RelativeLayout>

    chevron_right

    
    

Output:

  • Default color of action Bar:

  • In Main Activity color of Action Bar is changed to hash code defined in above code.

Attention reader! Don’t stop learning now. Get hold of all the important DSA concepts with the DSA Self Paced Course at a student-friendly price and become industry ready.




My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :
Practice Tags :


6


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.