Android 自定义数字键盘（一）

最新推荐文章于 2024-08-04 03:30:30 发布
最新推荐文章于 2024-08-04 03:30:30 发布
阅读量5.9k 收藏 6
点赞数 2
分类专栏： Android Android自定义View进阶 Android 自定义View与绘图基础
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/danfengw/article/details/53817535
版权

这里写图片描述
看了一个自定义键盘的Demo感觉比网上那种自己绘制的那种要方便很多，就学习了一下，刚开始觉得应该挺麻烦的，还继承一个KeyBoardView，不过学习完了觉得还好，至少还能看懂，另外感觉收获还是挺多的。

自定义键盘

键盘布局

先从简单的可以理解的看吧，循序渐进
horizontalGap：按键间的水平间隔
keyHeight：按键高度以%或者%p结尾
keyWidth：按键宽度，”33.33333%p”（3列你懂得）
verticalGap：按键间的垂直间隔
codes：可以是系统给的固定值也可以是自定义的值

<?xml version="1.0" encoding="utf-8"?>
<Keyboard xmlns:android="http://schemas.android.com/apk/res/android"
    android:horizontalGap="1dp"
    android:keyHeight="8%p"
    android:keyWidth="33.33333%p"
    android:verticalGap="1dp">
    <Row>
        <Key
            android:codes="49"
            android:keyLabel="1"></Key>
        <Key
            android:codes="50"
            android:keyLabel="2"></Key>
        <Key
            android:codes="51"
            android:keyLabel="3"></Key>
    </Row>
    <Row>
        <Key
            android:codes="52"
            android:keyLabel="4"></Key>
        <Key
            android:codes="53"
            android:keyLabel="5"></Key>
        <Key
            android:codes="54"
            android:keyLabel="6"></Key>
    </Row>
    <Row>
        <Key
            android:codes="53"
            android:keyLabel="7"></Key>
        <Key
            android:codes="54"
            android:keyLabel="8"></Key>
        <Key
            android:codes="55"
            android:keyLabel="9"></Key>
    </Row>
    <Row>
        <Key
            android:codes="-10"
            android:keyLabel=""></Key>
        <Key
            android:codes="48"
            android:keyLabel="0"></Key>
        <Key
            android:codes="-5"
            android:keyIcon="@color/colorPrimary"></Key>
    </Row>
</Keyboard>

继承keyboardview

这里主要就是3个点：1、获取按键布局（setkeyboard）2、绘制空白键跟删除键（onDraw）3、设置回调（OnKeyPressListener）。
删除按钮我做了一点处理，因为直接使用获取的dp（intrinsicWidth）的话图片会比较大，不是很好看，为了协调一点我宽高各自除了个6，然后计算了上下左右的边距（widthInterval，heightInterval），再进行的绘制。大体是这个意思，如图
紫色线就是我计算的间隔
这里写图片描述
这里用了自定义的属性展示在这里：

 <declare-styleable name="NumKeyView">
        <attr name="gbColor" format="color|reference"></attr>
        <attr name="deleteDrawable" format="reference"></attr>
    </declare-styleable>

NumKeyView

public class NumKeyView extends KeyboardView implements OnKeyboardActionListener {
    //用于区分左下角空白按键,(要与xml里设置的数值相同)
    private int KEYCODE_EMPTY=-10;
    //删除按键背景图片
    private Drawable mDeleteDrawable;
    //最下面两个灰色的按键（空白按键跟删除按键）
    private int mBgColor;


