Scrolling issue with RecyclerView in CoordinatorLayout - android

I have issue with scrolling in my code .. here is my xml :-
<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:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#color/colorThemeDark"
android:fitsSystemWindows="true"
android:stateListAnimator="#drawable/appbar_always_elevated"
android:theme="#style/AppTheme.AppBarOverlay">
<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:collapsedTitleGravity="left"
app:contentScrim="#color/colorThemeDark"
app:expandedTitleGravity="center|bottom"
app:expandedTitleTextAppearance="#style/ExpandedAppBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/circleView"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_centerHorizontal="true"
android:layout_gravity="center_vertical|center_horizontal"
android:src="#drawable/main_logo"
app:layout_collapseMode="none" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#323642"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:id="#+id/firstText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:paddingLeft="10dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="What you learn today?"
android:textColor="#color/colorWhite"
android:textStyle="bold" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/catBoxes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/firstText"
android:layout_marginTop="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp" />
<RelativeLayout
android:id="#+id/secondText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/catBoxes"
android:paddingLeft="10dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Recommended for you"
android:textColor="#color/colorWhite"
android:textStyle="bold" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/catMenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/secondText"
android:layout_marginTop="5dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" </android.support.v7.widget.RecyclerView>
</RelativeLayout></android.support.design.widget.CoordinatorLayout>
I have two different recyclerView in single Activity.as in my code , i take root element as CoordinatorLayout. i add two RecyclerView in my code.when i scroll my recyclerview it scroll only first recyclerView and second RecyclerView scroll below first recyclerview. but i want to both recyclerView scroll at same time when i scroll up my screen.
Gif with my problem. Green boxes scrolled but i want to stop this green boxes scrolling

