CODEWITHSUNDEEP
androidandroid-recyclerviewhorizontal-scrolling
Robert Pal
Robert Pal

Reputation: 830

RecyclerView (Horizontal) inside RecyclerView (Horizontal) inside RecyclerView (Vertical)

enter image description here

Basically I'm trying to achieve something similar to the photo attached. A list of animal categories (vertical scroll) which has inside some lists of animals (horizontal scroll) and in each animal card has a list of descriptions (horizontal scroll).

I'm not using any ScrollViews, just the given scroll from the three RecyclerViews.

I want to scroll the orange cards and the photo card animal to remain fix. But the scroll only works to move animal cards, not orange cards. If I set a click listener for each orange card, it will send me to the given screen.

I saw this horizontal scroll inside horizontal scroll working on other apps, so it's possibile to achieve, but I guess I missed something.

Also I saw this question in many forms, but no answer seems to be working.

Let's say I have three classes with their contains:

AnimalCategory - name and list of animals

Animal - photo, text and list of descriptions

Description - property field

In activity:

...

animalsAdapter.addCategory(new AnimalCategory(
                                animalCategoryList.get(i).getName(),
                                animalCategoryList.get(i).getAnimals()));

animalsRecyclerView.setAdapter(animalsAdapter);

...

In AnimalsCategoryAdapter:

holder.categoryTextView.setText(categoryName);
holder.categoriesRecyclerView.setLayoutManager(new LinearLayoutManager(holder.categoriesRecyclerView.getContext(), LinearLayoutManager.HORIZONTAL, false));
holder.categoriesRecyclerView.setAdapter(new AnimalsAdapter(animalsCategory.getAnimals(), context));

In AnimalsAdapter:

holder.categoriesRecyclerView.setLayoutManager(new LinearLayoutManager(holder.categoriesRecyclerView.getContext(), LinearLayoutManager.HORIZONTAL, false));
holder.categoriesRecyclerView.setAdapter(new AnimalAdapter(animalCategory.getAnimals(), context);

In Description:

Description description = descriptionList.get(position);
holder.propertyTextView.setText(description.getProperty());

Upvotes: 0

Views: 224

Answers (2)

Kazaky
Kazaky

Reputation: 41

That's a bad UX, Lots of nested scrolling views are super hard to interact with,

You should either split data in different screens, Or just cut down the data you show per layout so you won't have to scroll, Then show it again in details when a user clicks and open new details screen

Or you can use an expandable-list item to show more data

Upvotes: 0

ashazar
ashazar

Reputation: 714

Where you define horizontal recyclerview (let's say descriptionRecyclerView) add below. This will omit the scroll for the parent recyclerview when touched on that recyclerview area, and take the control of the scroll.

RecyclerView.OnItemTouchListener mScrollTouchListener = new RecyclerView.OnItemTouchListener() {
    @Override
    public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {
        int action = e.getAction();
        switch (action) {
            case MotionEvent.ACTION_MOVE:
                rv.getParent().requestDisallowInterceptTouchEvent(true);
                break;
        }
        return false;
    }

    @Override
    public void onTouchEvent(RecyclerView rv, MotionEvent e) { }

    @Override
    public void onRequestDisallowInterceptTouchEvent(boolean disallowIntercept) { }
    };

descriptionRecyclerView.addOnItemTouchListener(mScrollTouchListener);

Upvotes: 1

Related Questions