    public NumKeyView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs,0);
    }

    public NumKeyView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs, defStyleAttr);
    }

    private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        TypedArray ta=context.obtainStyledAttributes(attrs, R.styleable.NumKeyView);
        mBgColor=ta.getColor(R.styleable.NumKeyView_gbColor, Color.RED);
        mDeleteDrawable=ta.getDrawable(R.styleable.NumKeyView_deleteDrawable);
        ta.recycle();
        //获取xml中的按键布局
        Keyboard keyboard=new Keyboard(context,R.xml.numkeyview);
        setKeyboard(keyboard);
        setEnabled(true);
        setPreviewEnabled(false);
        setOnKeyboardActionListener(this);
        }

    @Override
    public void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        List<Keyboard.Key> keys=getKeyboard().getKeys();
        for (Keyboard.Key key:keys){
            //绘制空白键
            if (key.codes[0]==KEYCODE_EMPTY){
                drawKeyBackGround(key,canvas);
            }else if (key.codes[0]==Keyboard.KEYCODE_DELETE){
                //绘制删除键背景
                drawKeyBackGround(key,canvas);
                //绘制按键图片
                drawkeyDelete(key,canvas);
            }
        }
    }
    private void drawKeyBackGround(Keyboard.Key key, Canvas canvas) {
        ColorDrawable colordrawable=new ColorDrawable(mBgColor);
        colordrawable.setBounds(key.x,key.y,key.x+key.width,key.y+key.height);
        colordrawable.draw(canvas);
    }
    private void drawkeyDelete(Keyboard.Key key, Canvas canvas) {
        int intrinsicWidth=mDeleteDrawable.getIntrinsicWidth();
        int intrinsicHeight=mDeleteDrawable.getIntrinsicHeight();
        int drawWidth=key.width;
        int drawHeight=key.height;
        if(drawWidth<intrinsicWidth){
            drawHeight=drawWidth*intrinsicHeight/intrinsicWidth;
        }
        drawWidth=drawWidth/6;
        drawHeight=drawHeight/6;
        int widthInterval=(key.width-drawWidth)/2;
        int heightInterval=(key.height-drawHeight)/2;

        mDeleteDrawable.setBounds(key.x+widthInterval,key.y+heightInterval,key.x+widthInterval+drawWidth,key.y+heightInterval+drawHeight);
        mDeleteDrawable.draw(canvas);
    }
    //回调接口
    public interface OnKeyPressListener{
        //添加数据回调
        void onInertKey(String text);
        //删除数据回调
        void onDeleteKey();
    }
    private OnKeyPressListener mOnkeyPressListener;
    public void setOnKeyPressListener(OnKeyPressListener li){
        mOnkeyPressListener=li;
    }
    @Override
    public void onKey(int i, int[] ints) {
            if (i==Keyboard.KEYCODE_DELETE&&mOnkeyPressListener!=null){
                //添加数据回调
                mOnkeyPressListener.onDeleteKey();
            }else if (i!=KEYCODE_EMPTY){
                //删除数据回调
                mOnkeyPressListener.onInertKey(Character.toString((char) i));
            }
    }
    @Override
    public void onPress(int i) {

    }

    @Override
    public void onRelease(int i) {

    }



    @Override
    public void onText(CharSequence charSequence) {

    }

    @Override
    public void swipeRight() {
        super.swipeRight();
    }

    @Override
    public void swipeDown() {
        super.swipeDown();
    }

    @Override
    public void swipeLeft() {
        super.swipeLeft();
    }

    @Override
    public void swipeUp() {
        super.swipeUp();
    }
}

调用

因为使用了自定义属性（AS）所以注意添加下面一行代码

  xmlns:app="http://schemas.android.com/apk/res-auto"

布局（包名+类名）

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
  <com.efly.map.keydemo.mytest.NumKeyView
        android:id="@+id/keyboardview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:keyBackground="@color/colorAccent"
        app:gbColor="#eeeeee"
        app:deleteDrawable="@drawable/keyboard_backspace"
        />
    </FrameLayout>

其他部分

上面按键部分就做好了，下面看下自定义按键的中上面的接口回调

