Overlay ImageView on Toolbar

Question

I have this code for my custom toolbar:

 <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/login_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:src="@drawable/new_logo"
                android:adjustViewBounds="true"
                android:padding="5dp"
                android:id="@+id/app_logo" />

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

Now it looks like this:

What I need to do is this one:

How will I implement that?

Put your toolbar inside the relative layout and in same relative layout put your image view with alignparentTop and centerHorizontal properties for the size of your image view get the height of toolbar and add some value in that and set it to image view at run time (from java) — Adeel Turk, Mar 29 '17 at 05:21

score 1 · Accepted Answer · answered Mar 29 '17 at 05:29

try this:

<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.v7.widget.Toolbar
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/login_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary"/>

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="90dp"
            android:src="@mipmap/ic_launcher"
            android:layout_centerHorizontal="true"
            android:id="@+id/app_logo" />

    </RelativeLayout>

score 0 · Answer 2 · answered Mar 29 '17 at 05:21

You need to take a RelativeLayout as a root as follows :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/login_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary">

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

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_stripe"
        android:layout_centerHorizontal="true"
        android:adjustViewBounds="true"
        android:padding="5dp"
        android:id="@+id/app_logo" />

</RelativeLayout>

Overlay ImageView on Toolbar

2 Answers2