Scrolling ImageView along with Recylcer View - android

So,
I have a layout.xml file which contains a Recycler View. Now, what I want is, I added two image Views on top of this Recycler View but I want those ImageViews to scroll with the RecyclerView as well.
I just wanted to ask, is this possible to do? And if yes, how can I achieve this?
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/content_parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<include
android:id="#+id/header_bar"
layout="#layout/section_header" />
<ImageView-1>
<ImageView-2>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/category_grid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:paddingHorizontal="#dimen/category_grid_edge_space"
android:paddingTop="#dimen/category_grid_padding_top"
android:scrollbarSize="#dimen/grid_padding"
android:scrollbarStyle="outsideOverlay"
android:scrollbarThumbVertical="?android:attr/textColorSecondary"
android:scrollbars="vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Put your RecycleView in NestedScrollView
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
layout="#layout/your_header"/>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/category_grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
also don't forget to disabled NestedScrolling for RecyclerView
myRecyclerView.setNestedScrollingEnabled(false);
OR
Add those views as a header. Here is a good guide on how to add a custom item view: https://medium.com/androiddevelopers/get-ahead-using-headers-in-recyclerview-2909a69b19

https://github.com/masudias/RecyclerView-with-Header-and-Footer
You can use header and footer i

Related

Recyclerview in fragment which is inside nestedscrollview scrolling issue

In activity, I have TabLayout & FrameLayout for loading fragment. fragment contains RecyclerView. it works fine for first time only. but when I change tab and back to previous tab the RecyclerView not scrolling full.
Main Activity
<android.support.v4.widget.NestedScrollView
android:fillViewport="true"
android:layout_height="match_parent"
android:layout_width="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/tabMain"
android:layout_height="wrap_content"
android:layout_width="match_parent" />
<FrameLayout
android:id="#+id/containerMain"
android:layout_height="match_parent"
android:layout_width="match_parent" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
Fragment
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/rvMedia"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:nestedScrollingEnabled="false" />
</LinearLayout>
The recyclerView has a smooth scrolling by itself but when we need to put recyclerView within any scrollView it will not work like the below:
Layout XML
<?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="match_parent"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</ScrollView>
</LinearLayout>
The solution for this is we need to used nestedScrollView instead of scrollview like the below
<?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="match_parent"
android:orientation="vertical">
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
The problem occurs when we use nestedScrollView and put recyclerView inside nestedScrollView is, it scrolls in various speed depending on gesture. The scrolling feature will not be smooth.
So to fix this issue all you have to do after setting your adapter is to add this line ViewCompat.setNestedScrollingEnabled(recyclerView, false);
This is not a good solution. Placing a RecyclerView inside a NestedScrollView, causes ALL elements of the RecyclerView’s adapter to be rendered, ths using alot of memory. This can be so slow in most devices with less memory.
This approach might also lead to disabling need scrolling, which will disable views recycling thus all items will be initialized at once.e.g. In a list with 1000 items. This will make the application lag. You can avoid it if you use pagination where you load a fixed number of items when the user scrolls down on the list.
Read more about pagination.
Pagination with RecyclerView – Etienne Lawlor – Medium
Android RecyclerView Pagination with Paging Library using MVVM ...
Paging library overview | Android Developers

RecyclerView inside of NestedScrollView fires all onBindViewHolder at once

I want to have scrollable screen with RecyclerView as one of its children, hierarchy would look like that:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
...
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
.../>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
.../>
<FrameLayout
.../>
<android.support.v7.widget.RecyclerView
android:id="#+id/list_contacts"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:nestedScrollingEnabled="false"/>
<FrameLayout
.../>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
Note that all the items of RecyclerView should be visible and be siblings of ImageView, FrameLayout etc.
In the current solution, there is one significant issue, onBindViewHolder is called for all items at once, but I want them to be bind when they appear on the screen, like in standard RecyclerView. I was doing some experiments with
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
but it failed after all.
I know one of the solutions is implementing heterogeneous recyclerView, but I would like to avoid it. Any ideas?
Probably it happens because in this case, recyclerview cant know the height of itself.
Can you try:
layoutManager.isAutoMeasureEnabled=true

Add View at top of recycler view

In my android application, there is a slideshow at top of page and below it, there is a recycler view, my problem is how to add the slideshow above recycler view in a way that slideshow can be scrolled with recycler view. I tried adding a scroll view as a parent but it seems that recycler lost the recycling power.
<RelativeLayout
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="#ececec">
<android.support.v4.view.ViewPager
android:id="#+id/ChefFragmentViewPager"
android:layout_width="match_parent"
android:layout_height="220dp"
android:layout_alignParentTop="true" />
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/ChefFragmentViewPager"
android:background="#ececec"
android:scrollbars="none" />
</RelativeLayout>
Try using NestedScrollView instead of ScrollView and also set recyclerView.setNestedScrollingEnabled(false); programmatically.
Try this code and let me know if it helped you or not:
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
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="#ececec">
<android.support.v4.view.ViewPager
android:id="#+id/ChefFragmentViewPager"
android:layout_width="match_parent"
android:layout_height="220dp"
android:layout_alignParentTop="true" />
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/ChefFragmentViewPager"
android:background="#ececec"
android:scrollbars="none" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>

Using Recycler view inside Sticky Scroll view not working

I have a requirement where I need to code a screen which has a info view in top and view pager with two tabs in the bottom. View pager has two tabs with Recycler View inside it.
The View pager should stick whenever the user scrolls up and then the recycler view inside it should start scrolling. To achieve this I created two separate fragments for top part and bottom part and wrote the xml like this.
<com.citi.mobile.dashboard.views.StickyScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:fillViewport="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/core_color_FFFFFF_white">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include
android:id="#+id/title_id"
layout="#layout/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="#+id/top_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</FrameLayout>
<FrameLayout
android:id="#+id/bottom_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:tag="sticky">
</FrameLayout>
</LinearLayout>
Inside the the bottom container I have a View Pager.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/TransTabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabIndicatorColor="#color/core_color_0077bb_blue"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/core_color_0077bb_blue"
app:tabTextAppearance="#style/ledgerTabLayoutTextAppearance"
app:tabTextColor="#color/core_color_666666_grey"
custom:typefaceName="Roboto-Medium" />
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/transaction_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</android.support.v4.view.ViewPager>
This has two tabs and each has a recycler view inside this. When I run this the parent scrollview stops working and only the recyclerview scrolling works.
Try adding android:nestedScrollingEnabled="false" to the recyclerview in your xml.

How to design complex UI in android

How can I have a ViewPager above a RecyclerView, or have several RecyclerViews in a ScrollView? I designed the following layout, but it has some problems when scrolling.
What is the problem and how can I solve it?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
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="#dcdcdc"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".ActivityMain"
tools:showIn="#layout/app_bar_main">
<LinearLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="200dip"
/>
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</LinearLayout>
</ScrollView>
I have tried compile 'com.bartoszlipinski:recyclerviewheader2:2.0.1' with
<com.bartoszlipinski.recyclerviewheader2.RecyclerViewHeader
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|top">
1- firstly it supports 11 sdk or greater,
2- secondly ViewPager wont work in header RecyclerView.
and i have tried RecyclerView layout_width="wrap_content" but it is just supported in sdk21 .
How can I solve the RecyclerView scrolling ?
Try losing the top ScrollView and using a ListView instead of RecyclerView.
ScrollView is unnecessary here and you need a hack for ViewPager to work with RecyclerView as it consumes all touch events. It would be simpler if you could get away with a ListView.
You can take your view pager to app bar in collapssing toolbar layout and it will be ok

Categories

Resources