Android自定義實現(xiàn)一個省份簡稱鍵盤
hello啊各位老鐵，這篇文章我們重新回到Android當中的自定義View，其實最近一直在搞Flutter，初步想法是，把Flutter當中的基礎組件先封裝一遍，然后接著各個工具類，列表，網(wǎng)絡，統(tǒng)統(tǒng)由淺入深的搞一遍，弄完Flutter之后，再逐步的更新Android當中的技術點，回頭一想，還是穿插著來吧，再系統(tǒng)的規(guī)劃，難免也有變化，想到啥就寫啥吧，能夠堅持輸出就行。
今天的這個知識點，是一個自定義View，一個省份的簡稱鍵盤，主要用到的地方，比如車牌輸入等地方，相對來說還是比較的簡單，我們先看下最終的實現(xiàn)效果：
實現(xiàn)方式呢有很多種，我相信大家也有自己的一套實現(xiàn)機制，這里，我采用的是組合View，用的是LinearLayout的方式。
今天的內(nèi)容大致如下：
1、分析UI，如何布局
2、設置屬性和方法，制定可擴展效果
3、部分源碼剖析
4、開源地址及實用總結
一、分析UI，如何布局
拿到UI效果圖后，其實也沒什么好分析的，無非就是兩塊，頂部的完成按鈕和底部的省份簡稱格子，一開始，打算用RecyclerView網(wǎng)格布局來實現(xiàn)，但是最后的刪除按鈕如何擺放就成了問題，直接懸浮在網(wǎng)格上邊，動態(tài)計算位置，顯然不太合適，也沒有這樣去搞的，索性直接拋棄這個方案，多布局的想法也實驗過，但最終還是選擇了最簡單的LinearLayout組合View形式。
所謂簡單，就是在省份簡稱數(shù)組的遍歷中，不斷的給LinearLayout進行追加子View，需要注意的是，本身的View，也就是我們自定義View，繼承LinearLayout后，默認的是垂直方向的，往本身View追加的是橫向屬性的LinearLayout，這也是換行的效果，也就是，一行一個橫向的LinearLayout，記住，橫向屬性的LinearLayout，才是最終添加View的直接父類。
換行的條件就是基于UI效果，當模于設置length等于0時，我們就重新創(chuàng)建一個水平的LinearLayout，這就可以了，是不是非常的簡單。
至于最后的刪除按鈕，使其靠右，占據(jù)兩個格子的權重設置即可。
二、設置屬性和方法，制定可擴展效果
當我們繪制完這個身份簡稱鍵盤后，肯定是要給他人用的，基于靈活多變的需求，那么相對應的我們也需要動態(tài)的進行配置，比如背景顏色，文字的顏色，大小，還有邊距，以及點擊效果等等，這些都是需要外露，讓使用者選擇性使用的，目前所有的屬性如下，大家在使用的時候，也可以對照設置。
設置屬性
| 屬性 | 類型 | 概述 |
|---|---|---|
| lp_background | color | 整體的背景顏色 |
| lp_rect_spacing | dimension | 格子的邊距 |
| lp_rect_height | dimension | 格子的高度 |
| lp_rect_margin_top | dimension | 格子的距離上邊 |
| lp_margin_left_right | dimension | 左右距離 |
| lp_margin_top | dimension | 上邊距離 |
| lp_margin_bottom | dimension | 下邊距離 |
| lp_rect_background | reference | 格子的背景 |
| lp_rect_select_background | reference | 格子選擇后的背景 |
| lp_rect_text_size | dimension | 格子的文字大小 |
| lp_rect_text_color | color | 格子的文字顏色 |
| lp_rect_select_text_color | color | 格子的文字選中顏色 |
| lp_is_show_complete | boolean | 是否顯示完成按鈕 |
| lp_complete_text_size | dimension | 完成按鈕文字大小 |
| lp_complete_text_color | color | 完成按鈕文字顏色 |
| lp_complete_text | string | 完成按鈕文字內(nèi)容 |
| lp_complete_margin_top | dimension | 完成按鈕距離上邊 |
| lp_complete_margin_bottom | dimension | 完成按鈕距離下邊 |
| lp_complete_margin_right | dimension | 完成按鈕距離右邊 |
| lp_text_click_effect | boolean | 是否觸發(fā)點擊效果，true點擊后背景消失，false不消失 |
定義方法
| 方法 | 參數(shù) | 概述 |
|---|---|---|
| keyboardContent | 回調(diào)函數(shù) | 獲取點擊的省份簡稱簡稱信息 |
| keyboardDelete | 函數(shù) | 刪除省份簡稱簡稱信息 |
| keyboardComplete | 回調(diào)函數(shù) | 鍵盤點擊完成 |
| openProhibit | 函數(shù) | 打開禁止（使領學港澳），使其可以點擊 |
三、關鍵源碼剖析
這里只貼出部分的關鍵性代碼，整體的代碼，大家滑到底部查看源碼地址即可。
定義身份簡稱數(shù)組
//省份簡稱數(shù)據(jù)
private val mLicensePlateList = arrayListOf(
"京", "津", "渝", "滬", "冀", "晉", "遼", "吉", "黑", "蘇",
"浙", "皖", "閩", "贛", "魯", "豫", "鄂", "湘", "粵", "瓊",
"川", "貴", "云", "陜", "甘", "青", "蒙", "桂", "寧", "新",
"藏", "使", "領", "學", "港", "澳",
)遍歷省份簡稱
mLength為一行展示多少個，當取模為0時，就需要換行，也就是再次創(chuàng)建一個水平的LinearLayout，添加至外層的垂直LinearLayout中，每個水平的LinearLayout中，則是一個一個的TextView。
//每行對應的省份簡稱
var layout: LinearLayout? = null
//遍歷車牌號
mLicensePlateList.forEachIndexed { index, s ->
if (index % mLength == 0) {
//重新創(chuàng)建，并添加View
layout = createLinearLayout()
layout?.weightSum = 1f
addView(layout)
val params = layout?.layoutParams as LayoutParams
params.apply {
topMargin = mRectMarginTop.toInt()
height = mRectHeight.toInt()
leftMargin = mMarginLeftRight.toInt()
rightMargin = mMarginLeftRight.toInt() - mSpacing.toInt()
layout?.layoutParams = this
}
}
//創(chuàng)建文字視圖
val textView = TextView(context).apply {
text = s
//設置文字的屬性
textSize = px2sp(mRectTextSize)
//最后五個是否禁止
if (mNumProhibit && index > (mLicensePlateList.size - 6)) {
setTextColor(mNumProhibitColor)
mTempTextViewList.add(this)
} else {
setTextColor(mRectTextColor)
}
setBackgroundResource(mRectBackGround)
gravity = Gravity.CENTER
setOnClickListener {
if (mNumProhibit && index > (mLicensePlateList.size - 6)) {
return@setOnClickListener
}
//每個格子的點擊事件
changeTextViewState(this)
}
}
addRectView(textView, layout, 0.1f)
}追加最后一個View
由于最后一個視圖是一個圖片，占據(jù)了兩個格子的大小，所以需要特殊處理，需要做的就是，單獨設置權重weight和單獨設置寬度width，如下所示：
/**
* AUTHOR:AbnerMing
* INTRODUCE:追加最后一個View
*/
private fun addEndView(layout: LinearLayout?) {
val endViewLayout = LinearLayout(context)
endViewLayout.gravity = Gravity.RIGHT
//刪除按鈕
val endView = RelativeLayout(context)
//添加刪除按鈕
val deleteImage = ImageView(context)
deleteImage.setImageResource(R.drawable.view_ic_key_delete)
endView.addView(deleteImage)
val imageParams = deleteImage.layoutParams as RelativeLayout.LayoutParams
imageParams.addRule(RelativeLayout.CENTER_IN_PARENT)
deleteImage.layoutParams = imageParams
endView.setOnClickListener {
//刪除
mKeyboardDelete?.invoke()
invalidate()
}
endView.setBackgroundResource(mRectBackGround)
endViewLayout.addView(endView)
val params = endView.layoutParams as LayoutParams
params.width = (getScreenWidth() / mLength) * 2 - mMarginLeftRight.toInt()
params.height = LayoutParams.MATCH_PARENT
endView.layoutParams = params
layout?.addView(endViewLayout)
val endParams = endViewLayout.layoutParams as LayoutParams
endParams.apply {
width = (mSpacing * 3).toInt()
height = LayoutParams.MATCH_PARENT
weight = 0.4f
rightMargin = mSpacing.toInt()
endViewLayout.layoutParams = this
}
}四、開源地址及使用總結
開源地址：github.com/AbnerMing888/LicensePlateView
關于使用，其實就是一個類，大家可以下載源碼，直接復制即可使用，還可以進行修改里面的代碼，非常的方便，如果懶得下載源碼，沒關系，我也上傳到了遠程Maven，大家可以按照下面的方式進行使用。
Maven具體調(diào)用
1、在你的根項目下的build.gradle文件下，引入maven。
allprojects {
repositories {
maven { url "https://gitee.com/AbnerAndroid/almighty/raw/master" }
}
}2、在你需要使用的Module中build.gradle文件下，引入依賴。
dependencies {
implementation 'com.vip:plate:1.0.0'
}代碼使用
<com.vip.plate.LicensePlateView
android:id="@+id/lp_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:lp_complete_text_size="14sp"
app:lp_margin_left_right="10dp"
app:lp_rect_spacing="6dp"
app:lp_rect_text_size="19sp"
app:lp_text_click_effect="false" />總結
大家在使用的時候，一定對照屬性表進行選擇性使用；關于這個省份簡稱自定義View，實現(xiàn)方式有很多種，我目前的這種也不是最優(yōu)的實現(xiàn)方式，只是自己的一個實現(xiàn)方案，給大家一個作為參考的依據(jù)。
以上就是Android自定義實現(xiàn)一個省份簡稱鍵盤的詳細內(nèi)容，更多關于Android自定義鍵盤的資料請關注腳本之家其它相關文章！
相關文章
Android實現(xiàn)加載狀態(tài)視圖切換效果
這篇文章主要為大家詳細介紹了Android實現(xiàn)加載狀態(tài)視圖切換效果的相關資料，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
這篇文章主要介紹了Android編程繪圖操作之弧形繪制方法,結合實例形式分析了Android圖形繪制的相關組件調(diào)用、屬性設置與功能實現(xiàn)技巧,需要的朋友可以參考下2017-08-08
Android App支付系列（一）：微信支付接入詳細指南(附官方支付demo)
這篇文章主要介紹了Android App支付系列（一）：微信支付接入詳細指南(附官方支付demo) ，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-11-11
Android開發(fā)實現(xiàn)的文本折疊點擊展開功能示例
這篇文章主要介紹了Android開發(fā)實現(xiàn)的文本折疊點擊展開功能,涉及Android界面布局與屬性控制相關操作技巧,需要的朋友可以參考下2019-03-03
詳解Android的OkHttp包編寫異步HTTP請求調(diào)用的方法
OkHttp支持Callback異步回調(diào)來實現(xiàn)線程的非阻塞,下面我們就來詳解Android的OkHttp包編寫異步HTTP請求調(diào)用的方法,需要的朋友可以參考下2016-07-07
本文將詳細介紹Android三種GSM技術比較差別,有感興趣的朋友可以參考下2012-12-12
Android自定義View實現(xiàn)餅狀圖帶動畫效果
這篇文章主要為大家詳細介紹了Android自定義View實現(xiàn)餅狀圖帶動畫效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-12-12
Android編程實現(xiàn)項目中異常捕獲及對應Log日志文件保存功能
這篇文章主要介紹了Android編程實現(xiàn)項目中異常捕獲及對應Log日志文件保存功能,涉及Android異常處理、日志讀寫及權限控制等相關操作技巧,需要的朋友可以參考下2018-02-02
這篇文章主要介紹了Android SD卡上文件操作及記錄日志操作的方法,涉及Android針對SD卡與文件操作的相關技巧,需要的朋友可以參考下2016-01-01
這篇文章主要為大家詳細介紹了Android自定義View手勢密碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-07-07