Search code examples
androidandroid-layoutandroid-constraintlayout

Included toolbar has weird margin (Android Constraint layout)


I try to rebuild my toolbar with constraint layout, but there is something I can not resolve by myself.

I use included toolbar in another layout, everything looks good, but there is weird left margin of included toolbar. I checked all margins and paddings but still...

Image:

Weird margin of included toolbar

enter image description here

As you can see, there is a space between parent Toolbar and included new_toolbar

Activity.xml:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    android:background="?attr/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    android:padding="0dp"
    app:titleTextColor="@android:color/white">

    <include
        android:id="@+id/actionBar"
        layout="@layout/new_toolbar" />

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

<ListView
    android:id="@+id/listAccount"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="56dp"/>

<android.support.design.widget.BottomNavigationView
    android:id="@+id/bottom_navigation"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    android:layout_alignParentBottom="true"
    app:layout_anchor="@id/listAccount"
    app:layout_anchorGravity="bottom"

    app:itemBackground="@color/white"
    app:itemIconTint="@drawable/selector_bottom_navigation"
    app:itemTextColor="@drawable/selector_bottom_navigation"
    app:menu="@menu/bottom_navigation"/>
</android.support.design.widget.CoordinatorLayout>

new_toolbar.xml

<ImageButton
    android:id="@+id/mainIcon"

    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginTop="16dp"
    app:layout_constraintLeft_toLeftOf="parent"
    android:layout_marginLeft="16dp"

    android:layout_height="24dp"
    android:layout_width="24dp"

    android:background="@null"
    android:tint="@color/white"
    app:srcCompat="@drawable/ic_menu_black_24dp" />

<TextView
    android:id="@+id/title"

    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginTop="14dp"
    app:layout_constraintLeft_toRightOf="@+id/mainIcon"
    android:layout_marginLeft="32dp"

    android:layout_height="24dp"
    android:layout_width="wrap_content"

    android:fontFamily=" Roboto Semibold"
    android:text="Title"
    android:textColor="@color/white"
    android:textSize="20sp" />

<ImageButton
    android:id="@+id/rightIcon1"

    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginTop="16dp"
    app:layout_constraintRight_toRightOf="parent"
    android:layout_marginRight="16dp"

    android:layout_height="24dp"
    android:layout_width="24dp"

    android:background="@null"
    android:tint="@color/white"
    app:srcCompat="@drawable/ic_add_black_24dp" />

<ImageButton
    android:id="@+id/rightIcon2"

    app:layout_constraintTop_toTopOf="parent"
    android:layout_marginTop="16dp"
    app:layout_constraintRight_toLeftOf="@+id/rightIcon1"
    android:layout_marginRight="8dp"

    android:layout_height="24dp"
    android:layout_width="24dp"

    android:background="@null"
    android:tint="@color/white"
    app:srcCompat="@drawable/ic_account_circle_black_24dp" />
</android.support.constraint.ConstraintLayout>

Solution

  • In your toolbar widget, Use

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