RecyclerView使用GridLayoutManager和Picasso显示错误的图像

12

更新 #1

添加了 hasStableIds(true) 并将 Picasso 更新到 2.5.2 版本。 它并没有解决问题。

复现:

使用 GridLayoutManager 的 RecyclerView(spanCount = 3)。 列表项是带有 ImageView 的 CardView。

当所有项都不适合屏幕时,在一个项上调用 notifyItemChanged 会导致 onBindViewHolder() 调用多次。 一次是由于 notifyItemChanged 提供的位置,其他调用是由于屏幕上不可见的项。

问题:

有时传递给 notifyItemChanged 的位置的项会加载属于不在屏幕上的项的图像(很可能是由于视图持有者的回收 - 尽管我会假设如果该项保持不变,则传递的视图持有者将是相同的)。

我在这里找到了 Jake 对其他问题的评论,他提到即使文件/URI 为空也要调用 load()。这里的每个 onBindViewHolder 都加载图像。

简单示例应用程序:

git clone https://github.com/gswierczynski/recycler-view-grid-layout-with-picasso.git

点击某个项目会调用notifyItemChanged方法,该方法的参数为该项目的位置。

代码:

public class MainActivity extends ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        if (savedInstanceState == null) {
            getSupportFragmentManager().beginTransaction()
                    .add(R.id.container, new PlaceholderFragment())
                    .commit();
        }
    }

    public static class PlaceholderFragment extends Fragment {

        public PlaceholderFragment() {
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                                 Bundle savedInstanceState) {
            View rootView = inflater.inflate(R.layout.fragment_main, container, false);

            RecyclerView rv = (RecyclerView) rootView.findViewById(R.id.rv);

            rv.setLayoutManager(new GridLayoutManager(getActivity(), 3));
            rv.setItemAnimator(new DefaultItemAnimator());
            rv.setAdapter(new ImageAdapter());

            return rootView;
        }
    }

    private static class ImageAdapter extends RecyclerView.Adapter<ImageViewHolder> implements ClickableViewHolder.OnClickListener {

        public static final String TAG = "ImageAdapter";
        List<Integer> resourceIds = Arrays.asList(
                R.drawable.a0,
                R.drawable.a1,
                R.drawable.a2,
                R.drawable.a3,
                R.drawable.a4,
                R.drawable.a5,
                R.drawable.a6,
                R.drawable.a7,
                R.drawable.a8,
                R.drawable.a9,
                R.drawable.a10,
                R.drawable.a11,
                R.drawable.a12,
                R.drawable.a13,
                R.drawable.a14,
                R.drawable.a15,
                R.drawable.a16,
                R.drawable.a17,
                R.drawable.a18,
                R.drawable.a19,
                R.drawable.a20);

        @Override
        public ImageViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.list_item, parent, false);
            return new ImageViewHolder(v, this);
        }

        @Override
        public void onBindViewHolder(ImageViewHolder holder, int position) {
            Log.d(TAG, "onBindViewHolder position: " + position + " | holder obj:" + holder.toString());
            Picasso.with(holder.iv.getContext())
                    .load(resourceIds.get(position))
                    .fit()
                    .centerInside()
                    .into(holder.iv);
        }

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

        @Override
        public void onClick(View view, int position) {
            Log.d(TAG, "onClick position: " + position);
            notifyItemChanged(position);
        }

        @Override
        public boolean onLongClick(View view, int position) {
            return false;
        }
    }

    private static class ImageViewHolder extends ClickableViewHolder {

        public ImageView iv;

        public ImageViewHolder(View itemView, OnClickListener onClickListener) {
            super(itemView, onClickListener);
            iv = (ImageView) itemView.findViewById(R.id.iv);
        }
    }
}

public class ClickableViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener, View.OnLongClickListener {
    OnClickListener onClickListener;


    public ClickableViewHolder(View itemView, OnClickListener onClickListener) {
        super(itemView);
        this.onClickListener = onClickListener;
        itemView.setOnClickListener(this);
        itemView.setOnLongClickListener(this);
    }

