Axure Text Field 的11種變化

蛙不說你不知道，今天來介紹一下堪稱 Axure 中，最博大精深的元件...Text Field！

啥，你說 Text Field 不過就是一個輸入框沒什麼好介紹的？那就是你太小看他了，Text Field可是有總共11種變化呢！ （比要你命三千還多一種吶）

如何設定

設定的方式很簡單，拖曳出 Text Field 元件後，在右側的工具列 Widegt Prooerties and Style 中，在 Text Field 的專用設定項目中，Type 欄位選擇即可

Text 文字

這個效果是大家最常看到的（因為是預設值），效果就是點選後可以輸入文字。

Password 密碼

密碼格式也是可以輸入文字，但附帶特殊的效果：

• 會以●隱藏輸入的文字
• 只能輸入半形文字

在手機板中和一般輸入密碼一樣，會以●隱藏輸入的文字，但最後一碼保持明碼

Email

Email格式乍看之下與 Text 沒有不同，但他會做基本的 Email 格式檢查（雖然不太明顯），比如說只輸入ddd，Focus離開之後，再 Mouse over，就會看到錯誤訊息。

目前測試只有2種錯誤提示，一種是未包含"@"，一種是未填寫完整@前後沒有文字；在手機上操作可以召喚出輸入Email專用的鍵盤

Number 數字

只能輸入半形數字，有提供上下箭頭，可以加一減一；在手機上操作可以召喚出輸入數字專用的鍵盤

Phone Number 電話號碼、Url 網址

在電腦版上基本上和Text沒有不同，但手機上可以召喚出專用鍵盤

Search 搜尋

在電腦上輸入文字後，會出現可以清除輸入文字的 X 符號，在手機板上也是可以召喚出專用鍵盤

File 上傳檔案

上傳檔案這個就厲害了，完全看不出來當初是 Text Field 來的，而且點選這個檔案還可以連接到選擇檔案、上傳的流程，簡直太方便了，之前看過有人非常努力地用 Axure 的各種互動產生類似的效果，但這個不但方便使用一鍵設定完成，而且是非常真實的效果！

Date 日期 / Month 月份與 Time 時間

用來輸入日期與時間的格式，各自附帶輸入的效果，從此以後就不用再另外放日曆的圖案啦~

電腦版是小日曆

手機板(iPhone)是滾輪

其他設定欄位

除了最重要的Type欄位之外，還有幾個可以設定的地方提供大家參考：

• Hint Text：
  在開始輸入之前，預設顯示在輸入框中的顯示文字，Hint Text可以設定單獨的格式，比如說設定成灰色之類
• Max Length：
  最多可以輸入的字數，比如說密碼規則是16位的英數字混和，那麼這邊設定16，就可以避免輸入過多的文字
• Hide Border：
  隱藏輸入框，可以用在想要做一些特殊造型的時候
• Read Only：
  選擇了之後 User 就無法輸入/修改文字，只能看
• Disable：
  選擇了之後，底色就會反灰，無法編輯
• Submit Button：
  看了英文版的說明，如果你有設定 Submit Button，那麼當 User 在輸入完畢後，直接按 Enter 鍵，就會直接觸發那個 Submit Button，等同於用滑鼠點選那個按鈕

~那今天就這樣囉，大家來這裡玩玩看吧~