Grid List 网格列表

网格列表在一个系统的网格中展示了一系列的图像。

网格列表展示了一个在重复的模式中的子集。 它们有助于提高对所持内容的视觉理解。

仅有图像的网格列表

这是一个可滚动的图像的网格列表的简单示例。

带有标题栏的网格列表

此示例演示如何使用 ImageListItemBar 为每个 ImageListItem 添加一个叠加层。 叠加层可以容纳 title， subtitle 和辅助操作—在本例中为 IconButton。

单行网格列表

此示例演示了可以在水平方向滚动的单行纯图像网格列表。 我们其实不鼓励水平滚动网格列表，因为滚动会干扰典型的阅读模式，从而影响用户的理解。 一个值得注意的例外是水平滚动的单行网格图像列表，例如图库。

高级网格列表

此示例演示了“精选的”瓷砖效果 ，使用 rows 和 cols props 来调整磁贴的大小，并使用 padding 属性来调整间距。 瓷砖有一个位于顶部的自定义标题栏，并带有自定义渐变的 titleBackground 。 而辅助操作的 IconButton 则位于左侧。

<<<<<<< HEAD:docs/src/pages/components/grid-list/grid-list-zh.md

=======

[GridList] Rename to ImageList & add deprecation warnings (#22363):docs/src/pages/components/image-list/image-list-zh.md

API

• <ImageList />
• <ImageListItem />
• <ImageListItemBar />