Android Toolbar, center text layout issue

Question

Currently struggling with the layout of my Toolbar.
I have two buttons. One left aligned and the other right aligned. The text (app title) needs to be in the center of the two buttons.

Example: [Button1] [Text] [Button2]

My problem. The text is not center aligned.

It needs to look like this.

Not sure what i am doing wrong. Been struggeling for hours.

<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="true"
tools:context=".OcdListActivity">

<ImageView
    android:id="@+id/imageViewplaces"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:background="@drawable/bg_toolbar" />

    <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@drawable/background_toolbar_translucent">

    <ImageButton
        android:layout_width="52dp"
        android:layout_height="52dp"
        android:id="@+id/btnBack"
        android:background="@null"
        android:src="@drawable/ic_keyboard_backspace_black_24dp"
        android:layout_gravity="left"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:onClick="doBackButton_click"
        android:tint="@color/colorBtnWhite" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="My list"
            android:textColor="@color/colorBtnWhite"
            android:gravity="center"
            android:id="@+id/toolbar_title" />

        <ImageButton
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:id="@+id/btnMenu"
            android:background="@null"
            android:src="@drawable/ic_reorder_black_24dp"
            android:onClick="doMenuButton_click"
            android:layout_gravity="right"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:tint="@color/colorBtnWhite" />

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

<include layout="@layout/content_ocdlist" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:tint="@android:color/white"
    app:backgroundTint="@color/colorPrimaryDark"
    android:src="@android:drawable/ic_input_add" />

Thanks in advance

Answer 1

In TextView You have to change

android:gravity="center"

to

android:layout_gravity="center"

Answer 2

just do this in your activity(view):

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setContentInsetsAbsolute(0, 0); // remove toolbar margin from left/right

Answer 3

I'm not super familiar with how Toolbar, which is just a subclass of ViewGroup lays its subviews out, but I usually go to RelativeLayout whenever possible. I know it has some performance issues when you use a lot (especially nested), but in this case it should be fine.

Something like this should achieve what you're looking for:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@drawable/background_toolbar_translucent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageButton
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:id="@+id/btnBack"
            android:background="@null"
            android:src="@drawable/ic_keyboard_backspace_black_24dp"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:onClick="doBackButton_click"
            android:tint="@color/colorBtnWhite" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="My list"
            android:textColor="@color/colorBtnWhite"
            android:gravity="center"
            android:layout_centerInParent="true"
            android:id="@+id/toolbar_title" />

        <ImageButton
            android:layout_width="52dp"
            android:layout_height="52dp"
            android:id="@+id/btnMenu"
            android:background="@null"
            android:src="@drawable/ic_reorder_black_24dp"
            android:onClick="doMenuButton_click"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:tint="@color/colorBtnWhite" />


    </RelativeLayout>

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