@龍爪槐守望者 ：鑒于國(guó)內(nèi)交互設(shè)計(jì)名詞混亂不統(tǒng)一，很多設(shè)計(jì)師不知道如何用專業(yè)術(shù)語(yǔ)稱呼一個(gè)控件，因此我開了《這個(gè)控件叫什么》專題，梳理控件的名稱和使用事項(xiàng)，希望能為推動(dòng)交互設(shè)計(jì)發(fā)展，做出一點(diǎn)微小的貢獻(xiàn)。

Soft Keyboard（Virtual Keyboard/軟鍵盤/虛擬鍵盤）并不是真實(shí)的物理鍵盤（Physical Keyboard），而是在屏幕內(nèi)擁有鍵盤樣式和功能的控件，它比真正的鍵盤尺寸更小，而且沒有手感很難盲操作。在觸屏當(dāng)?shù)赖囊苿?dòng)端Soft Keyboard也可以簡(jiǎn)稱為Keyboard。

如何使用

Soft Keyboard具備屏幕內(nèi)的控件的特性——按需隨時(shí)改變樣式和位置。合理的運(yùn)用這一特性可以創(chuàng)造獨(dú)特的優(yōu)勢(shì)。

選擇適當(dāng)?shù)逆I盤類型

在某個(gè)場(chǎng)景下，用戶輸入的內(nèi)容類型往往是有限的，某些鍵盤按鍵可能完全用不到，保留所有按鍵不僅浪費(fèi)移動(dòng)端珍貴的屏幕空間，多余的選擇也降低了用戶輸入的效率。使用恰當(dāng)?shù)逆I盤類型不僅提升輸入體驗(yàn)，而且能增強(qiáng)服務(wù)器提交數(shù)據(jù)的校驗(yàn)安全性。iOS、Android提供多種鍵盤類型布局，常用的鍵盤類型布局有：

1. 默認(rèn)鍵盤：常規(guī)的全鍵盤，不做任何限制。
2. 文本鍵盤：相比默認(rèn)鍵盤取消了表情符號(hào)，適合輸入密碼。
3. 整數(shù)鍵盤：只能輸入數(shù)字0-9。
4. 浮點(diǎn)數(shù)鍵盤：在整數(shù)鍵盤基礎(chǔ)上增加了小數(shù)點(diǎn)。
5. 電話號(hào)碼鍵盤：在數(shù)字鍵盤基礎(chǔ)上增加了“*” 和 “#” 。
6. 郵箱地址鍵盤：在常規(guī)全鍵盤基礎(chǔ)上增加了“@”和“.”。
7. URL鍵盤：輸入網(wǎng)址用的，在常規(guī)全鍵盤上增加或突出“.com”、“.”和“/”等。
8. 數(shù)字和符號(hào)鍵盤：相比數(shù)字鍵盤多了很多標(biāo)點(diǎn)符號(hào)。

△ ?常用的鍵盤類型布局

某種程度上來說，Picker可以被當(dāng)做特殊的鍵盤類型。此外還可以對(duì)鍵盤的：是否首字母大寫、所有字母大寫、單詞自動(dòng)補(bǔ)全等參數(shù)進(jìn)行定制，進(jìn)一步提升效率和體驗(yàn)。

定制動(dòng)作按鍵的功能

鍵盤上除了輸入內(nèi)容的按鍵，還有另外一類功能按鍵。例如在PC端Tab鍵可以在表單內(nèi)的多個(gè)輸入框之間切換，回車鍵可以換行或者發(fā)送內(nèi)容。Soft Keyboard可以對(duì)動(dòng)作鍵的具體功能進(jìn)行定制，常見的定制功能有：

△ ?常見的定制功能

