How do you set the title color for the new Toolbar?
Here is my solution if you need to change only color of title and not color of text in search widget.
layout/toolbar.xml
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:background="@color/toolbar_bg"
app:theme="@style/AppTheme.Toolbar"
app:titleTextAppearance="@style/AppTheme.Toolbar.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"/>
values/themes.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.ActionBar">
<!-- Customize color of navigation drawer icon and back arrow -->
<item name="colorControlNormal">@color/toolbar_icon</item>
</style>
<style name="AppTheme.Toolbar.Title" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
<!-- Set proper title size -->
<item name="android:textSize">@dimen/abc_text_size_title_material_toolbar</item>
<!-- Set title color -->
<item name="android:textColor">@color/toolbar_title</item>
</style>
</resources>
In the similar way, you can set also subtitleTextAppearance.
If you are supporting API 23 and above, you can now use the titleTextColor attribute to set the Toolbar's title color.
layout/toolbar.xml
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:titleTextColor="@color/colorPrimary"
/>
MyActivity.java
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar)
toolbar.setTitleTextColor(Color.WHITE);
Option 1) The quick and easy way (Toolbar only)
Since appcompat-v7-r23 you can use the following attributes directly on your Toolbar
or its style:
app:titleTextColor="@color/primary_text"
app:subtitleTextColor="@color/secondary_text"
If your minimum SDK is 23 and you use native Toolbar
just change the namespace prefix to android
.
In Java you can use the following methods:
toolbar.setTitleTextColor(Color.WHITE);
toolbar.setSubtitleTextColor(Color.WHITE);
These methods take a color int not a color resource ID!
Option 2) Override Toolbar style and theme attributes
layout/xxx.xml
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.MyApp.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
style="@style/Widget.MyApp.Toolbar.Solid"/>
values/styles.xml
<style name="Widget.MyApp.Toolbar.Solid" parent="Widget.AppCompat.ActionBar">
<item name="android:background">@color/actionbar_color</item>
<item name="android:elevation" tools:ignore="NewApi">4dp</item>
<item name="titleTextAppearance">...</item>
</style>
<style name="ThemeOverlay.MyApp.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
<!-- Parent theme sets colorControlNormal to textColorPrimary. -->
<item name="android:textColorPrimary">@color/actionbar_title_text</item>
</style>
Help! My icons changed color too!
@PeterKnut reported this affects the color of overflow button, navigation drawer button and back button. It also changes text color of SearchView
.
Concerning the icon colors: The colorControlNormal
inherits from
android:textColorPrimary
for dark themes (white on black)android:textColorSecondary
for light themes (black on white)
If you apply this to the action bar's theme, you can customize the icon color.
<item name="colorControlNormal">#de000000</item>
There was a bug in appcompat-v7 up to r23 which required you to also override the native counterpart like so:
<item name="android:colorControlNormal" tools:ignore="NewApi">?colorControlNormal</item>
Help! My SearchView is a mess!
Note: This section is possibly obsolete.
Since you use the search widget which for some reason uses different back arrow (not visually, technically) than the one included with appcompat-v7, you have to set it manually in the app's theme. Support library's drawables get tinted correctly. Otherwise it would be always white.
<item name="homeAsUpIndicator">@drawable/abc_ic_ab_back_mtrl_am_alpha</item>
As for the search view text...there's no easy way. After digging through its source I found a way to get to the text view. I haven't tested this so please let me know in the comments if this didn't work.
SearchView sv = ...; // get your search view instance in onCreateOptionsMenu
// prefix identifier with "android:" if you're using native SearchView
TextView tv = sv.findViewById(getResources().getIdentifier("id/search_src_text", null, null));
tv.setTextColor(Color.GREEN); // and of course specify your own color
Bonus: Override ActionBar style and theme attributes
Appropriate styling for a default action appcompat-v7 action bar would look like this:
<!-- ActionBar vs Toolbar. -->
<style name="Widget.MyApp.ActionBar.Solid" parent="Widget.AppCompat.ActionBar.Solid">
<item name="background">@color/actionbar_color</item> <!-- No prefix. -->
<item name="elevation">4dp</item> <!-- No prefix. -->
<item name="titleTextStyle">...</item> <!-- Style vs appearance. -->
</style>
<style name="Theme.MyApp" parent="Theme.AppCompat">
<item name="actionBarStyle">@style/Widget.MyApp.ActionBar.Solid</item>
<item name="actionBarTheme">@style/ThemeOverlay.MyApp.ActionBar</item>
<item name="actionBarPopupTheme">@style/ThemeOverlay.AppCompat.Light</item>
</style>