堆疊

堆疊是收合清單，一次只會以堆疊視覺效果顯示一項內容，例如通知或資訊卡。

原則

堆疊是容器元件，因此與資訊卡和清單共用設計原則：

包含：堆疊會將相關資訊和動作分組，方便使用者一次查看。

清楚且有焦點：清楚呈現內容，並突顯重點。

多功能：堆疊可顯示資訊卡和通知。

呈現方式一致：堆疊會遵循一致的視覺結構。

使用方式與位置

堆疊可向使用者顯示清單中有多個摺疊元素，同時盡量減少檢視畫面中的視覺元素。 堆疊有兩種不同變體：

資訊卡堆疊

通知堆疊

堆疊是容器元件，兩個版本在運作方式或外觀上沒有差異。

兩者應看起來和運作方式幾乎相同。堆疊只是這些控制項的容器，內建分頁邏輯。

使用者可以透過觸控板向前和向後滑動或拖曳，捲動堆疊時，一次只會移動一個項目。

使用深度表示焦點

堆疊底部的項目深度為 0，最頂端的項目深度則為 +2。

堆疊可一次遍歷一個項目

在觸控輸入時，堆疊可以垂直移動，一次呈現一個項目。

輕觸輸入時，堆疊會變成清單，一次顯示多個元素。  清單應使用預設容器和焦點狀態。

圖解

堆疊一律會以分頁元件的形式摺疊。除非有巢狀啟用的按鈕，否則頂端項目一律是主要焦點，會顯示較深的邊框深度。

串場廣告有助於強化堆疊的結尾/開頭。彈簧動畫，可在放開後將清單彈回原位。

自訂

堆疊內建的半透明遮罩、分頁和動畫無法自訂。而是自訂堆疊中的內容。