类似Pinterest的Android异构网格视图？

Question

是否可以在Android上使用GridView创建类似Pinterest的布局？我想使用GridView创建图像库，但我不确定它是否是一个好的解决方案。我不想创建三个LinearLayouts（我认为这种解决方案不好：Android上的Pinterest样式列表视图或网格视图）

有什么好的想法吗？;)

- radzio

---

不确定图片上是否是一个GridView。 - Shark

GridView在这里无法工作，因为所有图像的高度不同。 - MAC

在我看来，它真的只是三列imageView。 - Shark

我认为最好的方法是创建自己的视图并自己处理绘制代码。 - Che Jami

@CheJami：可能这是唯一的解决方案；/ - radzio

Answer 1

我也曾尝试过使用LinearLayout，但最终遇到了很多内存消耗的问题（特别是在重新加载项目时）。我采用了一个简单的解决方案，它使用了两个同步的ListViews，这样我就可以利用内部缓存，这对我的情况有很大帮助。

为了实现这一点，我不得不使用OnTouchListener和OnScrollListener来同步列表。下面是一个例子：

https://github.com/vladexologija/PinterestListView

- vladexologija

---

你看，这个版本还有很多事情要做（修复一些错误，优化，简化...），但是它已经可以正常工作了。最重要的是它使用了回收利用！ - vladexologija

@vladexologija 非常感谢您发布如此出色的帖子。 - San

@vladexologija 我想从我的SD卡中设置图像。由于您使用了整数数组，我无法传递图像的路径。有什么好的方法可以实现这个吗？这将非常有帮助。提前致谢。 - San

这个例子的作用是同步两个列表。如果您使用自定义适配器构建任何两个列表（在您的情况下，使用一些懒加载加载图像），它们应该可以与发布的代码进行轻微更改后正常工作。 - vladexologija

有人知道如何处理onItemClick吗？它对我不起作用。 - fish40

Answer 2

创建如下布局。

<ScrollView...>
<LinearLayout....
   android:id="@+id/linear1"
   orientation="horizontal">

   <LinearLayout....
     android:id="@+id/linear2"
     android:layout_weight="0.33"
     orientation="vertical">

   <LinearLayout....
     android:id="@+id/linear3"
     android:layout_weight="0.33"
     orientation="vertical">

   <LinearLayout....
     android:layout_weight="0.33"
     orientation="vertical">

</LinearLayout>
</ScrollView>

现在在布局中动态添加你的ImageView

linear1 = (LinearLayout) findViewById(R.id.linear1);
linear2 = (LinearLayout) findViewById(R.id.linear2);
linear3 = (LinearLayout) findViewById(R.id.linear3);

for(int i=0;i<n;i++)
{
   ImageView iv = new ImageView(this);
   iv.setImageResource(R.id.icon);

   int j = count % 3;  <---- 
   if(j==0)
       linear1.addView(iv);
   else if(j==1)
       linear2.addView(iv);
   else
       linear3.addView(iv); 
}

输出结果：

- MAC

---

我知道这是可能的，但我不想使用LinearLayout，因为视图回收会出现问题。这种解决方案在有许多ImageView的情况下效果不佳。 - radzio

好的，您愿意怎样我就怎样，但我已经完成了这个任务并正在从URL加载120张图片。 - MAC

它是否运行快速且不会出现内存消耗问题？ - Nam Vu

这个解决方案可以工作，但如果有很多项，它可能会导致初始化变慢和OOM。我添加了一个可能的解决方案，它使用了adapterView的相同思路。 - android developer

最佳库 https://github.com/maurycyw/StaggeredGridViewDemo - Pratik Butani

Answer 3

实现类似Pinterest网格视图的一些有用的库：

• https://github.com/maurycyw/StaggeredGridViewDemo（瀑布流布局）
• https://github.com/jacobmoncur/QuiltViewLibrary（拼布风格布局）
• https://github.com/huewu/PinterestLikeAdapterView（Pinterest网格布局）
• https://github.com/vladexologija/PinterestListView（带有卡片效果的Pinterest网格布局）
• https://github.com/expilu/AntipodalWall（反极点墙布局）

- petrnohejl

---

有没有水平滚动的示例？ - Gorets

我在我的应用程序https://play.google.com/store/apps/details?id=com.taureano.amazicons中使用了staggeredGridView库，效果非常好，因此我投票支持这个答案。该库在方向更改时存在一个小错误，但我在stack overflow上找到了解决方法。 - Swati Rawat

Answer 4

对于最近查看此问题的访问者，我建议使用带有StaggedGridLayoutManager的RecyclerView。它具有足够的功能和灵活性。

- MohK

Answer 5

一个可独立使用的辅助程序，用于同步滚动2个ListView: https://gist.github.com/yanchenko/6179793

- yanchenko

Answer 6

我正在使用这个库：https://github.com/huewu/PinterestLikeAdapterView。

它运行得很好。我唯一遇到的问题是setOnItemClickListener和setOnItemLongClickListener有点不稳定，所以我将监听器直接设置到了convertView上。

- emerix

Answer 7

这个库来自于Etsy应用程序：https://github.com/etsy/AndroidStaggeredGrid。

- HannahMitt