带有两列的网格视图,第一项跨越两列

34

我有一个ImageView和一个GridView..

我的布局设计在这里..

enter image description here

我想将这两个视图合并为单个GridView

我的问题是:

如何设置GridView的第一个项目跨越两列?


1
我添加了一个答案。我建议您更改问题的标题和内容,以便其他正在寻找此解决方案的人可以找到它。也许可以改成:“带有两列的GridView,第一项跨越两列”。 - kris larson
1个回答

72

在研究您的问题时,我学到了一些新知识:我碰巧看到了用于RecyclerViewGridLayoutManager,并且我注意到您可以设置自定义的SpanSizeLookup。现在,“span”只是一个列,如果垂直滚动,则为行。因此,SpanSizeLookup允许您指定例如,第0项占据2列,第1项占据1列等。

结果发现,如果使用GridLayoutManagerRecyclerView,解决方案非常简单:

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Create a grid layout with two columns
        GridLayoutManager layoutManager = new GridLayoutManager(this, 2);

        // Create a custom SpanSizeLookup where the first item spans both columns
        layoutManager.setSpanSizeLookup(new GridLayoutManager.SpanSizeLookup() {
            @Override
            public int getSpanSize(int position) {
                return position == 0 ? 2 : 1;
            }
        });

        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerview);
        recyclerView.setLayoutManager(layoutManager);
        recyclerView.setAdapter(new MyGridAdapter());
    }

我创建了一个测试项目,只是为了尝试一下并确保它按照我的预期工作,结果非常完美。


关于适配器的注意事项:RecyclerView.AdapterListAdapter不兼容。您需要从RecyclerView.Adapter扩展适配器并进行适当的更改。

这是我为我的测试项目创建的适配器:

    public static class MyViewHolder extends RecyclerView.ViewHolder {

        ImageView mImageView;
        TextView mTextView;

        public MyViewHolder(View itemView) {
            super(itemView);
            mImageView = (ImageView) itemView.findViewById(R.id.imageView);
            mTextView = (TextView) itemView.findViewById(R.id.textView);
        }
    }

    public static class MyGridAdapter extends RecyclerView.Adapter<MyViewHolder> {

        private int[] mDrawables;

        public MyGridAdapter() {
            this.mDrawables = new int[] {
                    R.drawable.images_01,
                    R.drawable.images_02,
                    .
                    .
                    .
            };
        }

        @Override
        public int getItemCount() {
            return mDrawables.length;
        }

        @Override
        public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

            LayoutInflater inflater = (LayoutInflater) parent.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            View view = inflater.inflate(R.layout.layout_grid_item, parent, false);
            MyViewHolder holder = new MyViewHolder(view);
            // set up any onClickListener you need on the view here
            return holder;
        }

        @Override
        public void onBindViewHolder(MyViewHolder holder, int position) {

            holder.mImageView.setImageResource(mDrawables[position]);
            holder.mTextView.setText("Image " + position);
        }
    }

首先,创建一个RecyclerView.ViewHolder子类。视图持有者模式现在成为了适配器视图新方式中的一个必要组成部分。您的ViewHolder将为您的视图设置所有子视图。

然后,在您的RecyclerView.Adapter子类中,重写onCreateViewHolder()onBindViewHolder()方法。在onCreateViewHolder()中,您需要填充您的视图并构造ViewHolder对象。在onBindViewHolder()中,您使用position从适配器数据中获取信息,并使用ViewHolder来设置子视图。因此,RecyclerView会技术性地回收包含ViewViewHolder

一旦您对适配器做出这些更改,就可以开始使用了。


我用RecyclerView替换了我的ImageView和GridView。应用你的代码后,recyclerView.setAdapter(adapter);出现了错误。 - AndroidDev
1
遗憾的是,RecyclerView.AdapterListAdapter不兼容,因此您需要稍微重新调整一下适配器。我会更新我的答案,添加一些相关内容。 - kris larson
谢谢,太神奇了,你能分享一下你是如何找到解决方案的吗?因为我已经搜索了10多天了,很多谷歌都没有给出答案。 - AndroidDev
2
不太确定。做了这么多年的编程,我觉得已经有了一种本能。我刚开始查看GridViewRecyclerView.GridLayoutManager的文档,然后看到了SpanSizeLookup,突然间有了灵感。但是我还是需要做一个测试项目来确保我的直觉是正确的。 - kris larson
仅适用于水平布局?如何实现垂直布局(即合并行)? - Huy Nguyen

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