How to use RecyclerView inside NestedScrollView - android

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);

Related

Android making ViewPager scroll with parent activity layout

I have an android app in which I am trying to create the below layout -
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:background="#color/tab_primary_background"
android:layout_height="wrap_content"
app:elevation="5dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
app:subtitleTextColor="#color/white"
app:title="#string/app_name"
app:titleTextAppearance="#style/Toolbar.TitleText"
app:titleTextColor="#color/white" />
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_weight="1"
android:fillViewport="true"
android:layout_height="0dp">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:paddingStart="15dp"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_marginTop="15dp"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:src="#drawable/teacher_onboarding_step2"
android:layout_height="60dp"
android:layout_gravity="center"
android:textAlignment="center"
android:contentDescription="#string/take_test" />
<TextView
android:layout_width="match_parent"
android:id="#+id/tat_title_placeholder"
style="#style/TextAppearance.Text.Light"
android:textSize="14sp"
android:textAlignment="center"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:layout_height="wrap_content" />
<com.mindorks.placeholderview.PlaceHolderView
android:layout_width="match_parent"
android:id="#+id/fixed_test_placeholder"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:id="#+id/tat_tab_layout"
app:tabIndicatorColor="#color/white"
app:tabSelectedTextColor="#color/white"
app:tabBackground="#color/tab_primary_background"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="0dp" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/white"
app:headerLayout="#layout/drawer_header"
app:itemBackground="#color/white"
app:itemIconTint="#color/black_effective"
app:itemTextColor="#color/black_effective"
app:menu="#menu/drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextStyle.Title.Sub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
So, in this layout as you can see I want to add a TabLayout and a ViewPager below some views. Now the problem I am facing is my ViewPager is restricted to the available space at the bottom of the screen so, only the viewpager is scrollable and not the full activity layout. Which leaves very little space at the bottom to see the viewpager contents.
So, I want to make the whole layout below the appbar scrollable from the top so that the fragments inside viewpager are easily and conveniently visible.
------------Update---------
I tried using the Nested Scroll View, setFillViewPort, and the collapsing layout as suggested but still getting the same result.
Updated layout xml with Collapsing ToolbarLayout -
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.urtutors.students.mvp.utils.MyNestedScrollView
android:layout_width="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<com.urtutors.students.mvp.utils.WrapContentHeightViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</com.urtutors.students.mvp.utils.MyNestedScrollView>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:background="#color/tab_primary_background"
android:layout_height="wrap_content"
app:elevation="5dp">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:paddingStart="15dp"
app:layout_collapseMode="parallax"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:layout_marginTop="15dp"
android:layout_height="wrap_content">
<ImageView
android:layout_width="60dp"
android:src="#drawable/teacher_onboarding_step2"
android:layout_height="60dp"
android:layout_gravity="center"
android:textAlignment="center"
android:contentDescription="#string/take_test" />
<TextView
android:layout_width="match_parent"
android:id="#+id/tat_title_placeholder"
style="#style/TextAppearance.Text.Light"
android:textSize="14sp"
android:textAlignment="center"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:layout_height="wrap_content" />
<com.mindorks.placeholderview.PlaceHolderView
android:layout_width="match_parent"
android:id="#+id/fixed_test_placeholder"
android:layout_height="wrap_content" />
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
style="#style/Toolbar"
app:layout_collapseMode="pin"
app:subtitleTextColor="#color/white"
app:title="#string/app_name"
app:titleTextAppearance="#style/Toolbar.TitleText"
app:titleTextColor="#color/white" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:id="#+id/tat_tab_layout"
app:tabIndicatorColor="#color/white"
app:tabSelectedTextColor="#color/white"
app:tabBackground="#color/tab_primary_background"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/white"
app:headerLayout="#layout/drawer_header"
app:itemBackground="#color/white"
app:itemIconTint="#color/black_effective"
app:itemTextColor="#color/black_effective"
app:menu="#menu/drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextStyle.Title.Sub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
The nested scroll views I copied from - https://github.com/TheLittleNaruto/SupportDesignExample/tree/master/app/src/main/java/com/thelittlenaruto/supportdesignexample/customview
Now, the viewpager is scrolling but my actionbar title is not visible anymore.
Can someone suggest any changes to this layout that could fix this issue ?
I have tried to refine your code and if I am not wrong you wanted it to be scrollable,you can try the following code.
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/cl_root_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false">
<LinearLayout
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
app:elevation="5dp">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:subtitleTextColor="#android:color/white"
app:title="#string/app_name"
app:titleTextColor="#android:color/white" />
</android.support.design.widget.AppBarLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:orientation="vertical"
android:paddingEnd="15dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingStart="15dp">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:contentDescription="#string/take_test"
android:src="#mipmap/ic_launcher"
android:textAlignment="center" />
<TextView
android:id="#+id/tat_title_placeholder"
style="#android:style/TextAppearance.Medium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="15dp"
android:text="#string/tat_title_placeholder"
android:textAlignment="center"
android:textSize="14sp" />
<View
android:id="#+id/fixed_test_placeholder"
android:layout_width="match_parent"
android:background="#color/colorAccent"
android:layout_height="400dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="500dp"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/tat_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable"
app:tabPadding="#dimen/s_padding"
app:tabBackground="#color/colorPrimaryDark"
app:tabIndicatorColor="#android:color/white"
app:tabSelectedTextColor="#android:color/white" />
<android.support.v4.view.ViewPager
android:id="#+id/tat_viewpager"
android:layout_width="match_parent"
android:background="#color/colorPrimaryDark"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
style="#style/Widget.Design.NavigationView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:headerLayout="#layout/nav_header_nav"
app:itemBackground="#android:color/white"
app:itemIconTint="#android:color/black"
app:itemTextColor="#android:color/black"
app:menu="#menu/activity_nav_drawer">
<TextView
android:id="#+id/tv_app_version"
style="#style/TextAppearance.AppCompat"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:padding="5dp" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
I have made minor changes.
Try not to use weights when using scrollView.As they don't work so
well with each other.
I have wrapped Tab layouts in a Linear Layout
and gave it static height(can be replaced easily).
Hope it helps.

