用戶在和小程序的應用交互的過程中，經常需要輸入、編輯、刪除某些信息。多樣化且有針對性的輸入組件可以幫助用戶快速明確的完成任務，提升產品的用戶體驗。

一、Button按鈕

按鈕用於開始一個即時操作，提交表單中的一組輸入數據。

定義&原則

按鈕作爲頁面中的主要行動點，引導用戶進行相應的主要操作。行動按鈕應該醒目突出，有吸引用戶點擊的衝動，並且在用戶進行相應的點擊操作後有相應的反饋。

主按鈕：一個頁面中只能出現一個主按鈕，表示當前最主要的用戶轉化點。

次按鈕：一個頁面中可以有多個次按鈕，作爲當前場景的補充操作。

輔助按鈕：位於列表右側的操作按鈕，通過按鈕的形式更強烈的引導用戶點擊列表。

二、Checkbox多選框

多選控件讓用戶可以同時選擇多個元素。

定義&原則

多選控件一般出現在需要編輯的列表中，當用戶選擇完成以後統一對選中的元素進行編輯處理。多選分爲選中和未選中兩種狀態。

三、InputItem文本輸入框

最簡單的輸入組件就是文本輸入框，它允許用戶通過鍵盤、選擇器等組件錄入單行的數據。

定義&原則

單行輸入框都有信息輸入長度的限制，通常最多15個字符。你還可以有針對性的限制輸入框可輸入的信息類型，如，中文、英文、數字、郵箱地址等；

激活不同類型的輸入框的同時，需要彈出相應類型的鍵盤：文字鍵盤、英文鍵盤、數字鍵盤、郵箱鍵盤等；這樣有利於提高用戶的輸入效率。

輸入框一般有“標籤區”、“輸入區”、“輔助操作區”三個部分組成。“標籤區”有字數限制，最多4個字；“輸入區”一般會設置“暗提示”；“輔助操作區”可以放輔助輸入的操作按鈕，或者更詳細的輸入說明按鈕。

如果輸入的數據內容爲敏感信息，應該進行脫敏處理，如：密碼、手機號等。

四、Picker選擇器

選擇器提供一組預設的數據，讓用戶通過選擇完成輸入或者設置。

定義&原則

通過點擊頁面中的某個輸入框會觸發選擇器，選擇器出現的時候應該在頁面上蓋上一層半透明的蒙層，讓用戶聚焦到選擇器的選擇上。

選擇器中的數據最好是有一定邏輯關係的，符合用戶預期的。因爲選擇中可能一下子不能展示全部數據，需要用戶滑動選擇，符合用戶預期的邏輯順序能幫助用戶快速找到想要的選型。

選擇器可以設置多列數據的組合選擇，一列、兩列、三列，最多四列，但是最長列的文字不能超過寬度限制。

五、日期選擇器

時間選擇器可以讓用戶快速選擇某個時間，從年、月、日到小時、分鐘、秒，都可以設置。

六、Radio單選框

單選控件讓用戶選擇一個元素。

定義&原則

單選控件一般出現在列表的右側，出現一個對勾表示當前選中的選項。

七、Searchbar搜索欄

搜索欄讓用戶可以在大量的信息中快速找到自己想要的內容。

定義&原則

搜索欄一般位於NavBar下方，點擊激活的時候喚起系統鍵盤，通過『取消』按鈕退出激活狀態。

如果默認展示輸入框，可以提供暗提示文案，幫助用戶輸入，如：關鍵詞、搜索美食。

在搜索欄下方，可提供有用的標籤文案，幫助用戶通過點擊直接完成輸入，如：最近搜索的內容。

八、Switch滑動開關

開關是將兩種狀態可視化表達的一種控件。

定義&原則

開關控件只能在列表中使用，所以開關只能在列表中出現；用來表示兩個互斥的選項。

（信息來源參考：螞蟻金服開放平臺）