CODEWITHSUNDEEP
androidandroid-layoutandroid-toolbar
Isaac Perez
Isaac Perez

Reputation: 590

Trying to make background of text within a toolbar transparent

I have a toolbar containing a title that looks like this:

enter image description here

How do I get rid of the background color behind the title text "Camera"?

This is my layout:

<FrameLayout
    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:id="@+id/recycler_view_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimaryDark">

    <android.support.v7.widget.RecyclerView 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:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        android:paddingTop="?attr/actionBarSize"
        tools:context=".ActivityGallery">
    </android.support.v7.widget.RecyclerView>

    <android.support.v7.widget.Toolbar
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:id="@+id/toolbar_top"
        android:theme="@style/StyleToolBarWhite" />
</FrameLayout>

And my styles.xml:

<style name="StyleToolBarWhite">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
    <item name="titleTextAppearance">@style/StyleToolbarText</item>

    <item name="android:background">@color/colorTint</item>
    <!-- Support library compatibility -->
    <item name="background">@color/colorTint</item>
</style>

<style name="StyleToolbarText">
    <item name="android:background">@null</item>
</style>

@color/colorTint is the transparent color of the entire toolbar. If I remove those background items in my style, I get what I want except the toolbar then loses the "tint" color and becomes completely transparent. How do I separate the background color of the entire toolbar from the background of the text within the toolbar?

Upvotes: 0

Views: 77

Answers (1)

user10053723
user10053723

Reputation: 

<style name="StyleToolBarWhite">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
</style>

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@color/colorTint"
    android:theme="@style/StyleToolBarWhite" />

Upvotes: 2

Related Questions