Question

我设置了一个典型的回收器适配器。适配器中的某些项目有图像，有时只有一个图像，有时是20.我想创建一个图像拼贴，如下图所示，具体取决于每个项目中的图像数量：

我有10种不同的布局。第一个是当项目只有1个图像（布局中为1 ImageView）时使用，当项目有2个图像（布局中有2个ImageViews时使用另一个图像），另一个用于项目时有3个图像，等等。如果项目有超过10个图像，它使用10 ImageViews的布局并隐藏其余图像。布局命名为：

one_image.xml
two_images.xml
three_images.xml
......等......

这是我的Recycler适配器：

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

    private static Context context;
    private List<Message> mDataset;

    public RecyclerAdapter(Context context, List<Message> myDataset) {
        this.context = context;
        this.mDataset = myDataset;
    }

    public static class ViewHolder extends RecyclerView.ViewHolder implements View.OnCreateContextMenuListener, View.OnClickListener {
        public TextView title;

        public ViewHolder(View view) {
            super(view);
            view.setOnCreateContextMenuListener(this);

            title = (TextView) view.findViewById(R.id.title);
        }
    }

    @Override
    public RecyclerAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.message_layout, parent, false);
        ViewHolder vh = new ViewHolder((LinearLayout) view);

        return vh;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Message item = mDataset.get(position);

        holder.title.setText(item.getTitle());

        int numImages = item.getImages().size();
        if (numImages > 0) {
            // Show image collage
        }
    }

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

}

以下是主要布局message_layout.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />

    // Image collage layout

</LinearLayout>

这是图片拼贴布局之一，two_images.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/image_one"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        />

    <ImageView
        android:id="@+id/image_two"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        />

</LinearLayout>

所以问题是，如何根据进入回收器适配器的图像数量加载/充气正确的布局，并用图像填充布局？

Answer 1

您可以使用StaggeredGridLayoutManager来实现上述类型的布局。 Click here for more information about StaggeredGridLayoutManager

有许多用于交错gridview的库。你可以使用其中任何一个。我建议使用这个： AndroidStaggeredGrid

Answer 2

您应该为每个布局创建一个自定义ViewHolder。

想象一下您拥有这个ViewHolder：TwoImagesViewHolder

public class TwoImagesViewHolder extends RecyclerView.ViewHolder {
    public TextView title;
    public ImageView imageOne;
    public ImageView imageTwo;

    public TwoImagesViewHolder(@NonNull View view) {
        super(view);
        title = (TextView)view.findViewById(R.id.title);
        imageOne = (ImageView)view.findViewById(R.id.image_one);
        imageTwo = (ImageView)view.findViewById(R.id.image_two);
    }
}

在适配器内部，您可以像这样使用支架：

@Override
public RecyclerAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    Message item = mDataset.get(position);
    int numImages = item.getImages().size();
    if (numImages == 2) {
        return new TwoImagesViewHolder(LayoutInflater.from(parent.getContext()).inflate(R.layout.message_layout, parent, false))
    }

    // Add all the conditions for your custom ViewHolders 

    return DefaultViewHolder; // Define a Default holder 
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
    Message item = mDataset.get(position);
    int numImages = item.getImages().size();
    if (numImages == 2) {
      // Show image collage
      TwoImagesViewHolder holder = (TwoImagesViewHolder)viewHolder;
      holder.title.setText(item.getTitle());
      holder.image_one.setImageResource(...);
      holder.image_two.setImageResource(...);
    }

    // Add all the conditions for your custom ViewHolders 
}

您需要创建所有条件以实例化正确的布局所有者，并记住onCreateViewHolder和onBindViewHolder具有相同的条件。

在回收器适配器的图象拼贴画

2 个答案: