Monday, 11 November 2019

Scroll flags on CollapsingToolbarLayout breaks scroll from propagating to HideBottomViewOnScrollBehavior

My MainActivity contains my main content as a ViewPager2 as well as my BottomNavigationView, which has the hide_bottom_view_on_scroll_behavior. Each ViewPager2 child uses the appbar_scrolling_view_behavior and in most cases, this causes the bottom nav to hide when a child fragment is scrolled, which is the desired behavior.

However, on my child fragment that contains a CollapsingToolbarLayout with app:layout_scrollFlags="scroll", this behavior doesn't work. Removing the scrollFlags=scroll causes the bottom nav to act how it should. This leads me to believe that for some reason, the CollapsingToolbarLayout is intercepting the scroll behavior and it isn't propagating up to the bottom nav.

Any thoughts?

activity_main.xml

<androidx.coordinatorlayout.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_height="match_parent"
    android:layout_width="match_parent">

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

        <androidx.viewpager2.widget.ViewPager2
            android:id="@+id/view_pager"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            android:nestedScrollingEnabled="true"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>
    </FrameLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/main_bottom_navigation_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:paddingStart="12dp"
        android:paddingEnd="12dp"
        app:itemTextColor="?android:textColorPrimary"
        android:layout_marginBottom="36dp"
        app:itemIconTint="@color/nav_icon_tint"
        android:background="@drawable/rounded_background"
        app:backgroundTint="?android:colorPrimaryDark"
        app:labelVisibilityMode="unlabeled"
        app:layout_behavior="@string/hide_bottom_view_on_scroll_behavior"
        app:menu="@menu/activity_main_navigation"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

fragment_devotional.xml (child of ViewPager2)

<androidx.coordinatorlayout.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:animateLayoutChanges="true">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/background"
        android:theme="@style/AppTheme.AppBarOverlay">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="260dp"
            android:fitsSystemWindows="true"
            app:contentScrim="@color/background"
            app:expandedTitleGravity="bottom"
            app:expandedTitleTextAppearance="@style/Toolbar.ExpandedText"
            app:layout_scrollFlags="scroll"
            app:title="@{devotional.title}"
            app:titleTextAppearance="@style/Toolbar.TitleText"
            app:titleTextColor="?android:textColorPrimary"
            app:toolbarId="@+id/toolbar">

            <ImageView
                android:id="@+id/header_logo"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:contentDescription="@{devotional.time}"
                android:scaleType="center"
                app:layout_collapseMode="parallax" />

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:textAlignment="textStart"
                app:contentScrim="@color/background"
                app:layout_collapseMode="pin"
                app:layout_scrollFlags="scroll"
                app:popupTheme="@style/AppTheme.PopupOverlay"
                app:title="@{devotional.title}" />

        </com.google.android.material.appbar.CollapsingToolbarLayout>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/background"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

     ... content ....
    </androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>


from Scroll flags on CollapsingToolbarLayout breaks scroll from propagating to HideBottomViewOnScrollBehavior

No comments:

Post a Comment