user2875404
user2875404

Reputation: 3218

Android ToolBar can change back button color but not title color

I want to change my Toolbar title color to blue. It stays white. I was able to set the back button but not the title color - am I missing something?

I've tried to change it at 3 different places:

Activity

    Toolbar toolbar = (Toolbar) findViewById(R.id.detail_toolbar);
    toolbar.setTitleTextColor(0xff00ff99);
    setSupportActionBar(toolbar);

activity.xml

        <android.support.v7.widget.Toolbar
            android:id="@+id/detail_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:theme="@style/ToolBarStyle"
            android:background="@color/colorPrimaryDark"
            android:titleTextColor="@android:color/holo_red_dark"
            app:subtitleTextColor="@color/colorPrimaryDark"
            app:layout_collapseMode="pin"

            app:popupTheme="@style/ToolBarStyle" />

v21 styles.xml

    <!-- ToolBar -->
    <style name="ToolBarStyle" parent="Theme.AppCompat">

    <item name="titleTextColor">@color/colorPrimaryDark</item>
    <item name="android:titleTextColor">@color/colorPrimaryDark</item>
    <item name="android:textColorPrimary">@color/colorPrimaryDark</item>
    <item name="android:textColorSecondary">@color/colorPrimaryDark</item>
    <item name="actionMenuTextColor">@color/colorPrimaryDark</item>
    <item name="android:textColor">@color/colorPrimaryDark</item>
</style>

styles.xml

    <style name="ToolBarStyle" parent="Theme.AppCompat">
    <item name="titleTextColor">@color/colorPrimaryDark</item>
    <item name="android:titleTextColor">@color/colorPrimaryDark</item>
    <item name="android:textColorPrimary">@color/colorPrimaryDark</item>
    <item name="android:textColorSecondary">@color/colorPrimaryDark</item>
    <item name="actionMenuTextColor">@color/colorPrimaryDark</item>
    <item name="android:textColor">@color/colorPrimaryDark</item>
</style>

What am I missing? It stays white no matter what. I've even went through the 150 references to #ffffff in the whole project and nowhere is the toolbar referenced there.

targetSdk 26, running on Android 7.1.1

Upvotes: 1

Views: 658

Answers (4)

Jaspreet Kaur
Jaspreet Kaur

Reputation: 1720

In Layout file use the Toolbar as Child layout of AppBarLayout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
<android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

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

        </android.support.v7.widget.Toolbar>
    </android.support.design.widget.AppBarLayout>
</LinearLayout>

Style.xml

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

Inside MainActivity

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
       Toolbar  toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
}

Upvotes: 0

Sinan Ceylan
Sinan Ceylan

Reputation: 1073

Try to change this:

android:titleTextColor="@android:color/holo_red_dark"

to:

app:titleTextColor="@android:color/holo_red_dark"

in your activity.xml android.support.v7.widget.Toolbar section.

Upvotes: 1

Muhammadjon
Muhammadjon

Reputation: 1506

Create custom Toolbar like this:

toolbar_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout 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:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="false"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?android:attr/actionBarSize"
        android:background="@android:color/backgroundColor"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        app:theme="@style/Base.Theme.AppCompat.Light.DarkActionBar">

        <TextView
            android:id="@+id/toolbar_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/blue"/>

    </android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>

Include it in you layout:

<include layout="@layout/toolbar_layout"/>

Use it in your activity's onCreate method:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_new_card);

    Toolbar toolbar = findViewById(R.id.toolbar);
    TextView toolbarTitle = findViewById(R.id.toolbar_title);

    setSupportActionBar(toolbar);
    if (getSupportActionBar() != null)
        getSupportActionBar().setDisplayShowTitleEnabled(false);

    toolbarTitle.setText("Your title");
    ...
}

Hope it will help.

Upvotes: 2

user2875404
user2875404

Reputation: 3218

Ok so I have found the answer by literally stack tracing my code.

I have a PagerAdapter returning different fragments. I thought that each Activity was responsible to the Tabbar (it's a Master/Detail pattern for different tabs each) as I've had to set stuff like setSupportActionBar() which I've done in the subsequent Activities.

Stacktracing my code I've realized that there is a CollapsingToolbarLayout being find by view ID. This is where I set the bar's title. From there, I didn't find any title property but I've let auto complete lead me to setCollapsedTitleTextColor and setExpandedTitleColor.

So although the getColor() part is deprecated it's

bar.setCollapsedTitleTextColor(getResources().getColor(R.color.colorPrimaryDark));
bar.setExpandedTitleColor(getResources().getColor(R.color.colorPrimaryDark));

Still no idea why all the other places I've set it at didn't do the trick but very happy it's working now.

Upvotes: 0

Related Questions