RecyclerView picture problem multiplexing disorder

RecyclerView picture problem multiplexing disorder

Because the development rankings encountered some problems, unified here to do the next record, due RecyclerView cache reuse mechanism, it will lead to item reuse problems, especially when pictures such as avatar of the user list has no avatar , then obviously we would see Mansian.

Direct say under the two programs, including the right not true, good and bad:

1, each gave direct picture settings setImageDrawable (), and then load the network picture

In this case, each refresh when the picture will first be set to setImageDrawable () in the picture, and then when finished loading the network picture will be displayed. A fierce look no problem, but this is what will cause it, when you refresh process, when there will be a list of images flashing, that is: Network Image -> Image settings -> Network picture such a flash process. Experience is not good, we need to address to achieve the same picture when there is still time to show the same picture just fine.

2, for each item in the picture settings tag

This is a more reliable program it, to set a picture tag (tag settings below for picture url), when the picture did not tag instructions here has not yet begun multiplexing, then the picture can be loaded directly network ; when the picture has a tag and tag and pictures of the same url, description and url for the picture is complex or right, this image can be loaded directly; when the picture url tag and pictures is not the same, indicating that the the picture is complex used to, so we need to set the original pictures for your placeholder, and then load the network picture.
The above is the entire logical, pseudo-code as follows:

 if (TUtils.isEmpty(item.getHeadUrl())) {
            holder.mImgAvatar.setImageDrawable(ContextCompat.getDrawable(mContext, R.drawable.ic_placeholder_avatar));
        } else {
            String avatarTag = (String) holder.mImgAvatar.getTag();//如果tag为null则说明是全新的视图,否则是复用来的视图
            //如果有图片的TAG有并且和之前设置的一样,那么直接再次加载即可
            if (null == avatarTag || avatarTag.equals(item.getHeadUrl())) {
                Glide.with(holder.mImgAvatar)
                        .load(item.getHeadUrl())
                        .override(SizeUtils.dp2px(34))
                        .into(new SimpleTarget<Drawable>() {
                            @Override
                            public void onResourceReady(@NonNull Drawable resource, @Nullable Transition<? super Drawable> transition) {
                                holder.mImgAvatar.setImageDrawable(resource);
                            }
                        });
            }
            //如果和原来的tag不同,也就是url不同,那么就先清空原来的图片,然后加载新的图片
            else {
                holder.mImgAvatar.setImageDrawable(ContextCompat.getDrawable(mContext, R.drawable.ic_placeholder_avatar));
                Glide.with(holder.mImgAvatar)
                        .load(item.getHeadUrl())
                        .override(SizeUtils.dp2px(34))
                        .into(new SimpleTarget<Drawable>() {
                            @Override
                            public void onResourceReady(@NonNull Drawable resource, @Nullable Transition<? super Drawable> transition) {
                                holder.mImgAvatar.setImageDrawable(resource);
                            }
                        });
            }
        }
        holder.mImgAvatar.setTag(item.getHeadUrl());
Published 40 original articles · won praise 47 · views 70000 +

Guess you like

Origin blog.csdn.net/u010976213/article/details/100040316