Scrolling issue with RecyclerView in CoordinatorLayout

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

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.

CoordinatorLayout with ViewPager

I'm not having any luck with hiding my app bar when a RecyclerView within a ViewPager is scrolled. I found the post:
CoordinatorLayout using the ViewPager's RecyclerView
But am not having any luck with it. Here is my activities layout file:
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true" >
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
android:id="#+id/tool_bar"
layout="#layout/tool_bar"
app:layout_scrollFlags="scroll|enterAlways|snap">
</include>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
<include
android:id="#+id/drawer_list"
layout="#layout/nav_drawer_list_view" />
<include
android:id="#+id/citizensFilter"
layout="#layout/citizens_activity_filter" />
</android.support.v4.widget.DrawerLayout>
The fragment has a good amount of views inside, so I'm not sure if that could be an issue:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
android:background="#color/colorCitizenBackground" >
<TextView
android:id="#+id/tvUpgrade"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_alignParentBottom="true"
android:animateLayoutChanges="true"
android:gravity="center"
android:text="#string/load_more_profiles"
android:textSize="16sp"
android:textColor="#color/white" />
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/layoutSwipeRefresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/tvUpgrade"
android:layout_below="#+id/horizontalScrollView1" >
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerCitizens"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#color/citizen_filter_color"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:scrollbars="none" >
<TextView
android:id="#+id/tvFilterList"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:singleLine="true"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#color/white" />
</HorizontalScrollView>
<include android:id="#+id/layoutNoneFound"
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="#layout/view_no_search_results"
android:layout_below="#+id/horizontalScrollView1" />
<include android:id="#+id/layoutLoading"
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="#layout/view_loading"
android:layout_below="#+id/horizontalScrollView1" />
<include android:id="#+id/layoutGetLocation"
android:layout_width="match_parent"
android:layout_height="match_parent"
layout="#layout/view_determine_location"
android:layout_below="#+id/horizontalScrollView1" />
<RelativeLayout
android:id="#+id/layoutDiscover"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:clickable="true"
android:visibility="invisible" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#drawable/rounded_corners_discover"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingLeft="20dp"
android:paddingStart="20dp"
android:paddingRight="20dp"
android:paddingEnd="20dp">
<TextView
android:id="#+id/tvDiscover"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/discover"
android:textColor="#color/colorPrimaryText"
android:textAppearance="?android:attr/textAppearanceSmall" />
<Spinner
android:id="#+id/spDiscover"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right|end"
android:layout_weight="1" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerDiscover"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="20dp"
android:paddingTop="20dp"
android:layout_marginLeft="10dp"
android:layout_marginStart="10dp"
android:layout_marginRight="10dp"
android:layout_marginEnd="10dp">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
I have even attempted to set the CoordinatorLayout programmatically using;
CoordinatorLayout.LayoutParams params = new CoordinatorLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
params.setBehavior(new AppBarLayout.ScrollingViewBehavior());
recyclerCitizens.setLayoutParams(params);
But that still didn't have an effect. What am I missing? I was under the impression setting the layout_behavior on the ViewPager would allow this implementation.
I was able to figure out what the problem was. In my layout file, I could not do an <include> statement. I had to change:
<include
android:id="#+id/tool_bar"
layout="#layout/tool_bar"
app:layout_scrollFlags="scroll|enterAlways|snap">
</include>
to:
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways|snap"/>

