如何使用像谷歌图像搜索一样的高度相等的行交错网格视图?

时间:2016-12-30 17:42:32

标签: android staggered-gridview

是否有人知道如何在Google图片搜索中实现交错的网格视图/布局,例如结果屏幕?见下图。

Staggered grid view like Google Image Search 该网格具有(几乎)相等高度的项目。它是垂直滚动的。这对于具有特定顺序的项目的gridview非常有用,例如按发布日期排序。

在视觉上,在一个高度相等的交错网格中,由于从左到右轻松阅读,项目的顺序更容易阅读。

将此与具有相等宽度的列的交错网格进行比较。见下图。项目的顺序不易阅读(在本网站的情况下无关紧要)。所以这不是我要找的!

Pinterest masonry layout

Android API documentation中,我无法找到如何在上面第一张图片中创建交错网格的线索。在Stack Overflow上标记为Staggered Grid和Android的所有帖子中,我都找不到答案。

所以我的问题是:如何用以下方式完成这个交错的网格:

  • 等高的行,
  • 垂直滚动?

2 个答案:

答案 0 :(得分:1)

Android不为StaggeredGridView提供默认库。您可以使用带有StaggeredGridLayoutManager(https://developer.android.com/reference/android/support/v7/widget/StaggeredGridLayoutManager.html)的RecyclerView执行此操作,也可以使用自定义库com-etsy.android.grid.StaggeredGridView。通过gradle文件下载:

repositories {
    mavenCentral()
}

dependencies {
    compile 'com.etsy.android.grid:library:x.x.x'
}

有关详细信息,请访问:http://www.technotalkative.com/lazy-productive-android-developer-part-6-staggered-gridview/

答案 1 :(得分:0)

您需要FlexboxLayoutManager。

https://github.com/google/flexbox-layout#flexboxlayoutmanager-within-recyclerview

dependencies {
    implementation 'com.google.android:flexbox:x.x.x'
}