Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android CollapsingToolbarLayout title - top margin bug

CollapsingToolbarLayout title have a strange top margin but only when it is collapsed and only when inside a fragment. Prior to the 25.0.0 version of Design Support Library everything worked fine.

Video: https://www.youtube.com/watch?v=7WUrFhmvs_Q&feature=youtu.be

XML:

<?xml version="1.0" encoding="utf-8"?>
<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:fitsSystemWindows="true">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="256dp"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@drawable/image_placeholder"
            app:layout_collapseMode="parallax"/>

        <android.support.v7.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"/>

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

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

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:text="Lorem ipsum dolor sit amet enim ..."
        android:textSize="20sp"/>

</android.support.v4.widget.NestedScrollView>


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

Fragment :

public class TestFragment extends Fragment {

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    super.onCreateView(inflater, container, savedInstanceState);

    View view = inflater.inflate(R.layout.test_fragment, container, false);

    return view;
}

@Override
@CallSuper
public void onViewCreated(View view, Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    CollapsingToolbarLayout toolbarLayout = (CollapsingToolbarLayout) view.findViewById(R.id.collapsing_toolbar_layout);
    toolbarLayout.setTitle("Lorem Ipsum");
}

}

Any ideas?

like image 502
ppodgorski Avatar asked Jun 23 '17 14:06

ppodgorski


1 Answers

I have the same issue right now, but it's because I'm hosting it inside a FrameLayout and LinearLayout and they aren't calling their children's "OnApplyWindowInsets" methods.

Even when fixing that I still get the issue.

But for you, try to only have android:fitsSystemWindows="true" on your CoordinatorLayout, not the rest. I think what you're seeing is a double insets because you have it on almost all your controls.

like image 124
Cybrosys Avatar answered Nov 06 '22 06:11

Cybrosys