Android自定义一个车牌字母选择键盘

简介: 和省份简称键盘不同的是,数据源上和边距有所差别之外,其他的实现方式均是一样的,采用外部垂直LinearLayout,内部多个横向的LinearLayout的搭配方式。

在一般和车相关的应用,难免会和车牌打交道,组成车牌的要素,国内无非就是省份简称+地区代码+英文或者数字组成,比如京A12345,在需要输入车牌的功能上,就需要有省份简称键盘和英文数字键盘了,在上篇的文章《Android自定义一个省份简称键盘》,总结了省份简称键盘的实现,本篇我们继续完成英文和数字键盘的实现。


今天的内容大致如下:


1、最终实现效果及简单分析

2、设置属性,制定可扩展效果

3、部分源码剖析

4、开源地址及使用总结

一、最终实现效果及简单分析



以上就是本篇文章最终要实现的效果,和省份简称键盘不同的是,数据源上和边距有所差别之外,其他的实现方式均是一样的,采用外部垂直LinearLayout,内部多个横向的LinearLayout的搭配方式。


需要注意的是,英文和数字键盘,默认状态下,顶部的数字是禁止的,也就是输入完地区代码之后,数字的禁止状态才会释放;由于距离左右的边距不同,其在数据源的判断上也会有不同,这个也是需要注意的。


二、设置属性,制定可扩展效果


其相关属性和上篇的省份键盘基本上没有太大的出入,主要就是动态化设置,设置一些,文字的背景,大小,颜色以及格子之间的编辑等,大概罗列了以下属性:


属性

类型

概述

ek_background

color

整体的背景颜色

ek_rect_spacing

dimension

格子的边距

ek_rect_height

dimension

格子的高度

ek_rect_margin_top

dimension

格子的距离上边

ek_margin_left_right

dimension

左右距离

ek_margin_top

dimension

上边距离

ek_margin_bottom

dimension

下边距离

ek_rect_background

reference

格子的背景

ek_rect_select_background

reference

格子选择后的背景

ek_rect_text_size

dimension

格子的文字大小

ek_rect_text_color

color

格子的文字颜色

ek_rect_select_text_color

color

格子的文字选中颜色

ek_is_show_complete

boolean

是否显示完成按钮

ek_complete_text_size

dimension

完成按钮文字大小

ek_complete_text_color

color

完成按钮文字颜色

ek_complete_text

string

完成按钮文字内容

ek_complete_margin_top

dimension

完成按钮距离上边

ek_complete_margin_bottom

dimension

完成按钮距离下边

ek_complete_margin_right

dimension

完成按钮距离右边

ek_other_lines_margin

dimension

其他行边距

ek_is_num_prohibit

boolean

数字是否禁止

ek_text_prohibit_color

color

数字禁止颜色

ek_text_click_effect

boolean

是否触发点击效果,true点击后背景消失,false不消失


设置回调函数


方法

概述

keyboardContent

获取点击的省份简称简称信息

keyboardDelete

删除省份简称简称信息

keyboardComplete

键盘点击完成

openProhibit

打开禁止(使领学港澳),使其可以点击

三、部分源码剖析


这里只贴出部分的关键性代码,整体的代码,大家滑到底部查看源码地址即可。


定义字母和数字数组


privatevalmEnglishList=arrayListOf(
"1", "2", "3", "4", "5", "6", "7", "8", "9", "0",
"Q", "W", "E", "R", "T", "Y", "U", "O", "P",
"A", "S", "D", "F", "G", "H", "J", "K", "L",
"Z", "X", "C", "V", "B", "N", "M"    )


定义遍历数字和字母


由于在数据源上使用的是同一个,那么需要做截取分别进行遍历,便于控制左右的边距和本身的格子大小。


//遍历数字eachData(mEnglishList.subList(0, 10), mLength, true)
//遍历字母eachData(mEnglishList.subList(10, mEnglishList.size), mLength-1, false)
//追加最后一个删除按钮View,动态计算宽度addEndView(mLineLayout)


遍历数据


遍历数据的逻辑和上篇保持一致,当和定义的长度取模为0时,就需要换行,换行就是重新创建一个水平的LinearLayout,添加至垂直的LinearLayout之中,需要做判断的是,左右的边距。


