Fullhdpixel
Fullhdpixel

Reputation: 813

Android Toolbar set background color to semitransparent color

Is it possible to set the toolbar background color to a semi transparent color, on top of a Google Map.

I tried two things:

XML:

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

Java:

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);
getSupportActionBar().setTitle(distanceText);

getSupportActionBar().setBackgroundDrawable(new ColorDrawable(Color.parseColor("#963f51b5")));

None seem to work, which makes me think this is impossible?

Upvotes: 0

Views: 2202

Answers (1)

Isaac
Isaac

Reputation: 1452

It should work if you set the background of your AppBarLayout to transparent.

e.g:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

    <LinearLayout
        android:id="@+id/content_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!--Add the rest of your views in here-->
    </LinearLayout>

    <!--Needs to be at the bottom so it's shown over all the other views-->
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        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="#963f51b5"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>
</RelativeLayout>>

Result:

enter image description here

Upvotes: 8

Related Questions