日期選擇控件（選擇器）是讓用戶在應用中選擇（填入）日期或時間的一類控件，尤其是在B端產品中非常常見。這個控件看似簡單，但它的易用性也容易被忽略。碰到需要這個功能時，很多開發者（當然也包括設計師）立即會說，“網上有那么多酷炫的選擇器，而且都是開源的，我們找一個合適的就行了，我們沒有必要為這個浪費時間……”但是，一切并沒有那么簡單。大多開源的選擇器，要么丑陋不堪（大多源自好幾年前的xp時代設計風格），要么異常難用（很多都是來源于后臺公工具類應用，通用但遠遠不夠好用）；當然，還有一些選擇器看似很酷且富有個性，但往往與我們產品的規范格格不入。

我并不是強調每次我們都要重新“造輪子”，只是想說，日期選擇器的設計，同樣要考慮很多的易用性問題。無論是選擇已有開源控件或是在其基礎上改進，亦或是完全重新設計一個酷炫的個性化樣式，在易用性上有一些原則和建議，可以幫助我們創造更好的產品使用體驗。

?1、默認選中項：應該有一個合適的默認值

并不是所有的控件默認值都是今天或當前時間的。應該根據字段的類型來確定一個合理的默認時間，這樣可以方便用戶快速錄入，或者減少點擊次數。比如，一個toB的協同工具的待辦事項功能，而根據我們的場景，創建這些事項通常是要求在工作日最后一天完成，那么，我們可以讓默認值為當前周的周五；而一個錄入用戶生日的控件，默認字段需要根據用戶群大概年齡，來給一個合理的中間值，比如你的產品核心用戶群為20-30歲的，那么默認時間最好設為1990-01-01……想象一下，如果這里的默認時間是當前日期（很多糟糕的設計都是這樣做的），那么幾乎所有的用戶都要點擊很多次才能找到自己要選的選項。這個原則雖然簡單，但是很容易被忽略。

2、控制可選/錄入的字段范圍

為了減少用戶出錯，保證產品數據的正常顯示，日期/時間控件應當要控制可選的范圍。常見的有兩種控制方法，一是在選擇時將不可選的日期置灰；二是選擇后進行校驗，若不符合要求，則不能錄入并告知用戶（一般是toast提示）。第一種方法是將校驗放在了用戶選擇之前，能夠杜絕用戶輸入錯誤的數據，且無需考慮出錯的交互設計；第二種同樣能達到限制輸入的目的，但需額外的校驗和設計（toast提示或彈窗），但我認為這種提示是必要的，因為告訴用戶為什么有的選項不能選，可以減少用戶的疑惑。

3、清晰明確的提交或確定按鈕

我見過很多非常糟糕的日期控件，在你選擇或切換選項后，還需要點擊輸入框或者空白處，才能填入/顯示已選擇的項目。特別是那種選擇日期和設置時間結合的控件，如果沒有比較明確的提交和確定按鈕，用戶會非常緊張和不知所措：“我已經選擇完了，要怎樣提交呢？”當然你會說，點擊選擇器以外的空白區就可以退出（實際上很多都是這樣做的），但這并不能給用戶直觀的暗示，而且需要一定的認知成本。對于那種只需要點選日期的情況，在點擊時就自動寫入已選項并自動關閉控件，是一種比較合理的做法。

最好有個明顯的“確定”按鈕

沒有明確的“確定”按鈕，用戶會感到困惑

4、減少點擊次數

要錄入一個日期區間，意味著用戶要錄入兩個日期。很多設計師就會下意識的使用兩個日期選擇器，其實是完全沒有必要的。首先一個日期選擇器完全可以完成日期段的錄入，而且多一個日期選擇器會增加用戶的點擊次數。

將兩個控價合并，是一種比較明智的選擇

當然，如果你使用了統一的控件，又不想去設計新的控件，還有一種替代的方案：當在第一個控件中選擇日期后，自動聚焦到第二個輸入框，并彈出選擇器。這樣同樣可以減少點擊次數；但如果用戶如果只是想修改其中某個時間，那么自動彈出另一個會讓用戶感到困惑和多余。

5、標識出特定日期

用戶并非總是“記憶”在選擇器中顯示或標注例如當天、已選默認值、周末、節假日等特殊的日期，可以幫助用戶更好、更快地做出選擇。例如，在選擇購買火車票日期時，標識出春節的七天，可以幫助很多用戶快速選擇出發和回城的日期，畢竟不是所有人都能很快反應過來，除夕是幾月幾號，初七又是幾號？這樣可以減少用戶的記憶和判斷成本，幫助用戶快速做出選擇，同時可以避免用戶犯錯。

6、特殊的操作按鈕

對于一些通過填入日期或時間來篩選數據的選擇器，有必要在選擇器中加上如“清空”的按鈕，允許用戶快速清除已選項，回到數據的初始狀態。一些錄入型的選擇器，也會加上類似“清除”的按鈕，方便用戶快速清除已填入的選項，或重新選擇。還有一些選擇器，會加上“今日”、“當月”、“本季度”等快速選擇按鈕，這對于某些特定的夜晚場景，可以有效幫助用戶快速選擇常用的選項，提高操作效率。

寫在最后

日期選擇器這類常用的交互控件，往往很容易被我們忽略。而正是這些常用元素的設計，才能體現產品的專注和用心程度。于細微處的恰當設計，往往能給用戶帶來可用性和情感上的愉悅，我想這就是設計的重要目標之一吧。