自定义数字键盘组件

最新推荐文章于 2023-04-06 15:01:02 发布
最新推荐文章于 2023-04-06 15:01:02 发布
阅读量112 收藏
点赞数
文章标签： 移动开发 java
原文链接：https://my.oschina.net/u/1011854/blog/1594627
版权

为什么80%的码农都做不了架构师？>>> hot3.png

自定义数字键盘组件，实现了数字校验，按钮事件等，效果图如下： 输入图片说明 布局代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp">
        <Button
            android:id="@+id/keyboard_1"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_1" />
        <Button
            android:id="@+id/keyboard_2"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_2" />
        <Button
            android:id="@+id/keyboard_3"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_3" />
        <Button
            android:id="@+id/keyboard_clear"
            android:layout_weight="1"
            android:textColor="@color/btn_bg_red_color"
            android:textSize="@dimen/abc_text_size_title_material"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_clear" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp">
        <Button
            android:id="@+id/keyboard_4"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_4" />
        <Button
            android:id="@+id/keyboard_5"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_5" />
        <Button
            android:id="@+id/keyboard_6"
            android:layout_weight="1"
            style="@style/keyboardBtn"
            android:background="@drawable/keyboard_btn"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="@string/kb_6" />
        <LinearLayout
            android:id="@+id/keyboard_back"
            android:layout_weight="1"
            android:background="@drawable/keyboard_btn"
            android:gravity="center"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <TextView
                android:background="@drawable/keyboard_clear_bitmap"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        </LinearLayout>

    </LinearLayout>
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="120dp">
        <LinearLayout
            android:layout_weight="1"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="60dp">
                <Button
                    android:id="@+id/keyboard_7"
                    android:layout_weight="1"
                    style="@style/keyboardBtn"
                    android:background="@drawable/keyboard_btn"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:text="@string/kb_7" />
                <Button
                    android:id="@+id/keyboard_8"
                    android:layout_weight="1"
                    style="@style/keyboardBtn"
                    android:background="@drawable/keyboard_btn"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:text="@string/kb_8" />
                <Button
                    android:id="@+id/keyboard_9"
                    android:layout_weight="1"
                    style="@style/keyboardBtn"
                    android:background="@drawable/keyboard_btn"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:text="@string/kb_9" />
            </LinearLayout>
            <LinearLayout
                android:orientation="horizontal"
                android:layout_width="match_parent"
                android:layout_height="60dp">
                <Button
                    android:id="@+id/keyboard_0"
                    android:layout_weight="2"
                    style="@style/keyboardBtn"
                    android:background="@drawable/keyboard_btn"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:text="@string/kb_0" />
                <Button
                    android:id="@+id/keyboard_dian"
                    android:layout_weight="1"
                    style="@style/keyboardBtn"
                    android:background="@drawable/keyboard_btn"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:text="@string/kb_dian" />
            </LinearLayout>
        </LinearLayout>
        <Button
            android:id="@+id/keyboard_alipay"
            android:layout_weight="3"
            android:textColor="@color/white"
            android:textSize="@dimen/abc_text_size_title_material"
            android:background="@color/pay_btn_grey"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="收款" />
    </LinearLayout>
</LinearLayout>

对应的封装的Java代码：

package com.zqsy.qrcodebox.component;

import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;

import com.zqsy.qrcodebox.R;

/**
 * Created by zhangda on 2017/12/3.
 * 自定义数字键盘组件
 */

public class NumberKeyBoard extends LinearLayout{
    private Context mContext;
    private OnValueChangedListener onValueChangedListener;
    private OnAlipayCheckedListener onAlipayCheckedListener;
    private OnWeixinCheckedListener onWeixinCheckedListener;
    private String resultStr = "";

    private Button btn1;
    private Button btn2;
    private Button btn3;
    private Button btn4;
    private Button btn5;
    private Button btn6;
    private Button btn7;
    private Button btn8;
    private Button btn9;
    private Button btn0;
    private Button btnDian;
    private LinearLayout btnBack;
    private Button btnClear;
    private Button btnAlipay;
//    private Button btnWeixin;

    public NumberKeyBoard(Context context) {
        super(context);
    }

    public NumberKeyBoard(Context context, AttributeSet attrs) {
        super(context, attrs);
        mContext = context;
        LayoutInflater.from(context).inflate(R.layout.component_keyborad, this);

        initBtnsListeners();
    }