1. 回車（return/enter）：用來?yè)Q行。
2. 搜索（search）：?點(diǎn)擊后執(zhí)行搜索動(dòng)作。
3. 下一項(xiàng)（next）：通常用在在多個(gè)輸入框的表單中切換到下一個(gè)輸入框。
4. 發(fā)送（send）：一般用在通訊App中將內(nèi)容發(fā)送出去。
5. 前往（go）：任務(wù)過程中到下一個(gè)步驟的動(dòng)作，例如輸入網(wǎng)址后，前往打開的網(wǎng)頁(yè)。
6. 完成（done）：任務(wù)完成后終結(jié)動(dòng)作。例如表單提交。

自定義鍵盤

假如用戶使用第三方輸入法就有些悲劇了，第三方的Soft Keyboard不一定完美支持所有鍵盤類型和動(dòng)作按鍵的定制，而且有私自收集數(shù)據(jù)造成隱私泄露的風(fēng)險(xiǎn)。假如對(duì)第三方鍵盤擔(dān)憂，或者對(duì)輸入內(nèi)容的類型有偏好，可以設(shè)計(jì)自定義鍵盤。自定義鍵盤分為App內(nèi)輸入視圖（ Input Views）和系統(tǒng)級(jí)定制鍵盤兩種。

App內(nèi)輸入視圖是私有定制的，只能在所屬的App內(nèi)使用，不可被其他App或者系統(tǒng)使用。典型案例是iPad版Numbers App，不同數(shù)據(jù)類型的表格單元格所對(duì)應(yīng)的輸入視圖也不同，而且還提供簡(jiǎn)單的數(shù)據(jù)運(yùn)算功能。

△ ?iPad版Numbers App

系統(tǒng)級(jí)定制鍵盤可以在系統(tǒng)和所有App全局使用，搜狗、訊飛等第三方輸入法就屬于這種。iOS可通過Soft Keyboard的“地球”icon切換不同的系統(tǒng)級(jí)定制鍵盤。

△ ?切換系統(tǒng)級(jí)定制鍵盤

由國(guó)內(nèi)iOS開發(fā)者鐘穎（微博昵稱 @StackOverflowError）研發(fā)的Pin（https://itunes.apple.com/cn/app/pin-clipboard-extension）提供了一種特殊的系統(tǒng)級(jí)定制鍵盤，通過Pin的鍵盤可以快速粘貼曾經(jīng)的剪貼板記錄甚至同步Mac的剪貼板內(nèi)容，還提供對(duì)剪貼板內(nèi)容執(zhí)行搜索、分詞的功能。

△ ?Pin的鍵盤

不要遮擋當(dāng)前獲得焦點(diǎn)輸入框

在移動(dòng)端，Soft Keyboard約占五分之二的屏幕面積，這意味著Soft Keyboard在喚起前后，界面布局會(huì)產(chǎn)生很大的變化，因此要注意鍵盤喚起后界面元素位置的變化，不要讓鍵盤遮擋當(dāng)前獲取焦點(diǎn)的輸入框，以免用戶看不到自己輸入的內(nèi)容。

相關(guān)資料

網(wǎng)易UEDC對(duì)鍵盤類型和動(dòng)作按鍵的研究和分享

iOS共提供11種鍵盤類型，Android甚至對(duì)鍵盤有多達(dá)29種參數(shù)定制。網(wǎng)易UEDC（用戶體驗(yàn)設(shè)計(jì)中心）對(duì)iOS和Android的鍵盤進(jìn)行了系統(tǒng)的研究，提供詳細(xì)的使用指南和Axure元件庫(kù)分享。請(qǐng)閱讀：

《交互稿中「鍵盤類型」的標(biāo)注》（ http://mp.weixin.qq.com/s/ii7iTwT7B-SmHkC_7bcUbQ ）
《深度基礎(chǔ) | 交互中的Android鍵盤詳解》（http://mp.weixin.qq.com/s/nQx2CpEHCycwyunEgI-m2w ）

iPad拆分鍵盤

移動(dòng)設(shè)備橫屏情況下寬度太大，用戶手指很難觸及到屏幕中線，而且Soft Keyboard會(huì)占用過多的縱向屏幕空間，導(dǎo)致操作和顯示都非常不便。當(dāng)你用兩指同時(shí)向左右拉iPad的軟鍵盤時(shí)，鍵盤就會(huì)被拆分，這樣能提供更多的內(nèi)容顯示面積，操作也變得更順利。

