Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to stop blinking on recycler view with architecture components paging library

I have a chat-like activity where I am using a RecyclerView with a PagedListAdaper to load a bunch of messages. I'm using a PositionalDataSource to load the data. The loading it's self works fine but when I send a message, I invalidate my datasource and the list gets remade. My problem is that it blinks when it does that:

this is how it looks

I have tried adding setHasStableIds(true) and overriding getItemId which would work on a simple adapter but it doesn't seem to work here. I also cannot seem to be able to just add an item to the getCurrentList() because it's not supported. Also, I'm not using a database, just making requests to a server.

So my questions are, is there a better way of doing this besides invalidating the data source? Is there a way to stop the list from blinking when sending a message? Or is this library just not suited for my chat activity?

Edit:

my diff callback

private val DIFF_CALLBACK: DiffCallback<MessageModel> = object : DiffCallback<MessageModel>() {
        override fun areItemsTheSame(@NonNull oldMessage: MessageModel, @NonNull newMessage: MessageModel) =
                oldMessage.id == newMessage.id


        override fun areContentsTheSame(@NonNull oldMessage: MessageModel, @NonNull newMessage: MessageModel) =
                oldMessage.equals(newMessage)
    }

Edit2 I fixed it:

So I managed to fix it by using PagedListAdapterHelper and setting it's list after the items loaded:

private var mHelper: PagedListAdapterHelper<MessageModel>? = null

init {
    mHelper = PagedListAdapterHelper(this, DIFF_CALLBACK)
    setHasStableIds(true)
}
fun setList(pagedList: PagedList<MessageModel>) {
    pagedList.addWeakCallback(pagedList.snapshot(), object:PagedList.Callback() {
        override fun onChanged(position: Int, count: Int) {

        }

        override fun onInserted(position: Int, count: Int) {
            mHelper?.setList(pagedList)
        }

        override fun onRemoved(position: Int, count: Int) {

        }

    })
}
like image 993
sleepy Avatar asked Jan 25 '18 08:01

sleepy


2 Answers

Short answer: make sure to call the callback of PositionalDataSource<T>.loadInitial(@NonNull LoadInitialParams params, @NonNull LoadInitialCallback<T> callback) synchronously in loadInitial without wrapping it in some kind of asynchronous success handler.

Explanation:

Blinking can be caused by asynchronous loads in your initial load i.e. in PositionalDataSource<T>.loadInitial(@NonNull LoadInitialParams params, @NonNull LoadInitialCallback<T> callback).

The following will happen when you do so:

Your data source gets invalidated which leads to the creation of a new PagedList (when created with LivePagedListBuilder). This newly created paged list will be passed to your adapter but it is still empty because you didn't call the callback directly in your initial load. This will lead to an empty list for as long as it takes for your callback to be called. This ultimately results in a flicker effect.

like image 81
Thomas Wanschik Avatar answered Nov 10 '22 08:11

Thomas Wanschik


PagedListAdapterHelper deprecated in Paging Component so we should use AsyncPagedListDiffer instead of it.

Code example:

    import android.arch.paging.AsyncPagedListDiffer;
    import android.arch.paging.PagedList;
    import android.arch.paging.PagedListAdapter;
    import android.support.annotation.NonNull;
    import android.support.v7.util.DiffUtil;
    import android.view.LayoutInflater;
    import android.view.ViewGroup;


    public class PagedItemsArrayAdapter extends PagedListAdapter<Item, MyViewHolder> {

            private final AsyncPagedListDiffer<Item> mDiffer;

            public PagedItemsArrayAdapter() {
                super(DIFF_CALLBACK);
                mDiffer = new AsyncPagedListDiffer<>(this, DIFF_CALLBACK);
                setHasStableIds(true);
            }

            @Override
            public long getItemId(int position) {
               Item item = mDiffer.getItem(position);
               return item.id;
            }

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

            @Override
            public void submitList(PagedList<Item> pagedList) {

                pagedList.addWeakCallback(pagedList.snapshot(), new PagedList.Callback() {
                    @Override
                    public void onChanged(int position, int count) {
                    }

                    @Override
                    public void onInserted(int position, int count) {
                        mDiffer.submitList(pagedList);
                    }

                    @Override
                    public void onRemoved(int position, int count) {

                    }
                });

            }


            @Override
            public void onBindViewHolder(@NonNull MyViewHolder viewHolder, int position) {
                   Item item = mDiffer.getItem(position);
                   viewHolder.onBind(item); 
            }

            private static DiffUtil.ItemCallback<Item> DIFF_CALLBACK = new DiffUtil.ItemCallback<Item>() {
                @Override
                public boolean areItemsTheSame(@NonNull Item oldItem, @NonNull Item newItem) {
                    return oldItem.getId() == newItem.getId();
                }

                @Override
                public boolean areContentsTheSame(@NonNull Item oldItem, @NonNull Item newItem) {
                    return oldItem.equals(newItem);
                }
            };
like image 4
seyfullah.bilgin Avatar answered Nov 10 '22 08:11

seyfullah.bilgin