如何在GridLayout中使第一张图片变大？

Question

确切地说，我想要实现这个效果。

我正在使用GridLayoutManager来使用RecyclerView，并且我已经使用以下代码使第一个item变大：

        lLayout.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
        @Override
        public int getSpanSize(int i) {
            if (i==0) return 2;
            else return 1;
        }
    });

除一个问题外，一切都正常：位于位置1的项目（即大图像的下一个项目）在垂直方向上拉长以匹配大项目的高度。从第3行开始，所有图像均如图所示。

我该如何摆脱这个问题？

编辑：经过一些分析

所以问题似乎是大图像需要占用两个水平跨度，但只有一个垂直跨度，并且由于我已经强制将我的ImageView变成正方形，它看起来好像也占用了两行，实际上它只占用一行。由于这个原因，第二个图像看起来被拉长。

那么现在我的问题是，如何使网格项垂直和水平各占用两个跨度？

- rockfight

---

你找到解决方案了吗？ - rule

我找到的最接近的是StaggeredGridLayoutManager。 - rockfight

嗨@rockfight，我仍在寻找一个合适的解决方案。你有找到任何可以分享的东西吗？我会非常感激。 - Mehdi Satei

嗨 @MehdiSatei ，这是一个非常古老的帖子，我已经几乎完全忘记了我在这上面做了什么。该项目也已经退役。此外，我已经完全转向使用React Native进行移动开发。所以我无法提供帮助。 - rockfight

Answer 1

尝试使用StaggeredGridLayoutManager代替GridLayoutManager。 StaggeredGridLayoutManager支持水平和垂直布局，以及反向布局子项的能力。在适配器的onBindViewHolder方法中，您可以使用以下代码根据项目位置设置跨度。

final ViewGroup.LayoutParams lp = holder.itemView.getLayoutParams();    
if (position == 0) {
                StaggeredGridLayoutManager.LayoutParams sglp = (StaggeredGridLayoutManager.LayoutParams) lp;
                sglp.setFullSpan(true);
                holder.itemView.setLayoutParams(sglp);
            }

找到这个例子http://enoent.fr/blog/2015/01/18/recyclerview-basics/...希望它能够帮助你。

- Amandeep Rohila

---

这个链接对于理解RecyclerView非常有用。谢谢。 - Kushal

首先，GridLayoutManager还支持水平和垂直布局，以及将子项倒置布局的能力。由于setFullSpan(true)，您的代码将使视图跨越整个宽度。我想要的是使第一张图片的跨度是其他项目的两倍，即垂直和水平方向上为两个跨度。我还建议使用链接来了解recyclerview，这非常有帮助。 - rockfight

@rockfight 如果你找到了正确的方法，与其他开发人员分享是非常有帮助的。 - nAkhmedov

Answer 2

在GridViewAdapter类中尝试以下代码

public class GridViewAdapter extends BaseAdapter {
private Context context;
private ArrayList<Integer> imageArrayList = new ArrayList<>();
private int type;

public GridViewAdapter(Context context, ArrayList<Integer> imageArrayList) {
    this.context = context;
    this.imageArrayList = imageArrayList;
}

@Override
public int getCount() {
    return imageArrayList.size();
}

@Override
public Object getItem(int position) {
    return imageArrayList.get(position);
}

@Override
public long getItemId(int position) {
    return 0;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ViewHolder viewHolder = new ViewHolder();
    if(convertView==null){
        LayoutInflater inflater = LayoutInflater.from(context);
        type = getItemViewType(position);
        if(type==0) {
            convertView = inflater.inflate(R.layout.big_layout,parent,false);
        }else {
            convertView = inflater.inflate(R.layout.small_layout, parent, false);
        }
        viewHolder.imageView = convertView.findViewById(R.id.imageView);
        convertView.setTag(viewHolder);
    }else{
        viewHolder = (ViewHolder) convertView.getTag();
    }
        viewHolder.imageView.setImageDrawable(context.getResources().getDrawable(imageArrayList.get(position)));
    return convertView;
}

@Override
public int getViewTypeCount() {
    return super.getViewTypeCount();
}

@Override
public int getItemViewType(int position) {
    if(position==0) {
        return 0;
    }else{
        return 1;
    }
}

    private class ViewHolder{
        ImageView imageView;
    }
}

- Saurav Ghimire

---

我认为这不会起作用，因为我正在使用RecyclerView和GridLayoutManager而不是GridView。 - rockfight