Toolbar isn't in the center of the AppBarLayout

Question

I used this example to build a layout with two NavigationViews:

http://v4all123.blogspot.de/2016/03/simple-example-of-navigation-view-on.html

It works fine. But also in the demo on this site you can see, that the Toolbar isn't 100% in the middle. The left button has more space to the left than the right button to the right border.

Take a look to the screenshot from Android Studio.

I've tried to center each view but the only way to get the same space left and right is to add a padding to the right. But I can't believe that this is the only way to get it to the middle of the layout.

Is there another trick to center the buttons and views in the Toolbar?

<android.support.design.widget.CoordinatorLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="false"
tools:context=".frontend.MainActivity">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/transparent"
    app:elevation="0dp"
    android:gravity="center">

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

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center">

            <ImageButton
                android:id="@+id/menuLeft"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:src="@drawable/ic_menu_white_24dp"
                android:tint="@color/colorPrimary" />
            <TextView
                android:id="@+id/headerLine"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_centerVertical="true"
                android:text="Example application"
                android:textSize="20dp"
                android:layout_marginLeft="10dp"
                android:layout_marginRight="10dp"
                android:textAlignment="center"
                android:maxLines="1"
                android:lines="1"
                android:layout_toRightOf="@+id/menuLeft"
                android:layout_toLeftOf="@+id/menuRight"
                android:singleLine="true"
                android:ellipsize="end"
                android:textAppearance="@style/TextAppearance.AppCompat.Body1"
                android:textColor="@color/headerTextColorPrimary" />
            <ImageButton
                android:id="@+id/menuRight"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_alignParentEnd="true"
                android:src="@drawable/ic_menu_white_24dp"
                android:tint="@color/colorPrimary" />
        </RelativeLayout>
    </android.support.v7.widget.Toolbar>

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

</android.support.design.widget.CoordinatorLayout>

score 2 · Accepted Answer · answered Mar 01 '17 at 11:17

2

add

app:contentInsetStart="0dp"

to your toolbar.This will remove the extra padding in the left of the toolbar

answered Mar 01 '17 at 11:17

Arpan Sharma

2,142
11
22

Welcome.Enjoy coding – Arpan Sharma Mar 01 '17 at 15:18

score 1 · Answer 2 · edited May 23 '17 at 12:09

1

It is already answered here. Please find android:contentInsetLeft="0dp" and android:contentInsetStart="0dp" in following link. This will work for you.

https://stackoverflow.com/a/32320632/4688535

edited May 23 '17 at 12:09

Community

1
1

answered Mar 01 '17 at 11:30

Sushant

1,272
2
15
31

Thank you. It works ... with `app:contentInsetLeft="0dp"` and `app:contentInsetStart="0dp"`. – chrispi Mar 01 '17 at 15:07

Toolbar isn't in the center of the AppBarLayout

2 Answers2

Linked