Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change the title color when using Theme.AppCompat.Light.NoActionBar

I am creating my own action bar with menu items and therefore using Theme.AppCompat.Light.NoActionBar.

I want to have the action bar purple and the title color white, but at the moment it is black.

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

my action bar xml is:

<android.support.v7.widget.Toolbar  
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:background="@color/colorPrimary"
   android:id="@+id/app_bar"
>
like image 555
Danielle Robinson Avatar asked Mar 21 '16 22:03

Danielle Robinson


People also ask

How do you change the color of the title bar on Android?

In method 1 Just go to the activity_main. xml file and add a TextView in the toolbar widget with the text color attribute.

What is theme AppCompat?

The AppCompat themes provide material design styles for some widgets used as building blocks for our components.

How to set theme Android?

Settings. Under Display Options, tap Theme. Select the theme for this device: Light—White background with dark text.

What is the difference between Action bar and Toolbar in Android?

What is the difference between the toolbar and the action bar? The most obvious difference between the two is the updated visual design of the toolbar. The toolbar no longer includes an icon on the left side and decreases some of the spacing between the action items on the right side.


1 Answers

As explained in this Google+ pro-tip, you can use a ThemeOverlay to customize only certain things. This is useful for when you need to make text light on a dark background, which can be achieved by adding android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" to your Toolbar:

<android.support.v7.widget.Toolbar  
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="@color/colorPrimary"
  android:id="@+id/app_bar"
  android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
>

This technique was further discussed in the Theming with AppCompat blog+video.

like image 172
ianhanniballake Avatar answered Sep 29 '22 23:09

ianhanniballake