picker選擇器設(shè)計(jì)(一)

picker選擇器設(shè)計(jì)要點(diǎn)如下：基礎(chǔ)形式：iOS：通常以滾輪選擇器的形式出現(xiàn)。Android：常見(jiàn)于Dialog或下拉菜單形式。功能分類(lèi)：data picker：日期選擇器。time picker：時(shí)間選擇器。datetime picker：時(shí)間日期選擇器。時(shí)間范圍選擇：日、周、月、年等選項(xiàng)?；A(chǔ)下拉菜單設(shè)計(jì)：?jiǎn)芜x：每個(gè)選項(xiàng)互斥，選擇清晰。

picker（選擇器）是提供多個(gè)選項(xiàng)的控件，其在不同平臺(tái)上的表現(xiàn)形式各異。iOS端常使用滾輪選擇器，而Android端則傾向于以對(duì)話(huà)框或下拉菜單形式展現(xiàn)。picker根據(jù)功能分為數(shù)據(jù)選擇器、時(shí)間選擇器、日期時(shí)間選擇器，根據(jù)不同時(shí)間維度，進(jìn)一步分為日、周、月、年、多日、時(shí)間范圍等。

pickerContent： pickerContents[0]， list： hours}）；const minutePicker = new Picker（{ pickerColumn： pickerColumns[1]， pickerContent： pickerContents[1]， list： minutes}）；Demo：jsdemo.codeman.top/html/picker至此，一個(gè)簡(jiǎn)單的picker選擇器就實(shí)現(xiàn)了。

今天，我們將探索 NutUI Picker 組件的設(shè)計(jì)與實(shí)現(xiàn)，這個(gè)組件是一個(gè)用于展示一值的拾取器組件，允許用戶(hù)通過(guò)滾動(dòng)選擇中的某一項(xiàng)，同時(shí)支持多個(gè)值的獨(dú)立選擇。首先，讓我們通過(guò)一張示意圖來(lái)直觀了解它的功能。

普通選擇器 普通選擇器適用于簡(jiǎn)單的下拉選擇場(chǎng)景。例如，我們可以使用它來(lái)實(shí)現(xiàn)選擇。