網格列表是標準列表視圖的替代方法。

網格列表由以垂直和水平布局排列的重復單元格圖案組成。

網格列表最適用于類似的數據類型。它們有助于提高對其所包含內容的視覺理解。

用法

網格列表最適合于呈現同質數據（通常是圖像），并且針對視覺理解和區分相似數據類型進行了優化。

甲網格列表由重復圖案的細胞的網格列表內垂直和水平排列。

平鋪包含內容，可以垂直或水平跨越一個或多個單元格。

如果拼貼中的文本需要足夠突出以區分主要內容片段，請考慮使用不同的容器，如列表或卡片，優化用于顯示文本和促進閱讀理解。

列表：針對閱讀理解進行了優化，尤其是在比較包含多種數據類型的一組數據時。

卡片：用于格式不一致的內容，例如帶有可變長度字幕的照片，或具有異構內容的數據集，例如照片和視頻以及書籍的混合集合。

內容

瓷片內容

平鋪內容包括主要內容和次要內容。主要內容是主要的區分元素，通常是圖像。輔助內容可以是動作或文本。

為缺少主要內容圖像的切片提供默認圖像。

瓷片中的操作

主要內容和輔助內容上的操作（例如播放，放大，刪除或選擇）是立即的，通常不會導致網格列表中的選項子菜單（操作溢出）。

操作可以打開后續視圖，例如卡片。

主要行動

• 填充整個圖塊，因此不會通過圖標或文本表示
• 在特定網格列表中的整個圖塊中是一致的。例如，單個網格列表中所有切片的主要操作可能是查看圖像的詳細信息。

次要動作或內容

• 用圖標或文字表示瓷磚
• 在特定網格列表中的整個圖塊中是一致的
• 放置在特定網格列表的切片內的一致位置，但該一致位置可能在網格列表（角落或邊緣）之間變化。例如，一個網格列表中的所有標題可以位于左下角，而另一個網格列表中的所有切片可以將標題放在左上角。

行為

滾動

網格列表通常僅垂直滾動。

不鼓勵水平滾動網格列表，因為滾動會干擾典型的閱讀模式，從而影響理解。一個值得注意的例外是水平滾動的單行網格圖像列表，例如圖庫，它與典型的閱讀模式兼容。

在視圖的初始滾動位置切斷網格圖塊以傳達內容溢出的滾動方向。

通過切斷網格圖塊來指示內容溢出。

手勢

不允許使用每個切片滑動操作。不鼓勵采取行動。

平鋪過濾和排序

網格列表中的內容可以按編程方式過濾或按日期，文件大小，字母順序或其他參數排序。

網格列表中的第一個項目位于網格列表的左上角，順序從左到右，從上到下進行。

尺寸和尺寸調整

調整網格列表的大小會導致切片在水平空間可用時重新排序。全出血網格列表切片調整大小以適應屏幕寬度。

當水平空間收縮時，網格列表不會轉換為列表。網格列表和列表是用于強調不同數據類型的單獨結構。網格列表優先考慮文本上的圖像，并列出文本優先于圖像。

要在整個網格列表中保持一致的節奏，請截斷對于圖塊寬度而言太長的文本內容。或者，增加網格大小，以便切片可以容納更長的標題。

響應式設計

全屏網格列表應使用具有最小和最大寬度的流體圖像比率，使用比率基線。它們應該保持固定的高度，邊距和填充。

中心網格列表具有最小寬度的流體邊距。它們保持固定的圖像寬度，高度和填充。

標注

網格列表頁眉/頁腳

單行頁眉/頁腳

高度：48dp
文本填充：16dp
默認字體大小：16sp
輔助操作是向頁腳右側齊平。

雙行頁眉/頁腳

高度：68dp
文本填充：16dp
每行的默認字體大小：16sp / 12sp或14sp / 14sp

僅圖像網格列表
網格列表填充：4dp或1dp
網格列表中的切片可以跨越多列。
仔細考慮在使用多列切片的網格列表中是否需要輔助文本，因為較大的切片可能會產生顯著的空白空間。

單行網格列表

純文本

高度：48dp
文本填充：16dp
默認字體大小：16sp
網格列表填充：4dp或1dp

帶有圖標的文本

高度：48dp
文本填充：16dp
默認字體大小：16sp
網格列表填充：4dp或1dp

輔助動作可以在頁腳或標題內向右齊平或向左齊平。

雙線網格列表

純文本

高度：68dp
文本填充：16dp
每行默認字體大小：16sp / 12sp或14sp / 14sp
網格列表填充：4dp或1dp

帶有圖標的文本

高度：68dp
文本填充：16dp
每行的默認字體大小：16sp / 12sp或14sp / 14sp

輔助動作可以在頁腳或標題內向右齊平或向左齊平。

網格列表填充：4dp或1dp

總結

以上是生活随笔為你收集整理的树型列表结构宽度调整_Material Design 网格列表的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。