    private void initBtnsListeners() {
        btn1 = findViewById(R.id.keyboard_1);
        btn2 = findViewById(R.id.keyboard_2);
        btn3 = findViewById(R.id.keyboard_3);
        btn4 = findViewById(R.id.keyboard_4);
        btn5 = findViewById(R.id.keyboard_5);
        btn6 = findViewById(R.id.keyboard_6);
        btn7 = findViewById(R.id.keyboard_7);
        btn8 = findViewById(R.id.keyboard_8);
        btn9 = findViewById(R.id.keyboard_9);
        btn0 = findViewById(R.id.keyboard_0);
        btnDian = findViewById(R.id.keyboard_dian);
        btnBack = findViewById(R.id.keyboard_back);
        btnClear = findViewById(R.id.keyboard_clear);
        btnAlipay = findViewById(R.id.keyboard_alipay);
//        btnWeixin = findViewById(R.id.keyboard_weixin);
        OnClickListener buttonsOnClickListener = new OnClickListener() {
            @Override
            public void onClick(View view) {
                switch (view.getId()){
                    case R.id.keyboard_1:
                        addNumberToResult("1");
                        break;
                    case R.id.keyboard_2:
                        addNumberToResult("2");
                        break;
                    case R.id.keyboard_3:
                        addNumberToResult("3");
                        break;
                    case R.id.keyboard_4:
                        addNumberToResult("4");
                        break;
                    case R.id.keyboard_5:
                        addNumberToResult("5");
                        break;
                    case R.id.keyboard_6:
                        addNumberToResult("6");
                        break;
                    case R.id.keyboard_7:
                        addNumberToResult("7");
                        break;
                    case R.id.keyboard_8:
                        addNumberToResult("8");
                        break;
                    case R.id.keyboard_9:
                        addNumberToResult("9");
                        break;
                    case R.id.keyboard_0:
                        addNumberToResult("0");
                        break;
                    case R.id.keyboard_dian:
                        addNumberToResult(".");
                        break;
                    case R.id.keyboard_back:
                        reduceNumberToResult();
                        break;
                    case R.id.keyboard_clear:
                        clearNumber();
                        break;
                }

            }
        };

        btn1.setOnClickListener(buttonsOnClickListener);
        btn2.setOnClickListener(buttonsOnClickListener);
        btn3.setOnClickListener(buttonsOnClickListener);
        btn4.setOnClickListener(buttonsOnClickListener);
        btn5.setOnClickListener(buttonsOnClickListener);
        btn6.setOnClickListener(buttonsOnClickListener);
        btn7.setOnClickListener(buttonsOnClickListener);
        btn8.setOnClickListener(buttonsOnClickListener);
        btn9.setOnClickListener(buttonsOnClickListener);
        btn0.setOnClickListener(buttonsOnClickListener);
        btnDian.setOnClickListener(buttonsOnClickListener);
        btnBack.setOnClickListener(buttonsOnClickListener);
        btnClear.setOnClickListener(buttonsOnClickListener);

        btnAlipay.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                //支付按钮可以点击时才触发事件
                if(btnAlipay.getTag() != null && btnAlipay.getTag().equals("canPress")){
                    if(onAlipayCheckedListener != null){
                        onAlipayCheckedListener.onClick(formatResult(resultStr));
                    }
                }
            }
        });