Add Footer to CoordinatorLayout

I want to add a Footer to CoordinatorLayout which contains a TabView + ViewPager.
Here is the main.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.entree.entree.activity.StoreActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/black"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_tray"
android:layout_gravity="right"
android:layout_marginRight="15dp"
android:scaleType="centerInside"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_find"
android:layout_gravity="right"
android:scaleType="centerInside"
android:layout_marginRight="10dp"
/>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:background="#android:color/white"
app:tabIndicatorColor="#00000000"
style="#style/MyCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_above="#+id/llTray" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:visibility="gone"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_search"
app:menu="#menu/activity_search_drawer" />
</android.support.v4.widget.DrawerLayout>
And here is the Xml Content:
<RelativeLayout 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:layout_below="#+id/container"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.entree.entree.activity.StoreActivity$PlaceholderFragment">
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:numColumns="1"
android:stretchMode="columnWidth">
</GridView>
<LinearLayout
android:id="#+id/llTray"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3"
android:visibility="gone"
android:gravity="center_vertical"
android:layout_centerVertical="true"
android:background="#color/divider"
android:layout_alignParentBottom="true">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_gravity="left"
android:gravity="left"
android:layout_height="wrap_content">
<ImageButton
android:id="#+id/btnTray"
android:src="#drawable/ic_action_tray_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:textStyle="bold"
android:layout_gravity="center_horizontal|center_vertical"
android:gravity="center_horizontal|center_vertical"
android:layout_weight="1"
android:text="#string/view_tray" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_weight="1"
android:gravity="right"
android:layout_marginRight="10dp"
android:layout_height="wrap_content">
<TextView
android:id="#+id/tvTotalPrice"
android:layout_width="wrap_content"
android:textSize="20sp"
android:textStyle="bold"
android:text="#string/Rs"
android:layout_height="wrap_content" />
</RelativeLayout>
</LinearLayout>
The footer is in xml content.
If i remove:
app:layout_behavior="#string/appbar_scrolling_view_behavior"
in the main Xml View Pager, footer appears , else it's not shown.
How can i get the footer visible?
You already have:
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:numColumns="1"
android:stretchMode="columnWidth" />
With match_parent for both height and width which it doesn't seems to be good.
Also, Perhaps you will need to show that ViewPager with NestedScrollView for scrolling the content in future.(needs a trick, but you can achieve this).
So, my suggest is, you should be able to show that footer all the time in the below of that ViewPager by adding it like this:
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_above="#+id/llTray" />
<!-- Footer aligned to bottom -->
<RelativeLayout
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#FC0"
android:gravity="center"
app:layout_anchor="#id/main_content"
app:layout_anchorGravity="bottom">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="Fixed Footer"
android:textColor="#000"
android:textSize="20sp" />
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
This should show the footer all the time (even when ViewPager is collapsing).
Or if you want to show it in your ViewPager:
you should add this in your contents:
app:layout_behavior="#string/appbar_scrolling_view_behavior"
Which means, it will put the contents below the AppbarLayout
Anyways, your contents problem is coming from that GridView like i said, it will match all the content and you don't have ScrollView or even NestedScrollView to show the other contents.

Categories

Resources