    @Override
    public void onClick(View view) {
        onClickListener.onClick(view, getPosition());
    }

    @Override
    public boolean onLongClick(View view) {
        return onClickListener.onLongClick(view, getPosition());
    }

    public static interface OnClickListener {
        void onClick(View view, int position);
        boolean onLongClick(View view, int position);
    }
}

你找到解决方案了吗?我也遇到了同样的问题。这只发生在RecyclerView上吗?你尝试过ListView吗? - Nimrod Dayan
还没有。由于我不确定这是Picasso还是GridLayoutManager的问题,因此我在PIcasso github项目页面(https://github.com/square/picasso/issues/954)和AOSP Google Code(https://code.google.com/p/android/issues/detail?id=162699)上发布了问题。我认为这个问题不存在于ListView上。 - gswierczynski
你解决了这个问题吗?我仍然看到在com.squareup.picasso:picasso:2.5.2中存在这个问题。setSupportsChangeAnimations(false)和setHasStableIds(true)似乎可以防止这种情况发生。 - Harkish
3个回答

6

我花了比我想承认的更多时间来解决与RecyclerView和其新适配器相关的奇怪问题。最终对我有效的唯一方法是确保正确更新并确保notifyDataSetChanges及其所有其他同类不会导致奇怪的行为:

在我的适配器上,我设置了

setHasStableIds(true);

在构造函数中,我重写了这个方法:
@Override
public long getItemId(int position) {
    // return a unique id here
}

我确保所有的项目都具有唯一的id。如何实现这一点取决于你。对我而言,数据以UUID的形式从我的网络服务中提供,并通过以下方法将UUID的部分转换为long来完成操作:

SomeContent content = _data.get(position);
Long code = Math.abs(content.getContentId().getLeastSignificantBits());

显然,这不是一个非常安全的方法,但对于我的列表,其中包含<1000个项目,它可能有效。到目前为止,我还没有遇到任何问题。
我建议尝试这种方法,看看是否适合您。由于您有一个数组,为您获取一个唯一的数字应该很简单。也许尝试返回实际项的位置(而不是传递给getItemId()的位置),或为每个记录创建一个唯一的长整数并传递该值。

所呈现的代码只是为了展示问题。我的实际实现要复杂得多(具有不同的排序和过滤方式)。我确实有UUID(也许哈希码可以胜任)。我看到了那个优化,但还没有尝试过。 - gswierczynski
对我来说也是一样。我的适配器代码更加复杂,但是在使用UniversalImageLoader异步加载图片时遇到了很多问题,唯一有效的方法就是我自己写的。 - kha
1
感谢您的输入@kha。不幸的是,这并没有解决问题。我已经提交了您提出的更改。 - gswierczynski
使用 url.hashCode() 作为 itemid。 - sherpya

0

这里有一个可行的解决方案,但在调用notifyDataSetChanged()时会出现图形故障。

holder.iv.post(new Runnable() {
            @Override
            public void run() {
                     Picasso.with(holder.iv.getContext())
                              .load(resourceIds.get(position))
                              .resize(holder.iv.getWidth(), 0)
                              .into(holder.iv);
            });

它之所以有效,是因为此时图像具有宽度,但不幸的是,当我需要更新视图持有者中的所有复选框(例如全选操作)并调用notifyDataSetChanged()时,效果非常丑陋。

仍在寻找更好的解决方案

编辑:这个解决方案对我有效:

    holder.iv.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN)
                holder.iv.getViewTreeObserver().removeOnGlobalLayoutListener(this);
            else
                holder.iv.getViewTreeObserver().removeGlobalOnLayoutListener(this);

                Picasso.with(holder.iv.getContext())
                         .load(resourceIds.get(position))
                         .resize(holder.iv.getMeasuredWidth(), 0)
                         .into(holder.iv);
        }
    });

解决方案可以工作,但会带来新的错误,所以我不建议使用这个。 - Nikita Axyonov

0

你尝试过在Drawable上调用mutate()方法吗?例如,可以参考这里


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接