△ ?iPad拆分鍵盤

為什么銀行App要使用亂序鍵位鍵盤

在PC時(shí)代，有木馬病毒通過監(jiān)控物理鍵盤的鍵位來盜取用戶密碼，注重安全的銀行網(wǎng)站將密碼輸入改為軟鍵盤。正所謂道高一尺魔高一丈，新的木馬病毒記錄屏幕鼠標(biāo)點(diǎn)擊位置來推算用戶輸入的內(nèi)容，于是銀行將軟鍵盤升級(jí)為亂序鍵位。

△ ?某銀行App亂序軟鍵盤

銀行將這項(xiàng)安全技術(shù)從網(wǎng)站照搬到了App里，事實(shí)上，在觸屏手機(jī)上使用亂序軟鍵盤意義不大，不僅極大降低了用戶輸入效率，木馬悄悄截屏或者手機(jī)使用者背后有人即可輕易截取密碼。可喜的是陸續(xù)有銀行App采取禁止截圖和使用手勢(shì)密碼或指紋等更快更安全的安全技術(shù)。

大屏手機(jī)的鍵盤單手操作優(yōu)化

現(xiàn)在的手機(jī)屏幕尺寸越來越大，單手操作鍵盤會(huì)非常費(fèi)力，有不少手機(jī)廠商和第三方輸入法致力于改善這個(gè)問題，例如搜狗輸入法單手鍵盤，將鍵盤寬度壓縮至適合單手操作的位置。

△ ?搜狗輸入法單手鍵盤

更為創(chuàng)新的方案是聯(lián)想的水銀鍵盤，當(dāng)手機(jī)向一側(cè)傾斜時(shí)，通過重力感應(yīng)水銀鍵盤的按鍵會(huì)將鍵盤按鈕向傾斜的方向集中，最遠(yuǎn)處的按鈕觸摸區(qū)域更大，拇指可以輕松觸及。

△ ?聯(lián)想水銀鍵盤

往期回顧：

1. 《「這個(gè)控件叫什么」系列之小紅點(diǎn)+索引導(dǎo)航+分段控件》
2. 《「這個(gè)控件叫什么」系列之加載占位圖+頁(yè)面指示器》
3. 《「這個(gè)控件叫什么」系列之步進(jìn)器+SWITCH》
4. 《「這個(gè)控件叫什么」系列之TOAST》
5. 《「這個(gè)控件叫什么」系列之PICKER/選擇器/拾取器》

后面優(yōu)設(shè)會(huì)持續(xù)更新，想提前學(xué)習(xí)的可以關(guān)注作者的微信公眾號(hào)：

【優(yōu)設(shè)網(wǎng) 原創(chuàng)文章 投稿郵箱：yuan@uisdc.com】

================關(guān)于優(yōu)設(shè)網(wǎng)================
"優(yōu)設(shè)網(wǎng)uisdc.com"是國(guó)內(nèi)人氣最高的網(wǎng)頁(yè)設(shè)計(jì)師學(xué)習(xí)平臺(tái)，專注分享網(wǎng)頁(yè)設(shè)計(jì)、無(wú)線端設(shè)計(jì)以及PS教程。
【特色推薦】
設(shè)計(jì)師需要讀的100本書：史上最全的設(shè)計(jì)師圖書導(dǎo)航：http://hao.uisdc.com/book/。
設(shè)計(jì)微博：擁有粉絲量200萬(wàn)的人氣微博@優(yōu)秀網(wǎng)頁(yè)設(shè)計(jì) ，歡迎關(guān)注獲取網(wǎng)頁(yè)設(shè)計(jì)資源、下載頂尖設(shè)計(jì)素材。
設(shè)計(jì)導(dǎo)航：全球頂尖設(shè)計(jì)網(wǎng)站推薦，設(shè)計(jì)師必備導(dǎo)航：http://hao.uisdc.com