Dynamic Endless RecyclerView scrolling issues

Question

I have to create following layout

So far, I have successfully created the layout and populated all views. However, I am facing problem in the making ReyclerView Endless

Answer 1

You can see my implementation of the endless RecyclerView scroll:

GalleryActivity.java

public class GalleryActivity extends AppCompatActivity {

private StaggeredGridLayoutManager layoutManager;
private RecyclerView recyclerView;
private ImageRecyclerViewAdapter imageAdapter;

private List<ImageItem> images;
private ImageSearchClient imageSearchClient;

private String query;
private int currentStartPosition = 1;
private boolean loading = true;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_gallery);
    getSupportActionBar().setHomeButtonEnabled(true);

    query = getIntent().getStringExtra(Utils.QUERY_TAG);
    if (query == null)
        return;
    imageSearchClient = new ImageSearchClient(query);

    recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
    recyclerView.setHasFixedSize(true);

    layoutManager = new StaggeredGridLayoutManager(2, 1);
    recyclerView.setLayoutManager(layoutManager);

    images = new ArrayList<>();

    imageAdapter = new ImageRecyclerViewAdapter(this, images);
    recyclerView.setAdapter(imageAdapter);
    recyclerView.addOnScrollListener(new EndlessRecyclerScrollListener());

    loadMoreData();
}

private void loadMoreData() {
    loading = true;
    imageSearchClient.getService().customSearch(Utils.API_KEY, Utils.CX_KEY, query,
            Utils.IMAGE_SEARCH_TYPE,
            currentStartPosition,
            Utils.ITEMS_COUNT,
            new Callback<ImageResponse>() {
                @Override
                public void success(ImageResponse imageResponse, Response response) {
                    List<ImageItem> items = imageResponse.getItems();
                    for (ImageItem item : items) {
                        images.add(item);
                    }
                    imageAdapter.notifyDataSetChanged();
                    currentStartPosition += items.size();
                    loading = false;
                }

                @Override
                public void failure(RetrofitError error) {
                    Log.e(GalleryActivity.class.getSimpleName(),
                            error.getResponse().getReason());
                }
            });
}

private class EndlessRecyclerScrollListener extends RecyclerView.OnScrollListener {
    @Override
    public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
        super.onScrolled(recyclerView, dx, dy);

        int[] visibleItems = layoutManager.findLastVisibleItemPositions(null);
        int lastItem = 0;
        for (int i : visibleItems) {
            lastItem = Math.max(lastItem, i);
        }
        if (lastItem > 0 && lastItem > images.size() - Utils.ITEMS_COUNT && !loading) {
            if (NetworkUtils.hasConnection(GalleryActivity.this)) {
                loadMoreData();
            } else {
                Toast.makeText(GalleryActivity.this, R.string.network_error,
                        Toast.LENGTH_SHORT).show();
            }
        }
    }
}

}

ImageRecyclerViewAdapter.java (nothing is extraordinary here):

public class ImageRecyclerViewAdapter extends RecyclerView.Adapter<ImageViewHolder> {

private List<ImageItem> itemList;
private Context context;
private int parentWidth = 0;

public ImageRecyclerViewAdapter(Context context, List<ImageItem> itemList) {
    this.context = context;
    this.itemList = itemList;
}

@Override
public ImageViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    View layoutView =
            LayoutInflater.from(parent.getContext()).inflate(R.layout.gallery_card_item, null);
    ImageViewHolder imageViewHolder = new ImageViewHolder(layoutView);
    parentWidth = parent.getWidth();
    return imageViewHolder;
}

@Override
public void onBindViewHolder(final ImageViewHolder holder, int position) {
    Picasso.with(context)
            .load(itemList.get(position).getLink())
            .error(R.drawable.error_image)
            .placeholder(R.drawable.progress_animation)
            .into(new Target() {
                @Override
                public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
                    int targetWidth = parentWidth / 2;
                    float ratio = (float) bitmap.getHeight() / (float) bitmap.getWidth();
                    float heightFloat = ((float) targetWidth) * ratio;

                    final android.view.ViewGroup.MarginLayoutParams layoutParams
                            = (ViewGroup.MarginLayoutParams) holder.image.getLayoutParams();

                    layoutParams.height = (int) heightFloat;
                    layoutParams.width = (int) targetWidth;
                    holder.image.setLayoutParams(layoutParams);
                    holder.image.setImageBitmap(bitmap);
                }

                @Override
                public void onBitmapFailed(Drawable errorDrawable) {
                }

                @Override
                public void onPrepareLoad(Drawable placeHolderDrawable) {
                }
            });
}

@Override
public int getItemCount() {
    return this.itemList.size();
}

}

Answer 2

There seems to be a similar discussion here: ViewPager in a NestedScrollView Maybe the sample of the Naruto guy (https://github.com/TheLittleNaruto/SupportDesignExample/) could solve your situation.

Edit

I'm not sure if I'm getting the point of your question. Anyway here you can a possible solution to your situation.

<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">

<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/app_bar_layout"
>
<android.support.design.widget.CollapsingToolbarLayout
    android:id="@+id/collapsing_toolbar"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_scrollFlags="scroll|exitUntilCollapsed"
>

---- include here everything before the pager ----
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
---- this is your pager
<include layout="@layout/fragment_pager"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent"

android:layout_below="@+id/app_bar_layout"

/>

</android.support.design.widget.CoordinatorLayout>

Then you can just listen to the RecycleView in the pager to add items as the RecycleView scrolls to bottom.

I hope it helped