標題方塊

標題資訊方塊會提供一小段資訊。

設計元素應錨定在影格底部。

原則

情境:標題晶片的主要用途是為相關聯的內容提供清楚且即時的情境。

簡潔:標題晶片適用於簡短資訊,通常是簡短的標題、名稱或狀態。

視覺上明顯不同:雖然採用 Jetpack Compose Glimmer 美學,但外觀應明顯不同,可辨識為標籤而非互動式按鈕。

使用方式與位置

根據預設,標題資訊方塊是唯讀元件。

使用靜態或裝飾性元素的標題晶片,向使用者和標籤提供資訊。
請使用標題資訊方塊做為可輕觸的操作提示,因為標題資訊方塊沒有焦點狀態,請改用按鈕。

設計元素應錨定在影格底部。 標題資訊方塊可視為靜態行動應用程式列。

在版面配置中

根據預設,標題資訊方塊是唯讀元件。

方塊會隨著版面配置捲動
或者,也可以在版面配置中固定顯示方塊。方塊會佔據頂端 56 dp。

圖解

設計元素應錨定在影格底部。 顯示預設標題方塊和固定標題方塊。系統會顯示帶有外框的固定式標題資訊方塊。

1. 標題方塊標籤

2. 選用的前置圖示或實體

自訂

標題晶片可以顯示圖示,也可以不顯示,並搭配其他樣式屬性。

屬性 自訂 預設值
形狀 大圓
邊框間距 16 dp、8 dp
框線 2 dp,#606460
文字 Body Small
前置圖示 40 dp
厚度 0
最大寬度 352 dp
高度下限 56 dp