public class KeyDemo extends AppCompatActivity {
    private EditText mEditText;
    private NumKeyView mKeyView;
    private Button mButton;
    private LinearLayout mLinearlayout;
    private PopupWindow mPop;
    private LinearLayout mProgressBarLn;
    private View mPopView;
    private Handler mhandler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            mPop.dismiss();
            mKeyView.setVisibility(View.VISIBLE);
            mProgressBarLn.setVisibility(View.INVISIBLE);
            mButton.setText("完成");
        }
    };
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_keyboard);
        init();
        mButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                //点击按钮显示键盘
                mPop.showAtLocation(mLinearlayout, Gravity.BOTTOM,0,0);
            }
        });
        //设置回调，并进行文本的插入与删除
        mKeyView.setOnKeyPressListener(new NumKeyView.OnKeyPressListener() {
            @Override
            public void onInertKey(String text) {
                if(mEditText.getText().length()<6){
                    mEditText.append(text);
                    //文本长度为6时隐藏键盘，显示进度条，一段时间后pop消失
                    if (mEditText.getText().length()==6){
                        mKeyView.setVisibility(View.INVISIBLE);
                        mProgressBarLn.setVisibility(View.VISIBLE);
                        mhandler.sendEmptyMessageDelayed(0x11,4000);
                    }
                }
            }

            @Override
            public void onDeleteKey() {
                int last=mEditText.getText().length();
                if (last>0){
                    //删除最后一位
                mEditText.getText().delete(last-1,last);
                }
            }
        });

    }

    private void init() {
        mEditText= (EditText) findViewById(R.id.et);
        mButton= (Button) findViewById(R.id.bt);
        mLinearlayout= (LinearLayout) findViewById(R.id.ln);
        mPop=new PopupWindow();
        mPopView=LayoutInflater.from(getApplicationContext()).inflate(R.layout.keyboard_pop,null);
        mPop.setContentView(mPopView);
        mPop.setTouchable(true);
        mPop.setFocusable(true);
        mPop.setBackgroundDrawable(new ColorDrawable());
        mPop.setWidth(ViewGroup.LayoutParams.MATCH_PARENT);
        mPop.setHeight(ViewGroup.LayoutParams.WRAP_CONTENT);
        mPop.setAnimationStyle(R.style.PopWindowstyle);
        mProgressBarLn= (LinearLayout) mPopView.findViewById(R.id.progressbar_ln);
        mKeyView= (NumKeyView) mPopView.findViewById(R.id.keyboardview);
    }
}

布局

主布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/ln"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <EditText
        android:id="@+id/et"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <Button
        android:id="@+id/bt"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="点击弹出弹出窗"/>

</LinearLayout>

Pop布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <com.efly.map.keydemo.mytest.NumKeyView
        android:id="@+id/keyboardview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:keyBackground="@color/colorAccent"
        app:gbColor="#eeeeee"
        app:deleteDrawable="@drawable/keyboard_backspace"
        />
    <LinearLayout
        android:id="@+id/progressbar_ln"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="invisible"
        >
        <View
            android:layout_width="match_parent"
            android:layout_height="2px"
            android:background="#000000"
            ></View>
        <ProgressBar
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:layout_margin="20dp"
            style="@android:style/Widget.Holo.ProgressBar.Large"
            />
    </LinearLayout>

</FrameLayout>

Pop动画

弹出

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0"
        android:fromYDelta="100%"
        android:toXDelta="0"
        android:toYDelta="0"
        android:duration="1000"
        ></translate>

</set>

消失

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
    android:toXDelta="0"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toYDelta="100%"
    android:duration="1000"
    ></translate>
</set>

定义动画

   <style name="PopWindowstyle">
       <item name="android:windowEnterAnimation">@anim/showanim</item>
       <item name="android:windowExitAnimation">@anim/dismissanim</item>
   </style>
