Why title is not centered in toolbar?

Question

I am trying to add customized toolbar i want cart badge count so i added the relative layout to toolbar widget, when i didn't added relative layout in toolbar the title appeared in center but now removing relative layout causes problem in adding badge textview on cart, can anybody suggest what to do in this situation? Toolbar.xml

<android.support.v7.widget.Toolbar
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:id="@+id/mytoolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentInsetStart="0dp"
app:contentInsetRight="0dp"
app:contentInsetLeft="0dp"
android:clipToPadding="false"
app:contentInsetStartWithNavigation="0dp"
app:contentInsetEndWithActions="0dp"
android:background="@color/header">

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

<TextView
    android:id="@+id/displaytexttoolbar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:layout_gravity="center"
    android:layout_margin="@dimen/activity_vertical_margin"
    android:text="TEXT_VIEW"
    android:textColor="@color/white" />

<RelativeLayout
    android:layout_gravity="right"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">


    <ImageView
        android:id="@+id/cart_imagetoolbar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_gravity="end"
        android:layout_margin="@dimen/activity_vertical_margin"
        android:src="@drawable/cart_mobile_white" />

    <TextView
        android:id="@+id/tvBadge"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_alignParentRight="true"
        android:layout_gravity="right"
        android:background="@drawable/cart_circle_mobile"
        android:gravity="center"
        android:textColor="@color/white"
        android:visibility="visible" />



</RelativeLayout>

</RelativeLayout>

Liles

I think this is happening because it's centering without taking into account the navigation button on the left. How are you setting that in your code? – Nagpur

ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(this , drawer , toolbar, R.string.navigation_drawer_open , R.string.navigation_drawer_close); drawer.setDrawerListener(toggle); getSupportActionBar().setDisplayShowTitleEnabled(false); getSupportActionBar().setDefaultDisplayHomeAsUpEnabled(true); toggle.setDrawerIndicatorEnabled(false); toggle.setHomeAsUpIndicator(R.drawable.menu_whitee); toggle.syncState(); this way i am setting hamburger icon @Josh Laird – Liles

Answer 1

It has to do with your layout_margin. Try the below:

<TextView
    android:id="@+id/displaytexttoolbar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:layout_marginLeft|Right="?attr/actionBarSize"
    android:text="TEXT_VIEW"
    android:textColor="@color/white" />

Nagpur

Thank you sir @Josh Laird but the problem persist i have attached screenshot in ques.Can u pls suggest what to do now? – Liles

Try android:layout_marginLeft|Right="?attr/actionBarSize" for the margin – Nagpur

Try android:layout_marginLeft|Right="?attr/actionBarSize" for the margin instead i tried to give margin in dp i gave 25dp it temporarily set the title to center @Josh Laird – Liles

Thanks for your effort sir @Josh Laird – Liles

Glad you figured it out :) – Nagpur

Answer 2

Default value of the contentInsetStart (left padding in toolbar) is 16dp.

Change it to

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

Tentage

I still get the same output..@Pehlaj – Liles

Thanks for your effort sir@Pehlaj – Liles

Answer 3

Try this code:

use a Framelayout instead of RelativeLayout and apply android:gravity="center" for the Title

    <android.support.v7.widget.Toolbar 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:id="@+id/mytoolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:contentInsetLeft="0dp"
    android:contentInsetStart="0dp"
    android:theme="@style/ThemeToolbar"
    app:contentInsetLeft="0dp"
    app:contentInsetStart="0dp">

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

        <TextView
            android:id="@+id/displaytexttoolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_margin="@dimen/activity_vertical_margin"
            android:gravity="center"
            android:text="TEXT_VIEW"
            android:textColor="@color/color_black" />

        <ImageView
            android:id="@+id/cart_imagetoolbar"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_gravity="end"
            android:layout_margin="@dimen/activity_vertical_margin"
            android:src="@mipmap/ic_launcher" />

        <ImageView
            android:id="@+id/tvBadge"
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:layout_alignParentRight="true"
            android:layout_gravity="right"
            android:gravity="center"
            android:src="@mipmap/ic_launcher"
            android:textColor="@color/color_black"
            android:visibility="visible" />
    </FrameLayout>

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

Output

Sarsen

I have mentioned the hamburger icon now that is even affecting the layout can u pls check in question and revert ?@Sarsen – Liles

affecting the layout how? – Sarsen

i have added screenshot in ques @Sarsen – Liles

try adding : android:paddingLeft="-48dp" android:paddingStart="-48dp"....for the toolbar textview.. – Sarsen

Thankyou sir @Sarsen your suggestion helped me a lot,this padding one didn't worked but Frame layout suggestion worked.Thanks for your effort. – Liles