android – Unexplained gap/padding to the left, between Toolbar, and LinearLayout-ThrowExceptions

Exception or error:

I have the following structure in the layout file of my Android studio project, and I see unexplained left padding between the parent element (Toolbar) and it’s immediate child element (LinearLayout).

Layout Text

<Toolbar
    android:layout_width="fill_parent"
    android:layout_height="600dp"
    android:id="@+id/toolbar"
    android:background="#313B45"
    android:weightSum="1">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" android:orientation="vertical">
        <ImageView
            android:id="@+id/headerimage"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="fitXY"
            android:layout_gravity="left|top"
            android:layout_weight="1"/>

        <TextView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:text="New Text"
            android:id="@+id/textView"
            android:scaleType="fitXY"
            android:layout_gravity="left|top"
            android:layout_weight="1"/>

    </LinearLayout>
</Toolbar>

How can I remove this gap and have the child LinearLayout align fully with the parent Toolbar?

How to solve:

Add these lines to your toolbar layout :
For API<=21 toolbar :

    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp"

For API 21>= toolbar :

    android:contentInsetLeft="0dp"
    android:contentInsetStart="0dp"

The left inset is caused by Toolbar’s contentInsetStart which by default is 16dp.

Here’s the full code :

<android.support.v7.widget.Toolbar
android:layout_width="fill_parent"
android:layout_height="600dp"
android:id="@+id/toolbar"
android:background="#313B45"
android:weightSum="1"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/headerimage"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"
        android:layout_gravity="left|top"
        android:layout_weight="1" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:text="New Text"
        android:id="@+id/textView"
        android:scaleType="fitXY"
        android:layout_gravity="left|top"
        android:layout_weight="1" />

</LinearLayout>

###

The above answer helped solve only a part, add these lines and it should work fine

android.support.v7.widget.Toolbar
        xmlns:app="schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/primaryColor"
        android:contentInsetLeft="0dp"
        android:contentInsetStart="0dp"
        app:contentInsetLeft="0dp"
        app:contentInsetStart="0dp"
        android:contentInsetRight="0dp"
        android:contentInsetEnd="0dp"
        app:contentInsetRight="0dp"
        app:contentInsetEnd="0dp" />

notice that android:contentInsetLeft and app:contentInsetLeft are 2 separate things and both of them are needed

Leave a Reply

Your email address will not be published. Required fields are marked *