ziwert ziwert - 3 months ago 39
Android Question

Android AppCompatActivity ActionBar style

I'm trying customize the ActionBar in my app. I want to change background color and text color.
My

styles.xml
below

<resources>

<!-- Base application theme. -->
<style name="AppTheme.NoActionBar" parent="@style/Theme.AppCompat.Light.DarkActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>

<item name="android:actionBarStyle">@style/AppTheme.ActionBar</item>

<!-- Support library compatibility -->
<item name="actionBarStyle">@style/AppTheme.ActionBar</item>
</style>

<style name="AppTheme.ActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">
<item name="android:background">@color/actionbar_background</item>
<item name="android:titleTextStyle">@style/AppTheme.ActionBar.TitleTextStyle</item>

<!-- Support library compatibility -->
<item name="background">@color/actionbar_background</item>
<item name="titleTextStyle">@style/AppTheme.ActionBar.TitleTextStyle</item>
</style>

<style name="AppTheme.ActionBar.TitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">@color/actionbar_text_color</item>
</style>

</resources>


In my
AndroidManifest.xml
I added
android:theme="@style/AppTheme.NoActionBar"
. In my activity I added the action bar with code

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="@style/AppTheme.ActionBar" />


In result I have the action bar with correct color but incorrect text color.
Please, note what I use AppCompat, not Holo or other.
What's wrong?

Answer

This is happening because your Toolbar's theme is set to light, hence the Android picks a dark (black) text colour.

You need to update it to following:

<style name="AppTheme.ActionBar" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="titleTextColor">#FF0001</item>
    <item name="subtitleTextColor">#FF0001</item>
    <!-- your other theme attributes -->
</style>

Notes:

  1. For Toolbar themes, use ThemeOverlay instead of Theme.AppCompat. Related - When should one use Theme.AppCompat vs ThemeOverlay.AppCompat?,
  2. replace #FF0001 with any colour you like. This is the colour of your title text.