佛山市城乡住房建设局网站首页,广州网站推广找谁,美容茌哪个网站做宣传好,html学校官网代码制作简易输入框 前言正文① 构造方法② XML样式③ 测量④ 绘制1. 绘制方框2. 绘制文字 ⑤ 输入1. 键盘布局2. 键盘接口3. 键盘弹窗4. 显示键盘5. 相关API 四、使用自定义View五、源码 前言 在日常工作开发中#xff0c;我们时长会遇到各种各样的需求#xff0c;不部分需求是可以通… 简易输入框 前言正文① 构造方法② XML样式③ 测量④ 绘制1. 绘制方框2. 绘制文字 ⑤ 输入1. 键盘布局2. 键盘接口3. 键盘弹窗4. 显示键盘5. 相关API 四、使用自定义View五、源码 前言 在日常工作开发中我们时长会遇到各种各样的需求不部分需求是可以通过Android 原生的View来解决而有一些是无法解决的这时候我们就需要自定义View我们先来看看本文中这个自定义View的演示效果图。 正文 依然在EasyView中进行创建在com.easy.view下新建一个EasyEditText继承自View 实现里面的构造方法。
① 构造方法
然后我们继承自View重写里面的构造方法代码如下
public class EasyEditText extends View implements NumberKeyboardListener {private Context mContext;public EasyEditText(Context context) {this(context, null);}public EasyEditText(Context context, Nullable AttributeSet attrs) {this(context, attrs, 0);}public EasyEditText(Context context, Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);mContext context;}
}
下面就可以增加样式了。
② XML样式 在设置样式之前需要先知道我们的自定义View要做什么这是一个简易输入框可以用来做验证码输入或者密码输入输入框4~6个主要就是数字输入在attrs.xml文件中里面我们可以写自定义的样式代码如下所示 !--简易输入框--declare-styleable nameEasyEditText!-- 方框大小宽高一致 --attr nameboxWidth /!-- 方框背景颜色 --attr nameboxBackgroundColor /!-- 方框描边颜色 --attr nameboxStrokeColor /!-- 方框焦点描边颜色 --attr nameboxFocusStrokeColor formatcolor|reference/!-- 方框描边宽度 --attr nameboxStrokeWidth /!--文字颜色--attr nametextColor /!--文字大小--attr nametextSize /!-- 方框数量 4-6 个--attr nameboxNum formatinteger/!--是否密文--attr nameciphertext formatboolean//declare-styleable因为在此之前我还有三个View的样式所以重复的样式就抽离了出来可以参见源码了解。
下面我们回到View中去使用先声明变量代码如下 /*** 方框大小因为它是相同的宽度和高度它只需要一个值*/private int mBoxWidth;/*** 方框背景颜色*/private int mBoxBackgroundColor;/*** 方框默认描边颜色*/private int mBoxStrokeColor;/*** 方框获取焦点描点颜色*/private int mBoxFocusStrokeColor;/*** 方框描边大小*/private final int mBoxStrokeWidth;/*** 文字颜色*/private int mTextColor;/*** 文字大小*/private float mTextSize;/*** 方框数量最少4个 - 最多6个*/private int mBoxNum;/*** 方框之间的间距*/private int mBoxMargin 4;/*** 方框画笔*/private Paint mBoxPaint;/*** 方框描边画笔*/private Paint mBoxStrokePaint;/*** 文字画笔*/private Paint mTextPaint;/*** 文字矩形*/private final Rect mTextRect new Rect();/*** 方框圆角*/private float mBoxCornerRadius 8f;/*** 描边圆角*/private float strokeRadius;/*** 输入长度*/private final int mInputLength;/*** 输入数组*/private final String[] inputArray;/*** 当前输入位置*/private int currentInputPosition 0;/*** 焦点边框列表*/private final ListRectF focusList new ArrayList();/*** 是否获取焦点*/private boolean isFocus false;/*** 是否密文显示*/private boolean ciphertext false;/*** 密文显示 **/private String ciphertextContent *;然后修改第三个构造函数代码如下所示 public EasyEditText(Context context, Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);mContext context;SuppressLint(CustomViewStyleable)TypedArray typedArray context.obtainStyledAttributes(attrs, R.styleable.EasyEditText);mBoxWidth (int) typedArray.getDimensionPixelSize(R.styleable.EasyEditText_boxWidth, 48);mBoxBackgroundColor typedArray.getColor(R.styleable.EasyEditText_boxBackgroundColor, ContextCompat.getColor(context, R.color.white));mBoxStrokeColor typedArray.getColor(R.styleable.EasyEditText_boxStrokeColor, ContextCompat.getColor(context, R.color.box_default_stroke_color));mBoxFocusStrokeColor typedArray.getColor(R.styleable.EasyEditText_boxFocusStrokeColor, ContextCompat.getColor(context, R.color.box_default_stroke_color));mBoxStrokeWidth (int) typedArray.getDimensionPixelSize(R.styleable.EasyEditText_boxStrokeWidth, 2);mTextColor typedArray.getColor(R.styleable.EasyEditText_textColor, ContextCompat.getColor(context, R.color.tx_default_color));mTextSize typedArray.getDimensionPixelSize(R.styleable.EasyEditText_textSize, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 14, getResources().getDisplayMetrics()));int number typedArray.getInteger(R.styleable.EasyEditText_boxNum, 4);ciphertext typedArray.getBoolean(R.styleable.EasyEditText_ciphertext, false);mBoxNum (number 6 || number 4) ? 4 : number;mInputLength mBoxNum;inputArray new String[mInputLength];typedArray.recycle();//初始化画笔initPaint();}这里通过EasyEditText得到TypedArray通过TypedArray获取EasyEditText中的属性然后进行赋值需要注意的是这里对于输入框的大小处理输入框个数就是输入的长度然后初始化画笔新增initPaint()方法代码如下 private void initPaint() {//设置边框画笔mBoxPaint new Paint();mBoxPaint.setAntiAlias(true);// anti-aliasingmBoxPaint.setColor(mBoxBackgroundColor);//Set colormBoxPaint.setStyle(Paint.Style.FILL);//Style filling//设置描边画笔mBoxStrokePaint new Paint();mBoxStrokePaint.setAntiAlias(true);mBoxStrokePaint.setColor(mBoxStrokeColor);mBoxStrokePaint.setStyle(Paint.Style.STROKE);//Style strokemBoxStrokePaint.setStrokeWidth(mBoxStrokeWidth);//Stroke width//设置文字画笔mTextPaint new Paint();mTextPaint.setAntiAlias(true);mTextPaint.setStyle(Paint.Style.FILL);mTextPaint.setColor(mTextColor);mTextPaint.setTextSize(mTextSize);//Text sizemTextPaint.setTextAlign(Paint.Align.CENTER);//Center the text}③ 测量 我们通过变量和属性得知了方框个数和方框间的间距然后我们重写onMeasure()方法代码如下 /*** View的测量** param widthMeasureSpec 宽度测量* param heightMeasureSpec 高度测量*/Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);int width 0;int margin EasyUtils.dp2px(mContext, mBoxMargin);switch (MeasureSpec.getMode(widthMeasureSpec)) {case MeasureSpec.UNSPECIFIED:case MeasureSpec.AT_MOST: //wrap_contentwidth mBoxWidth * mBoxNum margin * (mBoxNum - 1);break;case MeasureSpec.EXACTLY: //match_parentwidth MeasureSpec.getSize(widthMeasureSpec);mBoxWidth (width - margin * (mBoxNum - 1)) / mBoxNum;break;}//设置测量后的值setMeasuredDimension(width, mBoxWidth);}④ 绘制 测量好了之后下面就可以开始绘制了绘制就相当于在纸上画画而画画呢首先要有画笔首先声明变量代码如下 private Paint mBoxPaint;private Paint mBoxStrokePaint;private Paint mTextPaint;private final Rect mTextRect new Rect();然后我们需要对3个画笔方框、方框边框、文字进行设置因为绘制文字稍微有一些不同所以加了一个Rect下面我们在View中新增一个初始化画笔的方法代码如下所示 /*** 初始化画笔*/private void initPaint() {//设置方框画笔mBoxPaint new Paint();mBoxPaint.setAntiAlias(true);// 抗锯齿mBoxPaint.setColor(mBoxBackgroundColor);//设置颜色mBoxPaint.setStyle(Paint.Style.FILL);//风格填满//设置方框描边画笔mBoxStrokePaint new Paint();mBoxStrokePaint.setAntiAlias(true);mBoxStrokePaint.setColor(mBoxStrokeColor);mBoxStrokePaint.setStyle(Paint.Style.STROKE);//风格描边mBoxStrokePaint.setStrokeWidth(mBoxStrokeWidth);//描边宽度//设置文字画笔mTextPaint new Paint();mTextPaint.setAntiAlias(true);mTextPaint.setStyle(Paint.Style.FILL);mTextPaint.setColor(mTextColor);mTextPaint.setTextSize(mTextSize);//文字大小mTextPaint.setTextAlign(Paint.Align.CENTER);//文字居中对齐}然后在第三个构造方法中去调用如下图所示 下面要进行绘制了。 Overrideprotected void onDraw(Canvas canvas) {//绘制边框drawBox(canvas);//绘制文字drawText(canvas);}这里绘制分为两步绘制方框和绘制文字。
1. 绘制方框 首先是绘制方框在自定义View中新增一个drawBox()方法代码如下 /*** 绘制方框*/private void drawBox(Canvas canvas) {//每个方框的间距int margin EasyUtils.dp2px(mContext, mBoxMargin);int radius EasyUtils.dp2px(mContext, mBoxCornerRadius);//Draw a rounded rectangle borderfloat strokeWidth mBoxStrokeWidth / 2;for (int i 0; i mBoxNum; i) {//To draw a rectangular box, you need the positions of the left, top, right and bottom pointsfloat left i * mBoxWidth i * margin;float top 0f;float right (i 1) * mBoxWidth i * margin;float bottom mBoxWidth;RectF rectF new RectF(left, top, right, bottom);//画一个圆角矩形框canvas.drawRoundRect(rectF, radius, radius, mBoxPaint);RectF strokeRectF new RectF(left strokeWidth, top strokeWidth, right - strokeWidth, bottom - strokeWidth);//添加到列表focusList.add(strokeRectF);}for (int i 0; i mBoxNum; i) {strokeRadius radius - strokeWidth;//根据当前绘制位置和是否获取焦点设置画笔颜色if (i currentInputPosition isFocus) {mBoxStrokePaint.setColor(mBoxFocusStrokeColor);} else {mBoxStrokePaint.setColor(mBoxStrokeColor);}//绘制边框canvas.drawRoundRect(focusList.get(i), strokeRadius, strokeRadius, mBoxStrokePaint);}}这里首先绘制圆角背景然后通过绘制背景的参数得到绘制的边框将边框保存起来再根据当前绘制位置和是否获取焦点设置画笔颜色这样就可以实现当前输入框的颜色变化比如我没有输入的时候是黑色边框当我输入第一个值的时候第一个输入框的边框颜色变成绿色输入完第一个第二个框的边框变成绿色表示你应该输入第二个框了这样可以友好的提示用户。
2. 绘制文字 现在方框有了而文字绘制我们需要绘制在方框的中间自定义View中新增一个drawText()方法。 /*** 绘制文字*/private void drawText(Canvas canvas) {int boxMargin EasyUtils.dp2px(mContext, mBoxMargin);for (int i 0; i inputArray.length; i) {if (inputArray[i] ! null) {//绘制的文字String content ciphertext ? ciphertextContent : inputArray[i];//获取绘制的文字边界mTextPaint.getTextBounds(content, 0, content.length(), mTextRect);//绘制的位置int offset (mTextRect.top mTextRect.bottom) / 2;//绘制文字需要确定起始点的X、Y的坐标点float x (float) (getPaddingLeft() mBoxWidth * i boxMargin * i mBoxWidth / 2);float y (float) (getPaddingTop() mBoxWidth / 2) - offset;//绘制文字canvas.drawText(content, x, y, mTextPaint);}}}绘制文字和之前的MacAddressEditText中的操作差不多我就不重复说了下面我们来看输入。
⑤ 输入 绘制的处理已经完成了简易地址输入框我们之前说了只输入数字输入的数据就是0、1、2、3、4、5、6、7、8、9那么为了方便我打算自己做一个键盘来进行输入。
1. 键盘布局 首先在layout下创建一个lay_number_keyboard.xml用于作为键盘的布局代码如下所示
?xml version1.0 encodingutf-8?
androidx.constraintlayout.widget.ConstraintLayout xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:apphttp://schemas.android.com/apk/res-autoandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:background#eff4f9Buttonandroid:idid/btn_1android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart8dpandroid:layout_marginLeft8dpandroid:layout_marginTop8dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_1android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_2app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toStartOfparentapp:layout_constraintTop_toTopOfparent /Buttonandroid:idid/btn_2android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_2android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_3app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_1app:layout_constraintTop_toTopOfid/btn_1 /Buttonandroid:idid/btn_3android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:layout_marginEnd8dpandroid:layout_marginRight8dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_3android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toEndOfparentapp:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_2app:layout_constraintTop_toTopOfid/btn_2 /Buttonandroid:idid/btn_4android:layout_width0dpandroid:layout_height48dpandroid:layout_marginTop4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_4android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_5app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toStartOfid/btn_1app:layout_constraintTop_toBottomOfid/btn_1 /Buttonandroid:idid/btn_5android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_5android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_6app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_4app:layout_constraintTop_toTopOfid/btn_4 /Buttonandroid:idid/btn_6android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:layout_marginEnd8dpandroid:layout_marginRight8dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_6android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toEndOfparentapp:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_5app:layout_constraintTop_toTopOfid/btn_5 /Buttonandroid:idid/btn_7android:layout_width0dpandroid:layout_height48dpandroid:layout_marginTop4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_7android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_8app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toStartOfid/btn_4app:layout_constraintTop_toBottomOfid/btn_4 /Buttonandroid:idid/btn_8android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_8android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_9app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_7app:layout_constraintTop_toTopOfid/btn_7 /Buttonandroid:idid/btn_9android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_9android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toEndOfid/btn_6app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_8app:layout_constraintTop_toTopOfid/btn_8 /Buttonandroid:idid/btn_delandroid:layout_width0dpandroid:layout_height48dpandroid:layout_marginTop4dpandroid:layout_marginBottom8dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/deleteandroid:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintBottom_toBottomOfparentapp:layout_constraintEnd_toStartOfid/btn_0app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toStartOfid/btn_7app:layout_constraintTop_toBottomOfid/btn_7 /Buttonandroid:idid/btn_0android:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/num_0android:textColorcolor/key_tx_colorandroid:textSize16spapp:layout_constraintEnd_toStartOfid/btn_completeapp:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_delapp:layout_constraintTop_toTopOfid/btn_del /com.google.android.material.button.MaterialButtonandroid:idid/btn_completeandroid:layout_width0dpandroid:layout_height48dpandroid:layout_marginStart4dpandroid:layout_marginLeft4dpandroid:backgroundTintcolor/key_complete_bg_colorandroid:insetTop0dpandroid:insetBottom0dpandroid:textstring/completeandroid:textColorcolor/whiteandroid:textSize16spapp:iconGravitystart|endapp:layout_constraintEnd_toEndOfid/btn_9app:layout_constraintHorizontal_bias0.5app:layout_constraintStart_toEndOfid/btn_0app:layout_constraintTop_toTopOfid/btn_0 //androidx.constraintlayout.widget.ConstraintLayout布局的预览效果如下图所示 这个布局从使用上来说就很简单了基本上一目了然这里我们可以写一个接口用来处理键盘上按钮点击的事件。
2. 键盘接口 在com.llw.easyview下新建一个NumberKeyboardListener接口代码如下所示
public interface NumberKeyboardListener {/*** 数字字符* param num 0~9*/void onNum(String num);/*** 删除*/void onDelete();/*** 完成*/void onComplete();/*** 弹窗关闭*/void onDialogDismiss();/*** 弹窗显示*/void onDialogShow();
}现在接口有了接口中的方法基本上覆盖了键盘上所有按钮点击时触发的事件处理然后是处理弹窗关闭和显示为什么要有这个关闭和显示呢因为要获取是否输入的状态下面我们来写一个弹窗用来点击简易输入框时弹出这个键盘。
3. 键盘弹窗 这个弹窗我就写在EasyUtils类中了在里面新增如下方法代码 /*** 显示数字键盘弹窗** param listener 数字键盘监听*/public static void showNumKeyboardDialog(NonNull Context context, NonNull NumberKeyboardListener listener) {BottomSheetDialog dialog new BottomSheetDialog(context);//从xml中获取布局视图View view LayoutInflater.from(context).inflate(R.layout.lay_number_keyboard, null, false);//单击按钮触发接口回调view.findViewById(R.id.btn_0).setOnClickListener(v - listener.onNum(0));view.findViewById(R.id.btn_1).setOnClickListener(v - listener.onNum(1));view.findViewById(R.id.btn_2).setOnClickListener(v - listener.onNum(2));view.findViewById(R.id.btn_3).setOnClickListener(v - listener.onNum(3));view.findViewById(R.id.btn_4).setOnClickListener(v - listener.onNum(4));view.findViewById(R.id.btn_5).setOnClickListener(v - listener.onNum(5));view.findViewById(R.id.btn_6).setOnClickListener(v - listener.onNum(6));view.findViewById(R.id.btn_7).setOnClickListener(v - listener.onNum(7));view.findViewById(R.id.btn_8).setOnClickListener(v - listener.onNum(8));view.findViewById(R.id.btn_9).setOnClickListener(v - listener.onNum(9));view.findViewById(R.id.btn_del).setOnClickListener(v - listener.onDelete());view.findViewById(R.id.btn_complete).setOnClickListener(v - {listener.onComplete();dialog.dismiss();});//点击外面消失dialog.setCancelable(true);//设置内容视图dialog.setContentView(view);if (dialog.getWindow() ! null) {//设置弹出窗口背景透明WindowManager.LayoutParams params dialog.getWindow().getAttributes();params.dimAmount 0.0f;dialog.getWindow().setAttributes(params);}dialog.setOnShowListener(dialog1 - listener.onDialogShow());dialog.setOnCancelListener(dialog12 - listener.onDialogDismiss());dialog.setOnDismissListener(dialog13 - listener.onDialogDismiss());dialog.show();}这里就是一个底部弹窗然后设置布局视图设置接口回调设置背景透明最后显示出来。那么下一步要做的就是点击输入框调用这个弹窗显示键盘。
4. 显示键盘 在View中是可以获取到点击触摸事件的那么我们可以在自定义View中新增如下代码 /*** 触摸事件*/SuppressLint(ClickableViewAccessibility)Overridepublic boolean onTouchEvent(MotionEvent event) {if (event ! null) {if (event.getAction() MotionEvent.ACTION_DOWN) {//显示数字键盘EasyUtils.showNumKeyboardDialog(mContext, this);return true;}}return super.onTouchEvent(event);}这里的代码就是当我们的手机点击这个简易输入框的时候会先触发触摸事件然后才是点击事件而在这里我们就是在触摸到的时候显示键盘弹窗然后返回 true这里就会进行事件的拦截这里的这个this就是我们当前的自定义View需要实现的回调接口将鼠标放在这个this后面然后Alt Enter的组合键会出现弹窗如下图所示 这里点击第四项会出现一个弹窗勾选上所有的方法然后点OK就可以快速实现这个接口的回调重写接口的方法你会看到自定义View新增了5个方法代码如下 Overridepublic void onNum(String num) {if (currentInputPosition mInputLength) return;inputArray[currentInputPosition] num;currentInputPosition;//Refresh ViewpostInvalidate();}Overridepublic void onDelete() {if (currentInputPosition 0) return;currentInputPosition--;inputArray[currentInputPosition] null;//Refresh ViewpostInvalidate();}Overridepublic void onComplete() {Log.d(TAG, onComplete: getText());}Overridepublic void onDialogShow() {isFocus true;postInvalidate();}Overridepublic void onDialogDismiss() {isFocus false;postInvalidate();} 当调用postInvalidate()方法时会重新进行绘制则按照之前的逻辑就行了。
5. 相关API 下面再增加几个可供代码调用的API方法如下所示 /*** 设置输入框个数*/public void setBoxNum(int num) {if (num 4 || num 6) {throw new IllegalArgumentException(The number of input boxes ranges from 4 to 6);}mBoxNum num;}/*** 获取输入总长度*/public int getBoxNum() {return mBoxNum;}/*** 设置是否密文* param flag true 密文、false 明文*/public void setCiphertext(boolean flag) {ciphertext flag;postInvalidate();}/*** 设置密文时显示的内容* param content 密文内容默认是 **/public void setCiphertextContent(String content) {if (content null) return;if (content.isEmpty()) return;if (content.length() 1) return;ciphertextContent content;}/*** 获取输入内容*/public String getText() {StringBuilder builder new StringBuilder();for (String number : inputArray) {if (number null) continue;if (number.isEmpty()) continue;builder.append(number);}return builder.toString();}
四、使用自定义View 关于使用我在些这个文章的时候这个自定义View已经加入到仓库中了可以通过引入依赖的方式例如在app模块中使用则打开app模块下的build.gradle在dependencies{}闭包下添加即可之后记得要Sync Now。
dependencies {implementation io.github.lilongweidev:easyview:1.0.3
}或者你在自己的项目中完成了刚才上述的所有步骤那么你就不用引入依赖了直接调用就好了不过要注意更改对应的包名否则会爆红的。
可以使用了修改activity_easy_edittext.xml中的代码如下所示
?xml version1.0 encodingutf-8?
LinearLayout xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:apphttp://schemas.android.com/apk/res-autoxmlns:toolshttp://schemas.android.com/toolsandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:gravitycenterandroid:orientationverticaltools:context.used.EasyEditTextActivity!--简易输入框--com.easy.view.EasyEditTextandroid:idid/et_contentandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentapp:boxBackgroundColorcolor/whiteapp:boxFocusStrokeColorcolor/greenapp:boxNum6app:boxStrokeColorcolor/blackapp:boxStrokeWidth2dpapp:boxWidth48dpapp:ciphertextfalseapp:textColorcolor/blackapp:textSize16sp /CheckBoxandroid:idid/cb_flagandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginTop30dpandroid:text明文 /Buttonandroid:idid/btn_get_contentandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_marginTop12dpandroid:text获取内容 /
/LinearLayout如果你发现XML预览不了看不到这个自定义View就Rebuild Project一下就能看到了预览效果如下图所示 下面进入到EasyEditTextActivity中去使用修改代码如下所示
public class EasyEditTextActivity extends EasyActivityActivityEasyEdittextBinding {Overrideprotected void onCreate() {getSupportActionBar().setDisplayHomeAsUpEnabled(true);binding.cbFlag.setOnCheckedChangeListener((buttonView, isChecked) - {binding.etContent.setCiphertext(isChecked);binding.cbFlag.setText(isChecked ? 密文 : 明文);});//输入框binding.btnGetContent.setOnClickListener(v - {String content binding.etContent.getText();if (content.isEmpty()) {showMsg(请输入内容);return;}if (content.length() binding.etContent.getBoxNum()) {showMsg(请输入完整内容);return;}showMsg(输入内容为 content);});}
}这里的代码就很简单获取View然后点击按钮时获取输入框的值获取到值显示在按钮上下面运行测试一下。 五、源码
如果对你有所帮助的话不妨 Star 或 Fork山高水长后会有期~
源码地址EasyView
