gridView具有不同的单元格大小,pinterest风格

时间:2013-09-01 10:58:02

标签: android android-gridview cells android-adapterview android-gridlayout

背景

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

问题

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

这样的事情:

AABB
AACC
AADD
AADD

每个字母代表其细胞的一部分,因此细胞A是2x4,细胞B和细胞C各占2x1,细胞D是2x2。

甚至可能更多,其中单元格D略高于我所显示的,并且在其下方有另一个单元格,因此D的末尾和A的末尾不必对齐。

具有此样式的应用的示例是pinterest

GridView不允许这样的事情。

事实上,我尝试过的每一个解决方案都存在问题。想问一下是否有其他替代方案或更好的解决方案。

我发现了什么

有多种方法可以解决此问题:

  1. 作为扩展AdapterView GridView 的类,可以为每个项目设置一个类型(使用BaseAdapter),这样您就可以设置如何布局单元格。

    然而,它仍然限制了你,因为你会得到一排物品,一个在另一个之下。你必须让它们对齐。

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

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

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

  3. QuiltView Library - 从GridLayout扩展,所以基本上有类似的问题。

  4. StaggeredGridView - 看起来最有希望,但有很多错误,特别是在改变方向时。这样的错误包括空单元格,坏滚动和NPE(罕见但仍然发生)。我也不确定它是否支持自定义单元格而不仅仅是imageViews。

  5. 其他解决方案,如提及here

  6. 问题

    有没有人知道这个问题的另一种替代方案?对于我展示的任何解决方案,可能有一些解决方法吗?


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

    但是,空单元格问题仍然存在于此库中。不仅如此,即使不改变方向,它们的尺寸也会发生很大变化。


    编辑:目前,我认为最好的解决方案是使用PinterestLikeAdapterView library

    它没有任何我能找到的问题。

    但是,它不能使项目占用超过1个单元格宽度。然而,它非常好。

    编辑:遗憾的是它与notifyDataSetChanged有问题。我已经报道了它here

3 个答案:

答案 0 :(得分:17)

回答有点晚了吗?

从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);

答案 1 :(得分:5)

我认为使用RecyclerViewStaggeredGridLayoutManager可以解决此问题,如果您还希望拥有快速滚动条,则可以尝试this library

因此,谷歌提供了一个解决方案......

答案 2 :(得分:0)

您可以使用单个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