//        btnWeixin.setOnClickListener(new OnClickListener() {
//            @Override
//            public void onClick(View view) {
//                if(onWeixinCheckedListener != null){
//                    onWeixinCheckedListener.onClick(formatResult(resultStr));
//                }
//
//            }
//        });
    }

    //清除数字
    public void clearNumber() {
        resultStr = "";
        if(onValueChangedListener != null){
            onValueChangedListener.onChange(formatResult(resultStr));
        }
    }

    //擦除数字
    private void reduceNumberToResult() {
        if(resultStr.length() > 0){
            resultStr = resultStr.substring(0, resultStr.length()-1);
        }
        if(onValueChangedListener != null){
            onValueChangedListener.onChange(formatResult(resultStr));
        }
    }

    //增加数字
    private void addNumberToResult(String numberStr) {
        if(resultStr.indexOf(".") >= 0){
            if(numberStr.equals(".")){
                return;
            }else{
                //限制小数点后面最多有两位小数
                int xiaoshuLen = resultStr.substring(resultStr.indexOf("."), resultStr.length()).length();
                if(xiaoshuLen == 3){
                    return;
                }
            }
        }

        //第一次输入的是点，显示0.
        if(resultStr.equals("") && numberStr.equals(".")){
            numberStr = "0.";
        }

        //数字前多次输入0，只显示一个0
        if(resultStr != null && !resultStr.equals("")
                && resultStr.equals("0") && numberStr.equals("0")){
            return;
        }

        resultStr += numberStr;
        if(onValueChangedListener != null){
            onValueChangedListener.onChange(formatResult(resultStr));
        }
    }

    private String formatResult(String str){
        if(str == null || str.equals("")){
            //收款按钮设置为灰色
            btnAlipay.setTag("cannotPress");
            btnAlipay.setBackgroundColor(getResources().getColor(R.color.pay_btn_grey));
            return "0";
        }else{
            double resultDou = Double.parseDouble(str);
            if(resultDou > 0){
                btnAlipay.setTag("canPress");
                btnAlipay.setBackgroundColor(getResources().getColor(R.color.btn_bg_red_color));
            }else{
                btnAlipay.setTag("cannotPress");
                btnAlipay.setBackgroundColor(getResources().getColor(R.color.pay_btn_grey));
            }
        }
        return str;
    }


    /***
     * 键盘控件的值改变事件方法
     * @param listener
     */
    public void setOnValueChangedListener(OnValueChangedListener listener){
        onValueChangedListener = listener;
    }

    /***
     * 支付宝结账事件
     * @param listener
     */
    public void setOnAlipayCheckedListener(OnAlipayCheckedListener listener){
        onAlipayCheckedListener = listener;
    }

    /***
     * 微信结账事件
     * @param listener
     */
    public void setOnWeixinCheckedListener(OnWeixinCheckedListener listener){
        onWeixinCheckedListener = listener;
    }

    public interface OnValueChangedListener{
        void onChange(String result);
    }

    public interface OnAlipayCheckedListener{
        void onClick(String result);
    }

    public interface OnWeixinCheckedListener{
        void onClick(String result);
    }


}

在需要使用该组件的布局文件中添加如下：

<yourpakage.component.NumberKeyBoard
        android:id="@+id/cashier_numberKeyBoard"
        android:layout_alignParentBottom="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </yourpakage.component.NumberKeyBoard>

在需要使用该组件的activity添加：

NumberKeyBoard numberKeyBoard = findViewById(R.id.cashier_numberKeyBoard);
numberKeyBoard.setOnValueChangedListener(new NumberKeyBoard.OnValueChangedListener() {
             @Override
             public void onChange(String result) {
                 cashier_account.setText(result+"");
             }
         });

         numberKeyBoard.setOnAlipayCheckedListener(new NumberKeyBoard.OnAlipayCheckedListener() {
             @Override
             public void onClick(String result) {
                 goToPay(result, "alipay");
             }
         });

ok，大功告成！

转载于:https://my.oschina.net/u/1011854/blog/1594627

