Android自定義軟鍵盤(pán)的步驟記錄
效果圖
還是咱們的老規(guī)矩,先放最終效果圖 😄😄😄

實(shí)現(xiàn)自定義軟鍵盤(pán)
需要實(shí)現(xiàn)一個(gè)軟鍵盤(pán)很簡(jiǎn)單,只需要很簡(jiǎn)單的3步
1、通過(guò)xml文件,定義出來(lái)鍵盤(pán)結(jié)構(gòu)
2、將定義好的鍵盤(pán)結(jié)構(gòu)與KeyboardView綁定起來(lái)
3、實(shí)現(xiàn)onKey方法,處理輸入和操作事件
1、通過(guò)xml定義鍵盤(pán)
在res下面定義一個(gè)xml文件夾,并創(chuàng)建你的軟鍵盤(pán)布局xml文件
這邊需要根據(jù)自己的每一個(gè)key對(duì)應(yīng)的比例計(jì)算出來(lái)大小,%p就是占整個(gè)的百分比,要注意間隔距離。
<?xml version="1.0" encoding="utf-8"?>
<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
android:horizontalGap="1%p"
android:keyWidth="10%p"
android:keyHeight="50dp"
android:verticalGap="1%p">
<Row>
<Key
android:codes="81"<!--最終展示內(nèi)容的unicode-->
android:horizontalGap="1%p"<!--橫向間隔比率-->
android:keyWidth="8.9%p"<!--鍵位寬度比率-->
android:keyEdgeFlags="left"<!--鍵盤(pán)間隔對(duì)其方式-->
android:keyLabel="Q" <!--鍵盤(pán)上展示的文案--> />
<Key
android:codes="87"
android:keyWidth="8.9%p"
android:keyLabel="W" />
<Key
android:codes="69"
android:keyWidth="8.9%p"
android:keyLabel="E" />
<Key
android:codes="82"
android:keyWidth="8.9%p"
android:keyLabel="R" />
<Key
android:codes="84"
android:keyWidth="8.9%p"
android:keyLabel="T" />
<Key
android:codes="89"
android:keyWidth="8.9%p"
android:keyLabel="Y" />
<Key
android:codes="85"
android:keyWidth="8.9%p"
android:keyLabel="U" />
<Key
android:codes="73"
android:keyWidth="8.9%p"
android:keyLabel="I" />
<Key
android:codes="79"
android:keyWidth="8.9%p"
android:keyLabel="O" />
<Key
android:codes="80"
android:keyWidth="8.9%p"
android:keyEdgeFlags="right"
android:keyLabel="P" />
</Row>
<Row>
<Key
android:codes="65"
android:horizontalGap="5.5%p"
android:keyWidth="9%p"
android:keyEdgeFlags="left"
android:keyLabel="A" />
<Key
android:codes="83"
android:keyWidth="9%p"
android:keyLabel="S" />
<Key
android:codes="68"
android:keyWidth="9%p"
android:keyLabel="D" />
<Key
android:codes="70"
android:keyWidth="9%p"
android:keyLabel="F" />
<Key
android:codes="71"
android:keyWidth="9%p"
android:keyLabel="G" />
<Key
android:codes="72"
android:keyWidth="9%p"
android:keyLabel="H" />
<Key
android:codes="74"
android:keyWidth="9%p"
android:keyLabel="J" />
<Key
android:codes="75"
android:keyWidth="9%p"
android:keyLabel="K" />
<Key
android:codes="76"
android:keyWidth="9%p"
android:keyEdgeFlags="left"
android:keyLabel="L" />
</Row>
<Row>
<Key
android:codes="-1005"
android:keyWidth="13.5%p"
android:keyEdgeFlags="left"
android:keyLabel="中" />
<Key
android:codes="90"
android:keyWidth="9%p"
android:keyLabel="Z" />
<Key
android:codes="88"
android:keyWidth="9%p"
android:keyLabel="X" />
<Key
android:codes="67"
android:keyWidth="9%p"
android:keyLabel="C" />
<Key
android:codes="86"
android:keyWidth="9%p"
android:keyLabel="V" />
<Key
android:codes="66"
android:keyWidth="9%p"
android:keyLabel="B" />
<Key
android:codes="78"
android:keyWidth="9%p"
android:keyLabel="N" />
<Key
android:codes="77"
android:keyWidth="9%p"
android:keyLabel="M" />
<Key
android:codes="-5"
android:isRepeatable="true"
android:keyWidth="13.5%p" />
</Row>
<Row>
<Key
android:codes="-1004"
android:keyWidth="24%p"
android:keyEdgeFlags="left"
android:keyLabel="123" />
<Key
android:codes="32"
android:keyWidth="48%p"
android:keyLabel="space" />
<Key
android:codes="-1003"
android:keyWidth="24%p"
android:keyEdgeFlags="right"
android:keyLabel="確定" />
</Row>
</Keyboard>
2、將xml文件與keyboardview綁定起來(lái)
創(chuàng)建出來(lái)的keyboard文件是要與keyboard類(lèi)結(jié)合起來(lái)使用的。
WordKeyboard = new Keyboard(context, R.xml.stock_word_keyboard);
實(shí)現(xiàn)自己的keyboardview,繼承自KeyboardView。
public class MyKeyboardView extends KeyboardView {
...
init{
WordKeyboard = new Keyboard(context, R.xml.stock_word_keyboard);
//將你的keyboard與keyboardview綁定起來(lái)
this.setKeyboard(WordKeyboard);
}
我們真實(shí)需要添加到布局中的view實(shí)際上就是自定義的MyKeyboardView ,它的使用和其他自定義view沒(méi)有任何區(qū)別。
3、處理點(diǎn)擊事件onKey
如果你完成了上面兩步,并將view添加到布局中,你會(huì)發(fā)現(xiàn)已經(jīng)可以展示出來(lái)了。但是點(diǎn)擊并沒(méi)有任何效果。
如果想要出效果,就需要實(shí)現(xiàn)onkey進(jìn)行處理。
KeyboardView.this.setOnKeyboardActionListener(new OnKeyboardActionListener() {
@Override
public void onKey(int primaryCode, int[] keyCodes) {
try {
Editable editable = editText.getText();
int start = editText.getSelectionStart();
int end = editText.getSelectionEnd();
String code = String.valueOf(primaryCode);
switch (code) {
//切換到數(shù)字鍵盤(pán)
case KeyboardKeyMap.TOOL_SWITCH_TO_NUM:
onKeyboardCallback.switchToNumberKeyboard();
break;
//切換到系統(tǒng)鍵盤(pán)
case KeyboardKeyMap.TOOL_SWITCH_TO_WORD:
onKeyboardCallback.switchToSystemKeyboard();
break;
//隱藏鍵盤(pán)
case KeyboardKeyMap.TOOL_HIDE:
onKeyboardCallback.onHideStockKeyboard();
break;
//刪除
case KeyboardKeyMap.TOOL_DEL:
if (editable != null && editable.length() > 0) {
if (start == end) {
editable.delete(start - 1, start);
} else {
editable.delete(start, end);
}
}
break;
//清空輸入
case KeyboardKeyMap.TOOL_CLEAR:
if (editable != null) {
editable.clear();
}
break;
//確認(rèn)按鈕
case KeyboardKeyMap.TOOL_CONFIRM:
onKeyboardCallback.onConfirmStockKeyboard();
break;
default:
//正常輸入
if (editable != null) {
if (KeyboardKeyMap.isStockPrefix(code)) {
//這里處理更加特殊的輸入定義,
//比如你需要輸入城市簡(jiǎn)稱(chēng)等(車(chē)牌自定義鍵盤(pán)需要)
String resultCode = KeyboardKeyMap.findInputByKey(code);
editable.replace(start, end, resultCode);
} else {
//這里如果是正常的鍵位(排除確認(rèn)、清空、切換等功能鍵位),
//則將鍵位上的unicode轉(zhuǎn)換為正常的數(shù)字,比如定義鍵盤(pán)P對(duì)應(yīng)的
//unicode是80,因?yàn)閤ml定義鍵位的時(shí)候?yàn)榱朔奖闫ヅ?,所以?
//是使用的unicode,這邊則會(huì)將80轉(zhuǎn)換為真正要輸入的P字母。
String resultCode = Character.toString((char) primaryCode);
editable.replace(start, end, resultCode);
}
}
break;
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
到這里,基本的自定義鍵盤(pán)定義操作就完成了。當(dāng)然如果你是工作使用,并沒(méi)有結(jié)束,因?yàn)橐话闱闆r下自定義鍵盤(pán)需要和系統(tǒng)鍵盤(pán)并存,因此你還需要處理鍵盤(pán)切換的閃動(dòng)問(wèn)題。對(duì)于鍵盤(pán)切換控制,我這里就不過(guò)多介紹了,可以自行查閱軟鍵盤(pán)+表情切換,處理方案目前已經(jīng)很成熟了。原理是一樣的。
附贈(zèng)一些實(shí)用的效果處理
1、點(diǎn)擊空白處,關(guān)閉軟鍵盤(pán),如果有內(nèi)容,出發(fā)內(nèi)容點(diǎn)擊,并關(guān)系軟鍵盤(pán),如果是滑動(dòng),則只關(guān)閉軟鍵盤(pán)
效果實(shí)現(xiàn)太簡(jiǎn)單了,這里不做過(guò)多說(shuō)明,理解事件分發(fā)自然懂。
class AutoHideKeyboardCstLayout @JvmOverloads constructor(
context: Context, attrs: AttributeSet? = null
) : ConstraintLayout(context, attrs) {
var keyboardHideListener: (() -> Unit)? = null
override fun onInterceptTouchEvent(ev: MotionEvent?): Boolean {
if (ev?.action == MotionEvent.ACTION_DOWN) {
keyboardHideListener?.invoke()
}
return super.onInterceptTouchEvent(ev)
}
}
關(guān)閉操作只需要在回調(diào)方法執(zhí)行即可。
contentHideKeyboardCstLayout.keyboardHideListener = {
hidePanelAndKeyboard()
}
2、切換軟鍵盤(pán)panel,很簡(jiǎn)單的實(shí)現(xiàn)
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="@android:color/white"
android:elevation="0.5dp">
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/tvStockNumKeyboard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="10dp"
android:button="@null"
android:padding="6dp"
android:text="123"
android:textColor="@drawable/stock_switch_label_color"
android:textSize="16dp"
android:textStyle="bold" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/tvStockWordKeyboard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="18dp"
android:layout_toEndOf="@+id/tvStockNumKeyboard"
android:button="@null"
android:padding="6dp"
android:text="ABC"
android:textColor="@drawable/stock_switch_label_color"
android:textSize="16dp"
android:textStyle="bold" />
<androidx.appcompat.widget.AppCompatTextView
android:id="@+id/tvSystemKeyboard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginStart="18dp"
android:layout_toEndOf="@+id/tvStockWordKeyboard"
android:button="@null"
android:padding="6dp"
android:text="中文"
android:textColor="@drawable/stock_switch_label_color"
android:textSize="16dp"
android:textStyle="bold" />
<FrameLayout
android:id="@+id/keyboardDone"
android:layout_width="60sp"
android:layout_height="match_parent"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true">
<ImageView
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_gravity="center"
android:contentDescription="@null"
android:scaleType="centerInside"
android:src="@drawable/keyboard_done_"
android:textColor="@color/white"
android:textSize="16sp" />
</FrameLayout>
<View
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:background="#EEEEEE" />
</RelativeLayout>
顏色切換selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="#F14400" android:state_selected="true" />
<item android:color="#334455" android:state_selected="false" />
</selector>
class KeyboardSwitcher @JvmOverloads constructor(
context: Context, attrs: AttributeSet? = null
) : RelativeLayout(context, attrs) {
private var mViewBinding: RtcKeyboardSwitcherBinding? = null
private var mStockKeyboardView: StockKeyboardView? = null
init {
mViewBinding = RtcKeyboardSwitcherBinding.inflate(LayoutInflater.from(context), this, true)
}
fun pressNumberKeyboard() {
mViewBinding?.tvStockNumKeyboard?.performClick()
}
fun pressWordKeyboard() {
mViewBinding?.tvStockWordKeyboard?.performClick()
}
fun pressSystemKeyboard() {
mViewBinding?.tvSystemKeyboard?.performClick()
}
fun switchKeyboard(
_switchKeyboard: (isSystemKeyboard: Boolean) -> Unit,
_keyboardDone: () -> Unit
) {
mViewBinding?.apply {
tvStockNumKeyboard.setOnClickListener {
resetSelectedState()
_switchKeyboard.invoke(false)
mStockKeyboardView?.showNumberKeyboard()
it.isSelected = true
}
tvStockWordKeyboard.setOnClickListener {
resetSelectedState()
_switchKeyboard.invoke(false)
mStockKeyboardView?.showWordKeyboard()
it.isSelected = true
}
tvSystemKeyboard.setOnClickListener {
resetSelectedState()
_switchKeyboard.invoke(true)
it.isSelected = true
}
keyboardDone.setOnClickListener {
_keyboardDone.invoke()
}
}
}
fun setDefaultKeyboard(index: Int) {
resetSelectedState()
mViewBinding?.apply {
when (index) {
0 -> {
tvStockNumKeyboard.isSelected = true
}
1 -> {
tvStockWordKeyboard.isSelected = true
}
2 -> {
tvSystemKeyboard.isSelected = true
}
}
}
}
private fun resetSelectedState() {
mViewBinding?.apply {
tvStockNumKeyboard.isSelected = false
tvStockWordKeyboard.isSelected = false
tvSystemKeyboard.isSelected = false
}
}
override fun onTouchEvent(event: MotionEvent?): Boolean {
if (event?.action == MotionEvent.ACTION_DOWN) {
performClick()
}
return true
}
override fun performClick(): Boolean {
return super.performClick()
}
fun attach(stockKeyboardView: StockKeyboardView) {
this.mStockKeyboardView = stockKeyboardView
}
fun showNumberKeyboard() {
this.mStockKeyboardView?.showNumberKeyboard()
}
}
總結(jié)
到此這篇關(guān)于Android自定義軟鍵盤(pán)的文章就介紹到這了,更多相關(guān)Android自定義軟鍵盤(pán)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Android積分簽到上移消失動(dòng)畫(huà)效果
這篇文章主要介紹了Android積分簽到上移消失動(dòng)畫(huà)效果大致思路:動(dòng)畫(huà)部分,由一個(gè)垂直的平移和一個(gè)透明度變化的兩個(gè)動(dòng)畫(huà)組成。然后通過(guò)AnimationSet將兩個(gè)動(dòng)畫(huà)添加到集合,然后開(kāi)始播放動(dòng)畫(huà)。2018-05-05
AndroidStudio項(xiàng)目制作倒計(jì)時(shí)模塊的方法
本篇文章主要介紹了AndroidStudio項(xiàng)目制作倒計(jì)時(shí)模塊的方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-04-04
ImageView點(diǎn)擊可變暗的實(shí)例代碼(android代碼技巧)
本文給大家分享一段實(shí)例代碼給大家介紹ImageView點(diǎn)擊可變暗的實(shí)例代碼,非常不錯(cuò),具有參考借鑒價(jià)值,需要的的朋友參考下吧2017-02-02
詳解MVP模式在Android開(kāi)發(fā)中的應(yīng)用
MVP是MVC衍生而來(lái)的,很早以前就由某軟公司提出,近年來(lái)在Android應(yīng)用開(kāi)發(fā)中越來(lái)越多的被提及,越來(lái)越重要了。這篇文章主要介紹了詳解MVP模式在Android開(kāi)發(fā)中的應(yīng)用,有興趣的可以了解一下。2016-11-11
android圖像繪制(三)畫(huà)布刷屏問(wèn)題記錄
在canvas中繪制動(dòng)態(tài)圖的時(shí)候,如果使用了一個(gè)固定的背景圖片,只有一個(gè)小小的精靈在移動(dòng)!這樣的情況下卻不得不在沒(méi)幀中重新繪制背景圖片,使得效率降低,本文章只是記錄一下,并不是解決方法感興趣的朋友可以了解下2013-01-01
Android使用Gallery實(shí)現(xiàn)照片拖動(dòng)的特效
這篇文章主要介紹了Android如何使用Gallery實(shí)現(xiàn)照片拖動(dòng)的特效,幫助大家更好的理解和利用Android進(jìn)行開(kāi)發(fā),感興趣的朋友可以了解下2021-01-01
Kotlin類(lèi)與屬性及構(gòu)造函數(shù)的使用詳解
這篇文章主要介紹了Kotlin語(yǔ)言中類(lèi)與屬性及構(gòu)造函數(shù)的使用,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-09-09
Android源碼導(dǎo)入AndroidStudio或IntelliJ?IDEA的方法
這篇文章主要介紹了Android源碼導(dǎo)入AndroidStudio或IntelliJ?IDEA的方法,用idegen來(lái)生成針對(duì)AndroidStudio或IntelliJ?IDEA的Android系統(tǒng)源代碼工程配置文件,需要的朋友可以參考下2022-08-08

