具有不同单元格大小、pinterest 样式的 gridView

Posted 2023-02-21

【中文标题】具有不同单元格大小、pinterest 样式的 gridView

【英文标题】：gridView with different cells sizes, pinterest style

【发布时间】：2013-09-04 15:33:00

【问题描述】：

背景

GridView 是一个扩展 AdapterView 的类，这意味着它可以有效地以网格样式显示单元格，在用户滚动时回收旧视图以显示为新视图。

问题

有时，您可能希望获得一个特殊的 UI，它类似于 Windows Phone Tiles UI，具有不同大小的单元格。

类似这样的：

AABB
AACC
AADD
AADD

每个字母代表其单元格的一部分，因此单元格 A 为 2x4 ，单元格 B 和单元格 C 各取 2x1 ，单元格 D 为 2x2 。

可能还不止于此，单元格 D 的完成位置略高于我所展示的内容，而在它的正下方有另一个单元格，因此 D 的结尾和 A 的结尾不需要对齐。

具有这种风格的应用示例是pinterest。

GridView 不允许这样的事情。

事实上，我尝试过的每个解决方案都有问题。想问问有没有其他替代方案或更好的解决方案。

我发现了什么

有多种方法可以处理这个问题：

作为扩展AdapterView 的类，GridView 能够为每个项目指定一个类型（使用BaseAdapter），这将允许您设置单元格的布局方式。

但是，它仍然会限制你，因为你会得到一排排的项目，一个在另一个之下。你必须让它们对齐。

GridLayout 是一个相对较新的布局，而且非常灵活。 Google 为其发布了一个很好的兼容性库，支持 API7 及更高版本。

但是，它不使用任何视图回收，因此如果您希望显示很多项目，这是一个糟糕的选择。

如果您有很多项目，则需要为它们创建所有视图。

QuiltView Library - 继承自GridLayout，所以基本上有同样的问题。

StaggeredGridView - 看起来最有前途，但有很多错误，尤其是在改变方向时。此类错误包括空单元格、不良滚动和 NPE（很少见但仍然会发生）。我也不确定它是否支持自定义单元格而不是单独的 imageViews。

其他解决方案，如提及here。

问题

有人知道这个问题的另一种替代方法吗？对于我展示的任何解决方案，也许有一些解决方法？

---

编辑：我认为关于 StaggeredGridView ，滚动和异常可以通过使用您在 getView 中设置其大小的普通 ImageView 来解决。我认为它以一种奇怪的方式工作的原因是样本在从互联网加载后更新了 imageview 的大小。

然而，空单元问题仍然存在于这个库中。不仅如此，即使不改变方向，它们的大小也会发生很大变化。

---

编辑：目前，我认为最好的解决方案是使用 PinterestLikeAdapterView library。

我找不到任何问题。

但是，它不能使项目占用超过 1 个单元格宽度。不过还是很不错的。

编辑：遗憾的是 notifyDataSetChanged 存在问题。我已经举报了here。

【问题讨论】：

我强烈推荐 this 双同步 ListView 库。它比使用 GridView 更高效

@bZea 我已经提到过这个解决方案（列表中的#5）。它有很多问题。它不能对所有项目使用单个适配器。它不是流畅的（一个接一个地滚动列表视图），也不是可定制的（无法设置列数）。

jayway.com/2014/02/17/a-multi-column-list

【参考方案1】：

现在回答有点晚了吗？

从 etsy 检查这个库。 看起来很有希望。

https://github.com/etsy/androidStaggeredGrid

我认为是https://github.com/maurycyw/StaggeredGridView的更新版本

.

已更新。

尝试改用来自谷歌的RecyclerView StaggeredGridLayoutManager

    RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
    recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL));
    recyclerView.setItemAnimator(new DefaultItemAnimator());
    recyclerView.setAdapter(adapter);

【讨论】：

我都试过了，从默认配置判断，我认为它更好。就我而言，etsy 可以很容易地与 chris banes pull 集成到 release 中。

他们说那里缺少一些基本的东西：“StaggeredGridView 不支持以下内容：项目选择器可绘制对象、项目长按事件、滚动条、行分隔符、边缘效果、淡入淡出边缘、过度滚动”

怎么样：developer.android.com/reference/android/support/v7/widget/…

【参考方案2】：

我认为RecyclerView 和StaggeredGridLayoutManager 可以解决这个问题，如果你也想拥有一个快速滚动条，你可以试试this library。

因此，无需更多技巧，因为 Google 提供了解决方案...

【讨论】：

我仍然找不到任何好的小部件，例如我试图实现StaggeredGridLayoutManager 但不能，看看我在this 遇到的问题。如果您找到它的实现，您可以添加参考。谢谢。

【参考方案3】：

您可以使用单个 ListView 来完成此操作，其中每个单元格都包含不同的网格模板。使用这种技术，我已经完成了与您所描述的类似的事情。如果单元格大小需要唯一，这将不起作用，但对于您描述的情况应该足够了：

AABB
AACC
AADD
AADD

创建一些这样的模板，具有 A、B、C、D 的各种排列，然后您可以将它们随机用作 ListView 单元格，并且一些简单的偏移数学将允许您的适配器填充每个子单元格以完成类似以下：

AABB
AACC
AADD
AADD

BBBB
ACCC
ADDD
ADDD

AAAA
BBCC
BBCC
DDDD

AABB
AACC
AADD
AADD

AABB
AACC
DDDD
DDDD

【讨论】：

我所展示的只是一个例子。有更多可能的方式来放置单元格，并且设备上的单元格数量可能会随着小型设备和大型设备（例如平板电脑）而变化，并且您可能希望在设备处于横向而不是纵向时进行更改.不过，这是一个不错的解决方案。