/*** AUTHOR:AbnerMing* INTRODUCE:遍历数据*/privatefuneachData(
list: List<String>,
len: Int,
isNumber: Boolean=false    ) {
list.forEachIndexed { index, s->if (index%len==0) {
//重新创建,并添加ViewmLineLayout=createLinearLayout()
mLineLayout?.weightSum=len.toFloat()
addView(mLineLayout)
valparams=mLineLayout?.layoutParamsasLayoutParamsparams.apply {
topMargin=mRectMarginTop.toInt()
height=mRectHeight.toInt()
if (isNumber) {
//是数字leftMargin=mMarginLeftRight.toInt()
rightMargin=mMarginLeftRight.toInt() -mSpacing.toInt()
                    } else {
//是字母leftMargin=mOtherLinesMargin.toInt()
rightMargin=mOtherLinesMargin.toInt() -mSpacing.toInt()
                    }
mLineLayout?.layoutParams=this                }
            }
//创建文字视图valtextView=TextView(context).apply {
text=s//设置文字的属性textSize=px2sp(mRectTextSize)
//禁止if (isNumber) {
//是数字if (mNumProhibit) {
setTextColor(mRectTextColor)
                    } else {
setTextColor(mNumProhibitColor)
                    }
                } else {
setTextColor(mRectTextColor)
                }
setBackgroundResource(mRectBackGround)
gravity=Gravity.CENTERsetOnClickListener {
//每个格子的点击事件if (isNumber&&!mNumProhibit) {
//如果是数字,根据规则暂时不触发点击return@setOnClickListener                    }
changeTextViewState(this)
                }
            }
//是数字if (isNumber) {
mTempTextViewList.add(textView)
            }
addRectView(textView, mLineLayout, 1f)
        }
    }


添加视图

设置每个格子的宽高和权重。


/*** AUTHOR:AbnerMing* INTRODUCE:追加视图*/privatefunaddRectView(view: View, layout: LinearLayout?, w: Float) {
layout?.addView(view)
valtextParams=view.layoutParamsasLayoutParamstextParams.apply {
weight=wwidth=0height=LayoutParams.MATCH_PARENT//每行的最后一个rightMargin=mSpacing.toInt()
view.layoutParams=this        }
    }

至于最后一个删除按钮,也需要动态的计算其本身的宽高,基本上和上篇一致,就不过多赘述了。


四、开源地址及使用总结

开源地址:https://github.com/AbnerMing888/EnglishKeyboardView

关于如何使用,有两种方式,一种是下载源码,直接把源码复制出来,二是可以使用以下的远程Maven依赖方式。


Maven具体调用

1、在你的根项目下的build.gradle文件下,引入maven。


allprojects {
repositories {
maven { url"https://gitee.com/AbnerAndroid/almighty/raw/master" }
    }
}


2、在你需要使用的Module中build.gradle文件下,引入依赖。


dependencies {
implementation'com.vip:board:1.0.0'}


代码使用


<com.vip.board.EnglishKeyboardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />


总结


属性配置了有很多,可以实现多种自定义的相关效果,大家可以查找第二项中的属性介绍,进行自定义配置,还是那句话,本身的实现方式有很多种,本篇只是其中的一个简单的案例,仅供大家作为一个参考。


自定义英文和数字键盘,大家有没有发现了少了一个字母,为什么会没有这个字母呢?你知道原因吗?

