I am building an application that uses a ViewPager2
to scroll horizontally across pages that each have a vertically scrolling content RecyclerView
where the first position of each list has a row with a Horizontally scrolling widget such as another RecyclerView
or ViewPager2
attached to a Pager Indicator type widget as seen from the below image.
The parent ViewPager2 is a child of a CoordinatorLayout that handles collapsing the top content when the RecyclerView is scrolled Vertically. This ViewPager2 then inflates fragments that are horizontally scrolling. So we have for the parent layout
:
-- CoordinatorLayout
-- FrameLayout - has appbar scrolling behavior
-- ViewPager2
-- AppBarLayout
-- CollapsingToolbarLayout
-- ImageView - background
-- Toolbar
-- ConstraintLayout - Holds title and date
The parent ViewPager2 child fragments' layout
:
-- FrameLayout
-- RecyclerView
-- Pager Indicator
The first row of the content RecyclerView has the same layout:
-- FrameLayout
-- RecyclerView
-- Pager Indicator
You can see from the above screenshot that on first load the RecyclerView
is overlapping the AppBarLayout
which is the correct behavior. I added negative marginTop
to RecyclerView
's parent layout to achieve this effect. I am tracking the AppBarLayout offset changes with a AppBarLayout.OnOffsetChangedListener
and as the user scrolls up I am reducing or increasing this negative margin to have the list animate under the AppBarLayout
.
The problem I am facing is if I start a vertical scroll from the first item in the list then the AppBarLayout
is not getting triggered to start collapsing its content so the content ends up prematurely under the AppBarLayout
. See the following screenshot:
I want the AppBarLayout content to start scrolling up as soon as I start the
content RecyclerView scroll even if it is initiated from the first position. It seems that the first item's RecyclerView
is not alerting the AppBarLayout
to start collapsing. If I start the scroll from other items in the RecyclerView the correct behavior is observed. If I drag up and hold from the first row then the bug is also observed.
A good example of the behavior I am trying to achieve is the Google News App where there is a tab of news sections. The following is what I am expecting:
The solution turned out to be simple. If you have a nested RecyclerView or similar container then you have to use:
RecyclerView.setNestedScrollingEnabled(false)