Recycler View中的项目重叠问题

5

当用户滚动时,我的回收视图中的条目会重叠。请注意底部重叠的文本:

enter image description here

以下是生成此视图的代码:

        ArrayList<Bitmap> drawables = mBitmaps;
        RecyclerView recyclerView = new RecyclerView(ctx);
        LinearLayoutManager llm = new LinearLayoutManager(ctx);
        recyclerView.setLayoutManager(llm);
        RecyclerView.Adapter adapter = new MyRecyclerAdapter(contentList, uriList, drawables);
        recyclerView.setAdapter(adapter);
        ((ViewGroup) rootView).addView(recyclerView);
  • mBitmaps 是一组图像。
  • contentList 是一个字符串列表。
  • uriList 是另一个字符串列表。

这是 MyRecyclerAdapter 类的代码:

public class MyRecyclerAdapter extends RecyclerView.Adapter<MyViewHolder> {

    ArrayList<String> mContentList, mUriList;
    ArrayList<Bitmap> mBitmaps;
    MyRecyclerAdapter(ArrayList<String> contentList, ArrayList<String> uriList, ArrayList<Bitmap> drawables){
        mContentList = contentList;
        mUriList = uriList;
        mBitmaps = drawables;
    }

    @Override
    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        final Context ctx = parent.getContext();
        CardView.LayoutParams params = new CardView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        CardView cardView = new CardView(ctx);
        cardView.setLayoutParams(params);

        // set edges round for the cardView
        int radius = 14;
        final float scale = ctx.getResources().getDisplayMetrics().density;
        int pixels = (int) (radius * scale + 0.5f);
        cardView.setRadius(pixels);

        MyViewHolder holder = new MyViewHolder(cardView);
        return holder;
    }

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        Context ctx = holder.itemView.getContext();
        View view = getViewForCard(ctx, position);      // getView for the card
        holder.viewGroup.addView(view);
    }

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

    public View getViewForCard(Context context, int pos){

        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                ViewGroup.LayoutParams.WRAP_CONTENT);
        Context ctx = context;
        LinearLayout ll = new LinearLayout(ctx);
        ll.setLayoutParams(params);
        ll.setOrientation(LinearLayout.VERTICAL);

        TextView tv = new TextView(ctx);
        tv.setText(mUriList.get(pos));
        TextView tv1 = new TextView(ctx);
        tv1.setText(mContentList.get(pos));

        // create an image view and add bitmap to it.
        ImageView imageView = new ImageView(ctx);
        imageView.setLayoutParams(params);
        imageView.getLayoutParams().height = 500;
        imageView.getLayoutParams().width = 500;
        imageView.setImageBitmap(mBitmaps.get(pos));
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

        ll.addView(imageView);       
        ll.addView(tv);                 ll.addView(tv1);

        return ll;
    }

}

这是我的ViewHolder类:

public class MyViewHolder extends RecyclerView.ViewHolder {
    ViewGroup viewGroup;

    MyViewHolder(View view){
        super(view);
        viewGroup = (ViewGroup)itemView;
    }
}

为了重申问题,我该如何防止图像中出现的重叠?

请在问题正文中包含图片,并明确指出问题所在。 - kdbanman
@kdbanman,我已经提供了链接,请访问。由于我是新手,没有足够的声望,所以无法发布图片。:( - Ashutosh Chamoli
抱歉 - 我没有意识到这是由于声望被封锁了。我已经自己进行了编辑。如果编辑通过同行评审,那么您很快就会看到它。 - kdbanman
太棒了@kdbanman,非常感谢您的编辑。 :) - Ashutosh Chamoli
1个回答

1
问题已解决:
 public void onBindViewHolder(MyViewHolder holder, int position) {
    Context ctx = holder.itemView.getContext();
    View view = getViewForCard(ctx, position);      // getView for the card

    holder.viewGroup.removeAllViews();     // **The problem solved here**

    holder.viewGroup.addView(view);
}

我在MyRecyclerAdapter类的onBindViewHolder()方法中从holder.viewGroup中删除了所有视图。现在不再有重叠问题 :)


4
你可以重复使用你的ImageView而不是每次都重新创建它,这肯定会降低性能。 - Submersed
我同意@Submersed的观点,因为它被称为RecyclerView但你却在做相反的事情,没有对视图进行回收利用。 - Jonas Borggren
谢谢,这对我帮助很大。我正在动态创建视图,removeAllViews解决了我的问题! - moyo

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