Bad performance when use RecyclerView inside NestedScrollView

Question

I'm developing a search contact feature, in that screen, there is a RecyclerView inside NestedScrolView (fillViewport = true). Screen design: (This design is accepted by customer, I can't change it)

After loading all contacts of current device into an ArrayList, the search results are filtered from this array.
There is several cases that make the app very laggy:
1. When user type an input that have no result, then user clear search, I have to show all results again. The NestedScrollView has to render UI for all items of RecyclerView (for example: 300 items).
2. When the quantity of results has many changes (for example, from 1 to 300 items). The NestedScrollView has to render UI for a lot of items of RecyclerView

I know this design breaks recycling technique of RecyclerView, but I can't change it.
What I tried:

recyclerView.setNestedScrollingEnabled(false);

In AndroidManifest:

android:windowSoftInputMode="adjustNothing"

The adapter:

public class RecyclerContactAdapter extends RecyclerView.Adapter<RecyclerContactAdapter.ViewHolder> {

    private List<MobileContact> contacts;
    private Context context;

    public RecyclerContactAdapter() {
        contacts = new ArrayList<>();
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        this.context = parent.getContext();
        View view = LayoutInflater.from(context)
                .inflate(R.layout.item_recycler_contact, parent, false);

        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        //set data for view
    }

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

    protected class ViewHolder extends RecyclerView.ViewHolder {
        private TextView tvAlphabetHeader;
        private CircleImageView civAvatar;
        private TextView tvContactName;
        private TextView tvStatus;
        private CheckBox cbInvited;
        private RelativeLayout rlAlphabetHeader;
        private RelativeLayout rlContainer;

        protected ViewHolder(View itemView) {
            super(itemView);
            tvAlphabetHeader = itemView.findViewById(R.id.item_recycler_contact_tv_alphabet_header);
            civAvatar = itemView.findViewById(R.id.item_recycler_contact_civ_avatar);
            tvContactName = itemView.findViewById(R.id.item_recycler_contact_tv_name);
            tvStatus = itemView.findViewById(R.id.item_recycler_contact_tv_status);
            cbInvited = itemView.findViewById(R.id.item_recycler_contact_cb_contact);
            rlAlphabetHeader =  itemView.findViewById(R.id.item_recycler_contact_rl_alphabet);
            rlContainer = itemView.findViewById(R.id.item_recycler_contact_rl_contact);
        }
    }

    public void addAll(List<MobileContact> mobileContacts) {
        this.contacts.clear();
        this.contacts.addAll(mobileContacts);
        notifyDataSetChanged();
    }

    public void add(MobileContact mobileContact) {
        this.contacts.add(mobileContact);
    }

    public List<MobileContact> getContacts() {
        return this.contacts;
    }

}

Could you explain your ui design a bit more? What part of this is scrollable? Ie you can scroll nestedscrollview and also recyclerview inside nestedscrollview or what? — Okas
– Okas, Commented Dec 18, 2017 at 8:41
@ErginErsoy okay, I'm gonna post it, if I don't use NestedScrollView, this feature works smoothly cause the recycling technique. — Phong Nguyen
– Phong Nguyen, Commented Dec 18, 2017 at 8:45
Why is a ScrollView needed at all, when the RecyclerView is already scrollable by itself?! — Phantômaxx
– Phantômaxx, Commented Dec 18, 2017 at 8:48

Okas · Accepted Answer · 2017-12-18 08:48:29Z

20

You are using RecyclerView incorrectly. Instead of putting your RecyclerView inside NestedScrollView put your "Header" and "Search box" inside RecyclerView as different view types.

This answer is a good example.

answered Dec 18, 2017 at 8:48

Okas

2,6641 gold badge21 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Phong Nguyen Over a year ago

this method sounds appropriate, but there will be 4 different view types: header (TextView), a button, a search box, normal item, it's complicated when handle all events for each.

Okas Over a year ago

It only seems complicated at first. Actually this is standard practice. Also looking at your ui it seems you can put your header, button and search box together in one layout, so it will be only two view types.

Phong Nguyen Over a year ago

oh I see, I wish I could show you the exact screen design. I will try your solution

David Over a year ago

What if I have a fragment over the List, I cannot move all the logic from the fragment to the header in the adapter? And fragments cannot be used inside adapters.

Okas Over a year ago

@David, you probably have to redesign.

|

Collectives™ on Stack Overflow

Bad performance when use RecyclerView inside NestedScrollView

1 Answer 1

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related