Question

How do I get rid of the extra padding in the new Toolbar with Android SDK API version 21 (the support library)?

I am talking about the red arrows on this picture: enter image description here

Here is the code I am using:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:background="?attr/colorPrimary"
        android:padding="0dp"
        android:layout_margin="0dp">

        <RelativeLayout
            android:id="@+id/action_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="0dp"
            android:padding="0dp"
            android:background="#000000">

            <Spinner
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        </RelativeLayout>
</Toolbar>

As you can see I've set all the relevant padding to 0, but there is still padding around the Spinner. What have I done wrong or what do I need to do to get rid of the extra padding?

Edit Some have questioned why I am trying to do this.

As per the Material Design specs, the spinner should be 72dp from the left side desc

I need to neutralize the padding Google have put there in order to properly place my spinner: desc

Edit 2

As per Chris Bane's answer below I set the contentInsetStart to 0. For the support library you will need to use the app namespace:

<android.support.v4.widget.DrawerLayout
    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.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:minHeight="@dimen/action_bar_height"
        android:background="?attr/colorPrimary"
        android:contentInsetStart="0dp"
        android:contentInsetLeft="0dp"
        app:contentInsetLeft="0dp"
        app:contentInsetStart="0dp"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light">

</android.support.v4.widget.DrawerLayout>

I hope this helps someone, it had me confused for several days.

have you also managed to remove the top/bottom paddings? I tried but nothing happens even setting the all the contentInsetX properties to 0dp. – patrickjason91 Apr 29 '15 at 4:03 — patrickjason91, Apr 29 '15 at 4:03
similar as @patrickjason91 is it possible to align ImageView with Toolbar top (image has w,h: wrap_content) inside Toolbar? I was trying everything but couldn't make it.. My goal is to have something like bookmark ribbon image "hanging" from the top of the Toolbar, bet there is always some padding that I can not eliminate it – Ewoks Feb 9 at 14:00 — Ewoks, Feb 9 at 14:00

ryanjdillon · Accepted Answer · 2016-08-24 11:22:47Z

up vote152down voteaccepted

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

Change this to 72dp to align to the keyline.

Update for support library v24.0.0:

To match the Material Design spec there's an additional attribute contentInsetStartWithNavigation which by default is 16dp. Change this if you also have a navigation icon.

edited Aug 24 at 11:22

ryanjdillon

2,04812048

answered Oct 21 '14 at 20:42

Chris Banes

22.1k124746

Thank you so much for this. Seems a bit strange to move away from padding and margin though. Is this an android 5 thing? – James Cross Oct 23 '14 at 7:02

1

The contentInsetStart is use to inset from any toolbar provided UI (for instance the navigation icon). – Chris Banes Oct 23 '14 at 9:11

And how would you align the radiobutton with the icon in the toolbar? I have similar issues:stackoverflow.com/questions/26623042/… – Ferran Negre Nov 13 '14 at 23:06

There is also titleMarginStart attr for title padding – deviant Mar 11 '15 at 14:22

@ChrisBanes is it possible to align imageView with Toolbar top (image has w,h: wrap_content) inside Toolbar? I was trying everything but couldn't make it.. My goal is to have something like bookmark ribbon image "hanging" from the top of the Toolbar, bet there is always some padding that I can not eliminate it – Ewoks Feb 9 at 14:00

show 2 more comments

Varundroid · Answer 2 · 2014-12-18 05:10:25Z

Above answer is correct but there is still one thing that might create issues (At least it did create an issue for me)

I used the following and it doesn't work properly on older devices -

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

The trick is here just use the following -

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

and get rid of -

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

And now it should work fine throughout all the devices.

Hope it helps.

this might be the default behaviour. Thanks =) – Luciano Rodríguez Jul 7 '15 at 15:42 — Luciano Rodríguez, Jul 7 '15 at 15:42
You are the best :) – The Finest Artist Jul 26 '15 at 10:28 — The Finest Artist, Jul 26 '15 at 10:28

score 3down vote · Answer 3 · 2015-09-09 13:00:48Z

Make your toolbar like:

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/menuToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="@color/white"
android:contentInsetLeft="10dp"
android:contentInsetRight="10dp"
android:contentInsetStart="10dp"
android:minHeight="?attr/actionBarSize"
android:padding="0dp"
app:contentInsetLeft="10dp"
app:contentInsetRight="10dp"
app:contentInsetStart="10dp"></android.support.v7.widget.Toolbar>

You need to add

contentInset

attribute to add spacing

please follow this link for more - Android Tips

Android API 21 Toolbar Padding

6 Answers