挑選器

挑選器可協助使用者選取及設定特定資料。

挑選器

挑選器可用於讓使用者選擇數量有限的項目。

根據預設,項目會無限循環播放。如果清單中的順序很重要,建議您停用這項行為,或是讓使用者透過快速滑動前往第一個和最後一個元素。

圖解

圖解

A. 停用的資料欄
B. 冒號斷路器
C. 挑選器欄
D. 熱門內容
E. 中間內容
F. 底部內容

寬度和高度

Picker Group 填滿可用高度和寬度。挑選器資料欄提供四種版面配置選項。每個版面配置都會置中顯示,並填滿可用的高度。欄寬度是根據字型所需的位數所定義,但日期挑選器為例外狀況,水平工具會填滿螢幕,並在邊緣出血。

舉例來說,數字的寬度「00」即為寬度,然後設定寬度。就文字欄位而言,是將月份欄位當做「MMM」的寬度 (也就是拉丁字母中最寬的字母)。寬度和高度 (該類型樣式使用的行高) 會受到所用字型的影響。

挑選器項目的大小會因中斷點的大小而異。

使用方式

請參閱下列日期和時間挑選器範例

如需預先建立的日期和時間挑選器,請查看 GitHub 的 Horologist 程式庫

如要建立類似的體驗,讓使用者跨多個挑選器選擇多個部分的值,請使用內建的 PickerGroup 元件。這個物件會使用焦點協調工具物件,將焦點指派給正確的 Picker 元素。

自動調整式版面配置

TimePicker (24 小時)

TimePicker 12 小時

日期挑選器

回應式行為

文字大小增加

在過去 225 個以上的中斷點之後,挑選器元素的字型大小會有所變更。系統會調整延遲捲動欄的頂端和底部文案 (A),也會調整中間文案。以下列舉幾個例子:

雙欄版面配置

低於 225 dp 中斷點

字型:螢幕 2

超過 225 dp 中斷點

字型:螢幕 1

三欄版面配置

低於 225 dp 中斷點

字型:多媒體 3

超過 225 dp 中斷點

字型:多媒體 2

增加漸層大小

「挑選器」欄的漸層會根據可用空間,以高度定義。「頂端」和「底部漸層」都設在可用高度的三分之一 (33%) 處。也就是說,在每種可用的螢幕大小上,漸層會按比例縮放。獨立於資料欄版面配置。

低於 225 dp 中斷點

大小:欄高 33%

超過 225 dp 中斷點

大小:欄高 33%

增加欄間距

欄間距會縮放至超過 225 個中斷點 (2 dp 或 4 dp),並增加至 6 dp。這取決於你選取的版面配置:2 或 3 欄版面配置

雙欄版面配置

低於 225 dp 中斷點

4 dp 欄間距

超過 225 dp 中斷點

6 dp 欄間距

三欄版面配置

低於 225 dp 中斷點

2 dp 欄間距

超過 225 dp 中斷點

6 dp 欄間距