danfengw
关注
专栏目录
（笔记）Android自定义数字键盘
qq_38603800的博客
09-05 980
前言 最近Android开发中用到了自定义数字键盘，网上找的demo不能满足我的需求，比如删除和插入的时候只能在最后删除和插入，不能通过滑动键盘来移动光标。所以现在完成后把它总结写出来。 概述 主要实现以下功能： （1）只有数字键，包括没有标点符号。 （2）可以在任意点插入和删除数字。 （3）可以通过手指左右滑动键盘来改变光标位置。 （4）输入框右边删除图标和按钮可随...
android 自定义数字软键盘,（笔记）Android自定义数字键盘
weixin_32780623的博客
05-25 2297
前言最近Android开发中用到了自定义数字键盘，网上找的demo不能满足我的需求，比如删除和插入的时候只能在最后删除和插入，不能通过滑动键盘来移动光标。所以现在完成后把它总结写出来。概述主要实现以下功能：(1)只有数字键，包括没有标点符号。(2)可以在任意点插入和删除数字。(3)可以通过手指左右滑动键盘来改变光标位置。(4)输入框右边删除图标和按钮可随着内容有无变化。(5)每三个数字空一格，输入...
android自定义软键盘--纯数字键
03-28
NULL 博文链接：https://yafei.iteye.com/blog/1260283
android数字键盘样式
最新发布
weixin_35846141的博客
08-04 55
Android数字键盘样式开发指南 在移动应用开发中，数字键盘（Number Pad）是用户常用的输入方式之一，尤其在需要输入金额、验证码等场景下，其简洁性和专注性使其成为用户友好的选择。本文将为大家详细介绍如何在Android应用中实现自定义的数字键盘样式，并提供相应的代码示例。 一、数字键盘样式概述 Android系统...
Android-NumberKeyboard自定义数字键盘
08-13
NumberKeyboard 自定义数字键盘
Android进阶之路 - 自定义数字键盘
Android、前端、小程序、后端
02-15 2872
一直以来自定义控件应该是我的短板之一，所以决定今年好好再学习、巩固一下这方面的不足在项目中也经常可以见到的，不过采用当前所写方式，如果要用随机数键盘的话，需要改一些代码，等有机会在优化一下
Android-Android自定义键盘数字键盘和字母键盘
08-13
Android自定义键盘：数字键盘和字母键盘
android自定义数字键盘
02-02
以上就是实现一个简单的Android自定义数字键盘的基本步骤。这个键盘可以根据实际需求进行扩展，例如添加更多特殊功能按钮，如加减乘除符号，或者增加对多行文本的支持。同时，也可以考虑优化键盘的视觉样式，使其与...
Android开发之如何自定义数字键盘详解
01-04
这篇文章是介绍Android中自定义键盘的一些套路，通过定义一个数字键盘为例，本篇的文章语言是基于Kotlin实现的，如果还没有用或者不熟悉该语言的同学，可以自己补习，我之前也写过入门文章。 效果图 github：源码...
Android自定义键盘的实现（数字键盘和字母键盘）
08-29
Android自定义键盘的实现（数字键盘和字母键盘） Android自定义键盘是指在Android系统中创建一个自定义的键盘，满足特定的输入需求。自定义键盘可以根据项目的需求，实现特定的输入方式，例如数字键盘和字母键盘。...
android 纯自定义数字键盘输入
06-30
一个自定义的 android 纯数字键盘输入 demo 源码
android 自定义键盘 随机数字按键 修改键盘字体颜色等功能实现
03-07
此为示例代码，详细讲解请参考博文： http://blog.csdn.net/tangron/article/details/20699331 如对资源内容有疑问，请到博客中留言。 欢迎大家评阅，谢谢
android 自定义数字键盘密码支付（有点类似淘宝，但是更好看
11-08
android 自定义数字键盘密码支付（有点类似淘宝，但是更好看 [注意：本资源来自网络，如有侵权，请联系我删除，谢谢。]
android 自定义 悬浮数字键盘
08-29
android 自定义的数字键盘，方便用户输入，防止不断的弹出系统自带的键盘
Android 自定义数字键盘
Mr.LongFace Blog
11-19 398
使用: new KeyBoardUtil(activity, editText); CarKeyboardView.java public class CarKeyboardView extends KeyboardView { public CarKeyboardView(Context context, AttributeSet attrs) { super(con...
Android自定义数字键盘
weixin_34256074的博客
09-09 307
好久没有写Android的文章了，有两三个月多了吧，刚开始搞微信小程序，后来又开搞ReactNative,现在又兴奋的开搞AI机器学习的东西，感觉挺有意思的，不过AI与其它的东西相比要难很多，需要补很多数学知识，不过我现在学的都还是皮毛，没啥深度，但是我会慢慢深入的，对AI的兴趣比较大，年轻人就要不断的折腾嘛，当然自己的老本行也要搞起啦，饭还是要吃的。 好像说的有点多了，今天的这篇文章是介绍And...
android 自定义数字键盘
06-10
要自定义 Android 数字键盘，你可以使用自定义视图来替代默认的数字键盘。以下是一些步骤： 1.创建一个 XML 文件来定义你的自定义数字键盘的布局。例如，你可以在这个文件中添加按钮和其他视图，来表示数字键盘上的各个按键。 2.创建一个自定义视图类，该类继承自 View 或 ViewGroup，以便可以将你的 XML 布局文件加载到该视图中。 3.为你的自定义视图设置一些属性和方法，以便可以控制数字键盘的行为。例如，你可以添加一个方法来处理按键事件，或者添加一个属性来指定数字键盘的颜色和样式。 4.在你的应用程序中使用你的自定义数字键盘视图。这可以通过在 XML 布局文件中添加你的自定义视图，或者通过在代码中创建一个实例并将其添加到视图层次结构中来完成。 总之，自定义 Android 数字键盘需要你熟悉 Android 开发的基本知识，并且需要一些 Java 编程技巧。如果你不熟悉这些技术，可以参考一些 Android 开发教程或者请一个有经验的开发者来帮助你完成。
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值