相关文章
|
2月前
|
缓存 前端开发 Android开发
安卓开发中的自定义视图:从零到英雄
【10月更文挑战第42天】 在安卓的世界里,自定义视图是一块画布,让开发者能够绘制出独一无二的界面体验。本文将带你走进自定义视图的大门,通过深入浅出的方式,让你从零基础到能够独立设计并实现复杂的自定义组件。我们将探索自定义视图的核心概念、实现步骤,以及如何优化你的视图以提高性能和兼容性。准备好了吗?让我们开始这段创造性的旅程吧!
30 1
|
3月前
|
Android开发 开发者
安卓应用开发中的自定义视图
【9月更文挑战第37天】在安卓开发的海洋中,自定义视图犹如一座座小岛,等待着勇敢的探索者去发现其独特之处。本文将带领你踏上这段旅程,从浅滩走向深海,逐步揭开自定义视图的神秘面纱。
45 3
|
3月前
|
数据可视化 Android开发 开发者
安卓应用开发中的自定义View组件
【10月更文挑战第5天】在安卓应用开发中,自定义View组件是提升用户交互体验的利器。本篇将深入探讨如何从零开始创建自定义View,包括设计理念、实现步骤以及性能优化技巧,帮助开发者打造流畅且富有创意的用户界面。
113 0
|
2月前
|
搜索推荐 前端开发 Android开发
安卓应用开发中的自定义视图实现
【10月更文挑战第30天】在安卓开发的海洋中,自定义视图是那抹不可或缺的亮色,它为应用界面的个性化和交互体验的提升提供了无限可能。本文将深入探讨如何在安卓平台创建自定义视图,并展示如何通过代码实现这一过程。我们将从基础出发,逐步引导你理解自定义视图的核心概念,然后通过一个实际的代码示例,详细讲解如何将理论应用于实践,最终实现一个美观且具有良好用户体验的自定义控件。无论你是想提高自己的开发技能,还是仅仅出于对安卓开发的兴趣,这篇文章都将为你提供价值。
|
2月前
|
Android开发 开发者 UED
安卓开发中自定义View的实现与性能优化
【10月更文挑战第28天】在安卓开发领域,自定义View是提升应用界面独特性和用户体验的重要手段。本文将深入探讨如何高效地创建和管理自定义View,以及如何通过代码和性能调优来确保流畅的交互体验。我们将一起学习自定义View的生命周期、绘图基础和事件处理,进而探索内存和布局优化技巧,最终实现既美观又高效的安卓界面。
44 5
|
3月前
|
XML 前端开发 Java
安卓应用开发中的自定义View组件
【10月更文挑战第5天】自定义View是安卓应用开发的一块基石,它为开发者提供了无限的可能。通过掌握其原理和实现方法,可以创造出既美观又实用的用户界面。本文将引导你了解自定义View的创建过程,包括绘制技巧、事件处理以及性能优化等关键步骤。
|
4月前
|
Android开发 开发者
安卓开发中的自定义视图:从入门到精通
【9月更文挑战第19天】在安卓开发的广阔天地中,自定义视图是一块充满魔力的土地。它不仅仅是代码的堆砌,更是艺术与科技的完美结合。通过掌握自定义视图,开发者能够打破常规,创造出独一无二的用户界面。本文将带你走进自定义视图的世界,从基础概念到实战应用,一步步展示如何用代码绘出心中的蓝图。无论你是初学者还是有经验的开发者,这篇文章都将为你打开一扇通往创意和效率的大门。让我们一起探索自定义视图的秘密,将你的应用打造成一件艺术品吧!
73 10
|
4月前
|
缓存 搜索推荐 Android开发
安卓应用开发中的自定义View组件实践
【9月更文挑战第10天】在安卓开发领域,自定义View是提升用户体验和实现界面个性化的重要手段。本文将通过一个实际案例,展示如何在安卓项目中创建和使用自定义View组件,包括设计思路、实现步骤以及可能遇到的问题和解决方案。文章不仅提供了代码示例,还深入探讨了自定义View的性能优化技巧,旨在帮助开发者更好地掌握这一技能。
|
4月前
|
前端开发 Android开发 开发者
安卓应用开发中的自定义视图基础
【9月更文挑战第13天】在安卓开发的广阔天地中,自定义视图是一块神奇的画布,它允许开发者将想象力转化为用户界面的创新元素。本文将带你一探究竟,了解如何从零开始构建自定义视图,包括绘图基础、触摸事件处理,以及性能优化的实用技巧。无论你是想提升应用的视觉吸引力,还是追求更流畅的交互体验,这里都有你需要的金钥匙。
|
4月前
|
XML 编解码 Android开发
安卓开发中的自定义视图控件
【9月更文挑战第14天】在安卓开发中,自定义视图控件是一种高级技巧,它可以让开发者根据项目需求创建出独特的用户界面元素。本文将通过一个简单示例,引导你了解如何在安卓项目中实现自定义视图控件,包括创建自定义控件类、处理绘制逻辑以及响应用户交互。无论你是初学者还是有经验的开发者,这篇文章都会为你提供有价值的见解和技巧。
61 3