When you have two recycler view in a view and you want them to use all the space, you need to use NestedScrollView.
Your code will be the following:
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#323642"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:id="#+id/firstText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:paddingLeft="10dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="What you learn today?"
android:textColor="#color/colorWhite"
android:textStyle="bold" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/catBoxes"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/firstText"
android:layout_marginTop="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp" />
<RelativeLayout
android:id="#+id/secondText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/catBoxes"
android:paddingLeft="10dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Recommended for you"
android:textColor="#color/colorWhite"
android:textStyle="bold" />
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/catMenu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/secondText"
android:layout_marginTop="5dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
And in your code, use this in both recycler view:
LayoutManager layoutManager = new LinearLayoutManager(this);
layoutManager.setAutoMeasureEnabled(true);
recyclerView.setLayoutManager(layoutManager);
recyclerView.setNestedScrollingEnabled(false);
More info in smbd uknow`s answer here

Related

RecyclerView with NestedScrollView

I am developing an android music player where I have album detail activity with collapsing toolbar and nested scroll view. Inside nested scrollview there are three textviews and a recyclerview see the code below,
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/linear_detail_background"
app:behavior_overlapTop="50dp"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/album_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="20dp"
android:paddingLeft="10dp"
android:maxLines="1"
android:ellipsize="end"
android:text="Album Name"
android:textSize="24dp"
android:textColor="#000"
/>
<TextView
android:id="#+id/album_artist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Album Name"
android:textSize="14dp"
android:paddingLeft="10dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="15dp"
android:maxLines="1"
android:ellipsize="end"
/>
<TextView
android:id="#+id/song_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Songs"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Body1"
android:paddingLeft="10dp"
android:layout_marginTop="5dp"
android:textColor="#000"
/>
<android.support.v7.widget.RecyclerView
android:nestedScrollingEnabled="false"
android:id="#+id/album_songs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
The above code results in this Image
The problem occurs when there are more songs, the image above shows the album name This Party Gettin Hot and the Artist name. But when there are more songs the Album name and the artist name is not showing.
See this Image for Problem
The Complete XML code is as Below
<android.support.design.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:background="#color/white">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:background="#color/white"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_albums_songs"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="#color/white"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/poster"
android:layout_width="match_parent"
android:layout_height="300dp"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7"
android:background="#drawable/gradient_bg"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_album_detail"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/linear_detail_background"
app:behavior_overlapTop="50dp"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/album_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="20dp"
android:paddingLeft="10dp"
android:maxLines="1"
android:ellipsize="end"
android:text="Album Name"
android:textSize="24dp"
android:textColor="#000"
/>
<TextView
android:id="#+id/album_artist"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Album Name"
android:textSize="14dp"
android:paddingLeft="10dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="15dp"
android:maxLines="1"
android:ellipsize="end"
/>
<TextView
android:id="#+id/song_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Songs"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Body1"
android:paddingLeft="10dp"
android:layout_marginTop="5dp"
android:textColor="#000"
/>
<android.support.v7.widget.RecyclerView
android:nestedScrollingEnabled="false"
android:id="#+id/album_songs"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
how can I solve this issue? What I am doing wrong?
try change your nested scroll view layout_width to wrap content
<android.support.v4.widget.NestedScrollView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/linear_detail_background"
app:behavior_overlapTop="50dp"
>

How to use RecyclerView inside NestedScrollView

I have this layout:
<android.support.v4.widget.NestedScrollView
android:id="#+id/scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<--There is some layouts here-->
<RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
It works well. I can scroll RecyclerView smoothly without scrolling parent view.
Now I have to put the RecyclerView inside a FrameLayout like this:
<android.support.v4.widget.NestedScrollView
android:id="#+id/scrollview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<--There is some layouts here-->
<FrameLayout
android:id="#+id/review_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<include
android:id="#+id/empty_view"
layout="#layout/review_empty_view"
android:visibility="gone" />
</FrameLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
Now I cannot scroll the RecyclerView smoothly.
All I want is: scroll RecyclerView smoothly without scrolling parent view. What should I do?
EDIT: Here is my review_empty layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:padding="16dp">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:src="#drawable/shopping_review_empty" />
<android.support.v4.widget.Space
android:layout_width="32dp"
android:layout_height="0dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/shopping_no_review_message" />
</LinearLayout>
just enable nestedscrolling that will enable smooth scrollview.
RecyclerView v = (RecyclerView) findViewById(...);
v.setNestedScrollingEnabled(false);
Use this in your recyclerView
app:layout_behavior="#string/appbar_scrolling_view_behavior"
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/review_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
</ScrollView>
<include
android:id="#+id/empty_view"
layout="#layout/review_empty_view"
android:visibility="gone" />
</FrameLayout>
</LinearLayout>
</LinearLayout>
Try this...
I am suggesting you to do like this. When you get Empty Data then just set Recycler View Visibility as Gone and set Empty View Visibility as Visible.
Here is Code :
<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:background="#color/white"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="400dp"
android:background="#color/bg"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
app:layout_collapseMode="parallax">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_30dp">
<include layout="#layout/image_loading_progress" />
<com.thenakedconvos.stories.utils.CircularImageView
android:id="#+id/ivProfile"
android:layout_width="#dimen/scale_90dp"
android:layout_height="#dimen/scale_90dp"
android:transitionName="#string/transition_image" />
</FrameLayout>
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvUserName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_15dp"
android:textColor="#color/black"
android:textSize="16sp"
android:transitionName="#string/transition_text"
app:typeface="gotham_medium" />
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvHoots"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_5dp"
android:textColor="#color/text_color"
android:textSize="12sp"
app:typeface="gotham_book" />
<com.vanniktech.emoji.EmojiTextView
android:id="#+id/tvSmiley"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_10dp"
android:textIsSelectable="true"
app:emojiSize="25sp" />
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvAddFriend"
android:layout_width="140dp"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_15dp"
android:background="#drawable/red_rect_box"
android:gravity="center"
android:paddingBottom="#dimen/scale_12dp"
android:paddingTop="#dimen/scale_12dp"
android:text="Add"
android:textColor="#color/red"
android:textSize="14sp" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:theme="#style/AppTheme">
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text_color"
android:textSize="18sp"
app:typeface="bariol_bold" />
</android.support.v7.widget.Toolbar>
</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"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="#dimen/scale_15dp"
android:background="#color/white"
android:orientation="vertical"
android:padding="#dimen/scale_16dp">
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvUserStory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Amy N. Johnson's Stories"
android:textColor="#color/black"
android:textSize="15sp"
app:typeface="bariol_bold" />
<com.thenakedconvos.stories.widget.CustomTextView
android:id="#+id/tvTotalStories"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_5dp"
android:text="110 Stories"
android:textColor="#color/text_color"
android:textSize="13sp"
app:typeface="bariol_bold" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/scale_10dp"
android:clipToPadding="false"
android:paddingTop="#dimen/scale_10dp" />
</LinearLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
That may be a chance you loading images(static) in to ImageView can be slow your recyclerView.
Or Big size of image.
Try to run application on mobile have good size of RAM
Add fillViewport is true in NestedScrollView in xml file as below:
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:scrollbars="none">
And In your activity setNested scrolling false as below code
recycler_view.setNestedScrollingEnabled(false);
Just put your "not scrollable" layout outside the nested scroll view
All you have to do is use below line in your activity class:
ViewCompat.setNestedScrollingEnabled(recycler_view, false);
its compatible for lower versions also. and if you want to give compatible to API >21 only then use;
recycler_view.setNestedScrollingEnabled(false);

Horizontal ViewPager inside vertical ScrollView

In my app I have a fragment with horizontal ViewPager and horizontal RecycleViews that sits under vertical ScrollView. My problem is that the ViewPager is blocking the parent vertical scroll. I tried to disable ViewPager vertical touch event, but it didn't help.
Here is a video that shows the problem:
https://drive.google.com/file/d/0B9XMTJsXn0ofQnpOcWo5TW9GLWs/view?usp=sharing
And here is my layout xml:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"
android:focusableInTouchMode="true"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="top"
android:visibility="gone" />
<InkPageIndicator
android:id="#+id/page_indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginStart="#dimen/activity_horizontal_margin"
android:paddingBottom="8dp"
android:visibility="gone" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:minHeight="48dp"
android:visibility="gone">
<FrameLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1.0"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:text="#string/software"
android:textColor="?android:textColorPrimary"
android:textSize="20sp" />
</FrameLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginStart="#dimen/activity_horizontal_margin"
android:text="#string/see_all"
android:textAppearance="#style/TextAppearance.Button"
android:textColor="?colorAccent" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/software_recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="4dp"
android:visibility="gone" />
</LinearLayout>
Use a CoordinatorLayout instead of Scrollview, put the view-pager inside the CollapsingToolbarLayout and the rest of the layouts in the nestedScrollView.
<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:background="#android:color/background_light"
android:fitsSystemWindows="true">
<android.support.v7.widget.Toolbar
android:id="#+id/main.toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="200dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_gravity="top"
android:visibility="gone" />
<InkPageIndicator
android:id="#+id/page_indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginEnd="#dimen/activity_horizontal_margin"
android:layout_marginStart="#dimen/activity_horizontal_margin"
android:visibility="gone" />
</RelativeLayout>
</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">
// Put the layouts and views here, those you want to show below the view pager.
</android.support.v4.widget.NestedScrollView>
You are using LinearLayout then you can set
android:weightSum
property for resolving this issue.

CollapsingToolbarLayout not collapsing when scrolling with RecyclerView

I am using a CollapsingToolbarLayout for a collapsing tool bar and it works for the most part. When you start scrolling on any part of the page besides the RecyclerView it will scroll fine and the toolbar will collapse like it should. However when you do start scrolling on the RecyclerView it doesn't collapse the tool bar and doesn't look the best.
I've tried a lot of different solutions I've found online and none have seemed to help. I'm using appcompat-v7:23.2.1. Here's what the layout file looks like:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/movie_detail_app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/movie_detail_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:id="#+id/movie_detail_backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
android:contentDescription="#string/cd_backdrop"/>
<android.support.v7.widget.Toolbar
android:id="#+id/movie_detail_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- Movie Content here -->
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:padding="16dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:id="#+id/movie_detail_out_yet_layout"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp"
android:layout_width="20dp"
android:layout_height="20dp"
tools:background="#drawable/green_square">
<ImageView
android:id="#+id/movie_detail_out_yet_image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:src="#drawable/ic_checkmark"/>
</RelativeLayout>
<TextView
android:layout_toRightOf="#+id/movie_detail_out_yet_layout"
android:layout_toEndOf="#+id/movie_detail_out_yet_layout"
android:id="#+id/movie_detail_release_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/textAppearanceMedium"
tools:text="March 21, 2016"/>
<TextView
android:layout_marginLeft="20dp"
android:layout_marginStart="20dp"
android:id="#+id/movie_detail_mpaa_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/textAppearanceMedium"
android:textStyle="bold"
tools:text="PG-13"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"/>
</RelativeLayout>
<TextView
android:layout_marginTop="16dp"
style="?android:listSeparatorTextViewStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/h_plot"/>
<TextView
android:layout_marginTop="5dp"
android:id="#+id/movie_detail_plot"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<TextView
android:layout_marginTop="16dp"
style="?android:listSeparatorTextViewStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/h_ratings"/>
<TextView
android:id="#+id/movie_detail_no_ratings_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:text="#string/unknown"
android:visibility="gone"/>
<LinearLayout
android:orientation="horizontal"
android:id="#+id/movie_detail_rating_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Critics Section -->
<LinearLayout
android:layout_weight="0.5"
android:orientation="horizontal"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/movie_detail_critics_rating_box"
android:layout_marginTop="5dp"
tools:background="#drawable/orange_square"
tools:text="6.7"
android:textColor="#android:color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_gravity="center_vertical"
android:id="#+id/movie_detail_critics_rating_tv"
android:layout_marginLeft="5dp"
android:layout_marginStart="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/textAppearanceMedium"
android:text="#string/critics_rating"/>
</LinearLayout>
<!-- Audience Section -->
<LinearLayout
android:layout_weight="0.5"
android:layout_width="0dp"
android:layout_height="match_parent">
<TextView
android:id="#+id/movie_detail_audience_rating_box"
android:layout_marginTop="5dp"
tools:background="#drawable/orange_square"
tools:text="6.7"
android:textColor="#android:color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dp"
android:layout_marginStart="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="?android:attr/textAppearanceMedium"
android:text="#string/audience_rating"/>
</LinearLayout>
</LinearLayout>
<TextView
android:layout_marginTop="16dp"
style="?android:listSeparatorTextViewStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/h_cast"/>
<TextView
android:id="#+id/movie_detail_no_cast_tv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
style="?android:textAppearanceMedium"
android:text="#string/unknown"
android:visibility="visible"/>
<android.support.v7.widget.RecyclerView
android:id="#+id/movie_detail_cast_member_rv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:visibility="gone"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
For the RecyclerView, I set it to have a LinearLayoutManager and to my custom adapter. Any help would be great, it's been a couple weeks and I still haven't been able to figure this out.
Edit: It appears to only happen when scrolling up. If the tool bar is collapsed and I scroll down, it does expand like it should. However, as before, when scrolling up it doesn't seem to work.

Scrolling problems inside AppBarLayout

I have CoordinatorLayout:
<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:background="#color/background"
android:clickable="true"
android:focusableInTouchMode="true">
<android.support.v7.widget.RecyclerView
android:id="#+id/bottom_recycle_view"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:background="#drawable/border_gray_solid_background_nop"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/background">
<com.app.views.textviews.OpSearchView
android:id="#+id/search_top"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/default_margin"
android:layout_marginRight="#dimen/default_margin"
android:layout_marginTop="#dimen/_20sdp"
app:hint="#string/filter_categories"
app:layout_scrollFlags="scroll"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="#dimen/_10sdp"
app:layout_scrollFlags="scroll">
<TextView
android:id="#+id/top_heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/default_margin"
android:layout_marginLeft="#dimen/default_margin"
android:layout_marginRight="#dimen/default_margin"
android:layout_marginTop="#dimen/home_screen_sector_spacing"
android:gravity="left"
android:textColor="#color/heading_gray"
android:textSize="#dimen/_14sdp"
android:textStyle="bold"/>
<com.app.views.recycleview.HorizontalRecycleView
android:id="#+id/top_recycle_view"
android:layout_width="match_parent"
android:layout_height="#dimen/categories_row_height"
android:clipToPadding="false"
android:paddingLeft="#dimen/default_margin"/>
<TextView
android:id="#+id/bottom_heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/default_margin"
android:layout_marginRight="#dimen/default_margin"
android:layout_marginTop="#dimen/home_screen_sector_spacing"
android:gravity="left"
android:textColor="#color/heading_gray"
android:textSize="#dimen/_14sdp"
android:textStyle="bold"/>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
I would like to make OpSearchView sticky to the top of the layout.
I try to remove app:layout_scrollFlags="scroll" from OpSearchView but all childs from AppBarLayout became sticky.
If I move OpSearchView from the AppBarLayout under RecyclerView, the RecyclerView(with layout_behavior) became invisible.
How to make OpSearchView without scrolling behavior?
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:focusableInTouchMode="true"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#eeeeee"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="?android:actionBarSize"
android:paddingBottom="10dp"
app:layout_scrollFlags="scroll"
>
<TextView
android:id="#+id/top_heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/single_margin"
android:layout_marginLeft="#dimen/single_margin"
android:layout_marginRight="#dimen/single_margin"
android:gravity="start"
android:textStyle="bold"
android:text="top heading"
/>
<!-- com.app.views.recycleview.HorizontalRecycleView -->
<View
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#cccccc"
/>
<TextView
android:id="#+id/bottom_heading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/single_margin"
android:layout_marginRight="#dimen/single_margin"
android:gravity="start"
android:textStyle="bold"
android:text="bottom heading"
/>
</LinearLayout>
<!-- toolbar with the searchview in it -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:actionBarSize"
android:background="#dddddd"
app:layout_scrollFlags="scroll|enterAlways"
app:layout_collapseMode="pin"
>
<SearchView
android:id="#+id/search_top"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:queryHint="Search"
app:layout_scrollFlags="scroll"
app:layout_collapseMode="pin"
/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- scrolling contents -->
<android.support.v7.widget.RecyclerView
android:id="#+id/recycle_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
This is the layout that I came up with working with your layout, I took a few liberties to make things work, you should make your own changes to get it back to your original layout, like your custom SearchView and HorizontalRecyclerView.
P.S. For layout_width and layout_height, match_parent and fill_parent are the same thing, and you should only use match_parent as per Google's documentation suggests.

Categories

Resources