圖示標記

圖示標記是空間註解系統的一部分。使用圖示標記,協助標註真實世界中的物件。

圖示標記總覽 (含/不含 UI 元素)

原則

情境:圖示標記會鎖定在現實世界的物體或地點。

簡潔:圖示標記是空間錨點的縮寫視覺指標。

使用與刊登位置

圖示標記是類似圖示按鈕的 UI 元素,可標記使用者環境中感興趣的物件。圖示標記是一種空間標記,用於空間錨定。

使用圖示標記為真實世界物件加上註解。
如果圖示按鈕更適合,請使用圖示標記做為裝飾元素或非真實世界物件註解。

任何其他 Jetpack Compose Glimmer 元件都可以與標記搭配使用,進一步釐清或深入瞭解使用者周遭環境。

使用漸進式揭露,讓使用者瀏覽更多資訊。
在標記上加入過多額外 UI,這會對使用者的環境造成更大干擾。

內容和標籤可以放在不同方向。標記和任何附加的 UI 都應視為空間 UI,也就是說,標記物件的實際距離應反映在 UI 的大小上,並使用固定的角度 DP 大小。

兩張閃光卡和標記,附在相關產品上 清楚定義標記,避免視覺雜亂,並限制檢視畫面中的標記數量。如果需要多個標記,請將這些標記組合成一個更醒目的標記,方便使用者逐步查看。

州

圖示標記與圖示按鈕非常相似。主要差異在於,它沒有停用狀態,而是非互動狀態。

圖示標記有非互動式和互動式兩種 使用非互動狀態為實體世界加上註解,例如標示搜尋點。

如果可能有更多資訊,您可以使用具有按鈕功能的可互動狀態。如果使用者輕觸圖示標記,系統會顯示 Glimmer 資訊卡,提供更多資訊。

圖解

圖示標記本身是小型圖示按鈕 UI 元素,具有邊框間距,可固定 UI 對齊方式和方向。圖示標記也可以使用大或小圓點,而非圖示。互動狀態包含視覺化功能,可表示按鈕狀態。

圖示標記有互動和非互動狀態,以及聚焦、按下和啟用狀態

邊框間距

水平和垂直排列的 UI 具有中等邊框間距,而對角配對的元素則預設為 0 dp 邊框間距。

水平和垂直元素的預設邊框間距為 12 dp

對齊

UI 元素可以放在水平、垂直或對角線位置。

Glimmer UI 元素靠頂端置中和靠右上對齊

方向

內容應朝向使用者,同時遵循重力原則,讓內容看起來井然有序。

自訂

為保持一致的視覺效果,請避免自訂圖示標記。不過,您可以自訂附加 UI 元素的方向和對齊方式。

屬性 自訂 預設值
圖示 是 大圓點、小圓點、圖示
邊框間距 否 頂端置中、右側置中、底部置中、左側置中 = 中 左上、右上、右下、左下 = 0 dp
對齊 是 TopLeft、TopCenter、TopRight、CenterLeft、CenterRight、BottomLeft、BottomCenter、BottomRight
方向 是 RotateToLookAtUser:無論旋轉角度為何,圓點都會朝向使用者。