挑選器
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
Picker 可協助使用者選取及設定特定資料。
Picker
使用挑選器可讓使用者從有限數量的項目中選擇。
根據預設，項目會在這兩個方向無限循環。如果清單中的順序很重要，請考慮停用這項行為，或是讓使用者透過快速滑動前往第一個和最後一個元素。
圖解
解剖
A. 未使用的資料欄
B. 冒號分隔符
C. 挑選器資料欄
D. 熱門內容
E. 中間內容
F. 底部內容
寬度和高度
Picker Group 會填滿可用的高度和寬度。挑選器資料欄有四種版面配置選項。每個版面配置都會置中，並填滿可用的高度。資料欄寬度是由字型中所需的數字數量所定義，日期挑選器則是例外，它會在水平方向上填滿畫面，並溢出畫面邊緣。
舉例來說，數字會計算出「00」的寬度，然後設定寬度。對於文字欄位 (例如月份欄位)，系統會將寬度設為「MMM」(拉丁字母中寬度最大的字母)。因此，寬度和高度 (即所用字型樣式的行高) 會受到所用字型的影響。
在不同的中斷點中，選擇器項目的大小會有所不同。
用量
請參閱下列日期和時間挑選器範例
如需預先建構的日期與時間挑選器實作，請前往 GitHub 查看 Horologist 程式庫。
如果您想建立類似的體驗，讓使用者在多個挑選器中選擇多個值，請使用內建的 PickerGroup 元件。這個物件會使用焦點協調工具物件，將焦點指派給正確的 Picker 元素。
自動調整式版面配置
TimePicker 24H
TimePicker 12H
日期挑選器
回應式行為
放大文字
超過 225+ 中斷點後，Picker 元素的字型大小會變更。延遲捲動資料欄中的頂端和底部副本會調整 (A)，中間副本也會調整。以下列舉幾個例子：
兩欄版面配置
低於 225 dp 中斷點
字型：Display 2
三欄版面配置
低於 225 dp 中斷點
字型：Display 3
超過 225 dp 中斷點
字型：Display 2
漸層大小增加
Picker 資料欄的漸層效果高度會由可用空間定義。頂部和底部漸層都設為可用高度的三分之一 (33%)。也就是說，在每個可用的螢幕大小下，漸層都會按比例縮放。不受資料欄版面配置影響。
增加欄間距
當列間距超過 225+ 中斷點時，會從 2 dp 或 4 dp 開始，並逐漸增至 6 dp。這取決於您選取的版面配置，即 2 或 3 欄版面配置
兩欄版面配置
三欄版面配置
這個頁面中的內容和程式碼範例均受《內容授權》中的授權所規範。Java 與 OpenJDK 是 Oracle 和/或其關係企業的商標或註冊商標。
上次更新時間：2025-07-27 (世界標準時間)。
[[["容易理解","easyToUnderstand","thumb-up"],["確實解決了我的問題","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["缺少我需要的資訊","missingTheInformationINeed","thumb-down"],["過於複雜/步驟過多","tooComplicatedTooManySteps","thumb-down"],["過時","outOfDate","thumb-down"],["翻譯問題","translationIssue","thumb-down"],["示例/程式碼問題","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["上次更新時間：2025-07-27 (世界標準時間)。"],[],[],null,["# Pickers\n\nThe [Picker](/reference/kotlin/androidx/wear/compose/material/package-summary#Picker(androidx.wear.compose.material.PickerState,androidx.compose.ui.Modifier,kotlin.Boolean,kotlin.Function1,androidx.wear.compose.material.ScalingParams,androidx.compose.ui.unit.Dp,kotlin.Float,androidx.compose.ui.graphics.Color,androidx.compose.foundation.gestures.FlingBehavior,kotlin.Function2)) helps users select and set specific data. \n**Picker**\n\nPickers should be used to let users choose amongst a finite number of items. \n\nBy default items will be looped infinitely in both directions. Consider disabling this behaviour if order in the list is important, or to allow users to reach the first and last element with a quick swipe.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nAnatomy\n-------\n\n**Anatomy**\n\nA. Inactive Column \n\nB. Colon Breaker \n\nC. Picker Column \n\nD. Top Content \n\nE. Middle Content \n\nF. Bottom Content\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Widths and heights**\n\nThe Picker Group fills the available height and width. There are four layout options for the picker columns. Each layout is centred and fills the available height. Column widths are defined by the width needed to accommodate the number of digits needed in the font, Date-picker is the exception, horizontally it fills the screen and bleeds off the edge.\n\nFor example numbers will work out width of '00' is and then set the width. For text fields, for the month field for example, will be worked out as the width of 'MMM' (which is the widest letter in the latin alphabet). The width and height (which is the line height of that type style used) will therefore be affected by the font used.\n\nPicker items vary in size across the breakpoint.\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\nUsage\n-----\n\nSee the following examples of Date and Time Pickers\n\nFor a prebuilt date and time picker implementation, check out the [Horologist Library](https://github.com/google/horologist#-composables) on GitHub. \n\n\nIf you want to create a similar experience, where users choose a multi-part value across multiple pickers, use the built-in [PickerGroup](/reference/kotlin/androidx/wear/compose/material/package-summary#PickerGroup(kotlin.Array,androidx.compose.ui.Modifier,androidx.wear.compose.material.PickerGroupState,kotlin.Function1,kotlin.Boolean,kotlin.Boolean,androidx.wear.compose.material.TouchExplorationStateProvider,kotlin.Function1)) component. This object uses a focus coordinator object to assign focus to the correct Picker element.\n\nAdaptive layouts\n----------------\n\n**TimePicker 24H**\n\n**TimePicker 12H**\n\n**Date Picker**\n\n**Responsive behavior**\n-----------------------\n\n### **Text size increase**\n\nPast the 225+ Breakpoint, the Picker element's font size changes. Top and Bottom copy within the lazy scrolling column adjusts (A), as does the Middle copy. Below are some examples of this:\n\n**Two column layout** \n**Below the 225 dp breakpoint**\n\nFont: Display 2 \n**Above 225 dp breakpoint**\n\nFont: Display 1\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Three column layout** \n**Below the 225 dp breakpoint**\n\nFont: Display 3 \n**Above the 225 dp breakpoint**\n\nFont: Display 2\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Gradient size increase**\n--------------------------\n\nThe gradient on the Picker column is defined in height by the available space. Both Top and Bottom Gradients are set at a third (33%) of the available height. This means at each available screen size, the gradient scales proportionally. Sitting independent of the column layout. \n**Below the 225 dp breakpoint**\n\nSize: 33% of column height \n**Above the 225 dp breakpoint**\n\nSize: 33% of column height\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n**Column spacing increase**\n---------------------------\n\nColumn spacing scales past the 225+ Breakpoint, either starting at 2 dp or 4 dp and growing to 6 dp. This depends on which layout you've selected; either 2 or 3 column layouts\n\n**Two column layout** \n**Below the 225 dp breakpoint**\n\n4 dp column gap \n**Above the 225 dp breakpoint**\n\n6 dp column gap\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n### **Three column layout**\n\n**Below the 225 dp breakpoint**\n\n2 dp column gap \n**Above the 225 dp breakpoint**\n\n6 dp column gap\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e"]]
