I'm trying to use Collapsing Toolbar with Home/Up button. After toolbar collapses, there is an extra space between arrow and title text, which I'd like to get rid of. I attached two images, with and without layoutboundaries, to illustrate my point.
I searched StackOverflow and everywhere and tried android:contentInsetStart="0dp" in vain.
Here is my layout XML file.
<android.support.design.widget.CoordinatorLayout
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:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="?colorPrimary"
app:elevation="4dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/colorPrimary"
app:collapsedTitleTextAppearance=
"@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance=
"@style/TextAppearance.ExpandedTitle"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:title="Toolbar Title">
<ImageView
android:id="@+id/collapsing_toolbar_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="88dp"
android:contentDescription="@string/app_name"
android:scaleType="centerCrop"
android:src="@drawable/glider"
app:layout_collapseMode="parallax"
/>
<View
android:id="@+id/toolbar_title_scrim"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignBottom="@+id/collapsing_toolbar_background"
android:layout_gravity="bottom"
android:background="@android:color/holo_green_light"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="test text"
android:textColor="@android:color/white"/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:contentInsetStart="0dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:scrollbarStyle="outsideOverlay"/>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
It turned out that this is part of a new Material Design Specification introduced in version 24 of Design library.
https://material.google.com/patterns/navigation.html
However, it is possible to remove the extra space by adding the following property to Toolbar widget.
app:contentInsetStartWithNavigation="0dp"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With