weixin_34228617
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
iOS swift 自定制控件（数字键盘）
backpackcsdn的专栏
10-17 1283
最近学习ios编程，启用了swift语言，非常高效的一门y
c# 自定义的数字键盘和字母键盘
06-19
自己做的一个软键盘，支持数字键盘和字母键盘，默认绑定的textbox，可以自己看情况进行修改.
数字键盘组件
kklkjfdiiu的博客
04-06 200
使用 <num-pad v-model="form.number" :visible.sync="numPadVisible" point withHeader header="请输入数量" />
数字键盘控件
weixin_34211761的博客
03-09 285
支持证书和小数的输入 可以指出对数字的退格删除 源码地址:numberview Gradle 在Project的build.gradle中添加: allprojects { repositories { maven { url 'https://jitpack.io' } } } 复制代码添加依赖: compile 'com.github.zhuazhu:number...
使用Vue自定义数字键盘组件(体验度极好)
08-28
"使用Vue自定义数字键盘组件，提高用户体验" 在 Vue 开发中，输入金额是一种常见的交互场景。然而，用原生的 input 进行金额输入体验很不好。为了提高用户体验，小编使用 Vue 自定义了数字键盘组件。本文将详细介绍...
android 纯自定义数字键盘输入
06-30
这个"android 纯自定义数字键盘输入"的项目就是针对这种情况的一个示例，它提供了一个完整的源码实现，帮助开发者自定义一个只允许输入数字的键盘。 自定义键盘在Android中通常通过创建一个新的View或者布局来实现...
自定义数字键盘和edittext
11-10
本文将深入探讨如何在Android中实现自定义数字键盘以及与之配套的EditText功能，包括键盘的显示、隐藏、输入清除等操作。 首先，我们来了解自定义数字键盘的基本概念。在Android系统中，原生键盘提供了多种类型，...
Adroid自定义数字键盘控件
05-20
这个“Android自定义数字键盘控件”的项目就是针对这样的需求，提供了一个完整的源码实现，让我们能够独立于系统弹出的软键盘之外，构建个性化的数字输入界面。 自定义控件在Android开发中扮演着重要角色，它允许...
APICloud AVM框架 封装虚拟数字键盘组件
白鱼赤乌的博客
06-01 575
虚拟数字键盘，支持数字随机，支持自定义输出数字内容的长度，自定义是否支持双向绑定，支持二次输入操作。可以为密码、验证码输入时使用。
一款C#编写的数字软键盘
03-10
一款C#编写的数字软键盘~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
vue数字虚拟键盘组件
08-10
A Vue component to num-keyboard 一个虚拟数字键盘插件
C# 数字键盘实现
11-16
C# 数字键盘实现,类似微软的小键盘功能，只有数字功能区，字母功能可以下载后进行改进
微信小程序-微信小程序自定义组件
08-05
微信小程序 - 自定义组件 预览 用微信web开发者工具打开src目录（请注意，是src目录，不是整个项目） 使用 组件的wxml结构请看src/components/下的组件 样式文件可直接引用src/components/wux.wxss Components ActionSheet - 上拉菜单 Backdrop - 背景幕 Barcode - 条形码 Button - 浮动按钮 Calendar - 日历 CountDown - 倒计时 CountUp - 计数器 Dialog - 对话框 Gallery - 画廊 Loading - 指示器 Notification - 通知 Picker - 选择器 Prompt - 提示信息 Qrcode - 二维码 Rater - 评分组件 Refresher - 下拉刷新 Seats - 座位图 Toast - 提示框 Toptips - 顶部提示 Xnumber - 数字输入框 项目截图 贡献 有任何意见或建议都欢迎提 issue License MIT
C#屏幕软键盘源码，可以自己定制界面，支持WIN8 64bit
12-19
很好用的屏幕软键盘源码，谁用谁知道。我已经嵌入到我的程序里，可以自己定制button的样式与数量。简单易懂，可直接通过exe调用。
java数字小键盘js_原生js制作简单的数字键盘
weixin_29061465的博客
03-02 601
一、起因最近支付的同事说，数字键盘有些问题；在移动设备上有时候比较难出现点(.) 和数字在一起的格局；因此，考虑到这种情况，就建议手写个模拟键盘了。花了一晚上的时间，写了个简单的键盘，基本能用。考虑到有的开发者没有使用juqery,就使用原生的js了。二、截图如下三、体验地址(需要点击input才能弹出数字键盘的哦)四、代码比较简单，直接贴了;(function(exports){var KeyB...
YonBuilder移动开发平台 AVM框架 封装虚拟数字键盘组件
weixin_43947457的博客
12-27 735
AVM（Application-View-Model）前端组件化开发模式基于标准Web Components组件化思想，提供包含虚拟DOM和Runtime的编程框架avm.js以及多端统一编译工具，完全兼容Web Components标准，同时兼容Vue和React语法糖编写代码，编译工具将Vue和React相关语法糖编译转换为avm.js代码。
自定义数字键盘
月清空的博客
02-28 1771
自定义键盘： 重写的Popupwindow，将自定义的键盘放到里面，然后屏蔽系统键盘，就能使用自定义的键盘了。 功能： 输入框弹出自定义键盘 点击屏幕或者back键，退出键盘 效果： 弹出框： public class PopupKeyboard extends PopupWindow implements OnDismissListener { private Con
自定义数字键盘实现-1
Lighthouse
07-12 1008
1.自定义数字键盘九宫格； 2.实现的数字键点击监听。并输出点击的值 3.使用场景，以及后期延伸扩展方向效果图片：说起来自定义键盘的，总感觉很高大上，最近项目中要实现的类似支付宝，支付时候交互效果的，思来想后，还是自定义个九宫格键盘来的简单粗暴。避免给自己调到 系统键盘坑中。只是说思路，肯定有 0-9 监听，一个删除键，（完成键盘。和 小数点键 可根据需求添加） 本例使用枚举进行数字键盘数字存
vant自定义数字键盘
最新发布
08-26
- *1* *2* *3* [vue封装自定义数字键盘组件](https://blog.csdn.net/kivets/article/details/93927209)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值