（笔记）Android自定义数字键盘

前言

最近Android开发中用到了自定义数字键盘，网上找的demo不能满足我的需求，比如删除和插入的时候只能在最后删除和插入，不能通过滑动键盘来移动光标。所以现在完成后把它总结写出来。

概述

主要实现以下功能：
（1）只有数字键，包括没有标点符号。
（2）可以在任意点插入和删除数字。
（3）可以通过手指左右滑动键盘来改变光标位置。
（4）输入框右边删除图标和按钮可随着内容有无变化。
（5）每三个数字空一格，输入框最多输入13个字符（包括空格）。

先上运行效果（请忽略UI -_-）：

keyboard.gif

步骤：
1、新建一个KeyboardView.java文件。用来自定义所需要的键盘。
首先初始化绑定布局文件。

private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        LayoutInflater.from(context).inflate(R.layout.layout_key_board, this);
        recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
        rl_back=findViewById(R.id.rl_back);
        rl_back.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) { // 点击关闭键盘
                dismiss();
            }
        });
        initData();
        initView();
        initAnimation();
    }

填充数据(如果需要标点符号，则在i==9中填充即可)

private void initData() {
        keyboardWords = new ArrayList<>();
        for (int i = 0; i < 12; i++) {
            if (i < 9) {
                keyboardWords.add(String.valueOf(i + 1));
            } else if (i == 9) {
                keyboardWords.add("");
            } else if (i == 10) {
                keyboardWords.add("0");
            } else {
                keyboardWords.add("");
            }
        }
    }

设置适配器

 private void initView() {
        int spanCount = 12;
        recyclerView.setLayoutManager(new GridLayoutManager(getContext(), 3));
        recyclerView.setNestedScrollingEnabled(false);
        recyclerView.addItemDecoration(new SpaceItemDecoration(spanCount));
        adapter = new KeyboardAdapter(getContext(), keyboardWords);
        recyclerView.setAdapter(adapter);
    }

对键盘的操作

//判断软键盘的状态
 public boolean isVisible() {
       if (getVisibility() == VISIBLE) {
           return true;
       }
       return false;
   }       
//弹出软键盘      
public void show() {
       startAnimation(animationIn);
       setVisibility(VISIBLE);
   }     
//关闭软键盘     
public void dismiss() {
       if (isVisible()) {
           startAnimation(animationOut);
           setVisibility(GONE);
       }
   }

2、Adapter操作。

    private Context context;
    private List datas;
    private OnKeyboardClickListener listener;

    public KeyboardAdapter(Context context, List datas) {
        this.context = context;
        this.datas = datas;
    }

    @Override
    public KeyboardHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(R.layout.item_key_board, parent, false);
        KeyboardHolder holder = new KeyboardHolder(view);
        setListener(holder);
        return holder;
    }

    private void setListener(final KeyboardHolder holder) {
        holder.tvKey.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (listener != null) {
                    if (holder.getAdapterPosition() != 9) {
                        listener.onKeyClick(view, holder, holder.getAdapterPosition());
                    }
                }
            }
        });
        holder.rlDel.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (listener != null) {
                    listener.onDeleteClick(view, holder, holder.getAdapterPosition());
                }
            }
        });
    }

    @Override
    public void onBindViewHolder(KeyboardHolder holder, int position) {
        if (position == 9) {
            holder.setVisibility(false);
        } else if (position == 11) {
            holder.rlDel.setVisibility(View.VISIBLE);
            holder.tvKey.setVisibility(View.GONE);
        } else {
            holder.tvKey.setText(datas.get(position));
        }
    }

    @Override
    public int getItemCount() {
        return datas == null ? 0 : datas.size();
    }

    class KeyboardHolder extends RecyclerView.ViewHolder {

        public TextView tvKey;
        public RelativeLayout rlDel;
        private View convertView;

        public KeyboardHolder(View itemView) {
            super(itemView);
            convertView = itemView;
            tvKey = itemView.findViewById(R.id.tv_key);
            rlDel = itemView.findViewById(R.id.rl_del);
        }

        public View getconvertView() {
            return convertView;
        }

        public void setVisibility(boolean b) {
            RecyclerView.LayoutParams param = (RecyclerView.LayoutParams) itemView.getLayoutParams();
            if (b) {
                param.height = LinearLayout.LayoutParams.WRAP_CONTENT;
                param.width = LinearLayout.LayoutParams.MATCH_PARENT;
                itemView.setVisibility(View.VISIBLE);
            } else {
                itemView.setVisibility(View.GONE);
                param.height = 0;
                param.width = 0;
            }
            itemView.setLayoutParams(param);
        }
    }

    public interface OnKeyboardClickListener {

        void onKeyClick(View view, RecyclerView.ViewHolder holder, int position);

        void onDeleteClick(View view, RecyclerView.ViewHolder holder, int position);
    }

    public void setOnKeyboardClickListener(OnKeyboardClickListener listener) {
        this.listener = listener;
    }
}

3、在Activity中的运用。
关闭系统键盘

private void enableSystemKeyboard() {
        getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN);
        try {
            Class cls = EditText.class;
            Method setShowSoftInputOnFocus = cls.getMethod("setShowSoftInputOnFocus", boolean.class);
            setShowSoftInputOnFocus.setAccessible(true);
            setShowSoftInputOnFocus.invoke(videoIdEt, false);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }   

键盘数字按钮的点击事件,并且获取输入当前光标位置

 @SuppressLint("SetTextI18n")
    @Override
    public void onKeyClick(View view, RecyclerView.ViewHolder holder, int position) {
        String editText = videoIdEt.getText().toString();
        switch (position) {
            case 9:
                break;
            default:
                //获取当前光标位置
                int index = videoIdEt.getSelectionStart();
                if (index != videoIdEt.getText().length()) {
                    //在光标处插入数字
                    String inputEditText = keyboardNumbers.get(position);
                    Log.d(TAG, "inputEditText:" + inputEditText);
                    videoIdEt.getText().insert(index, inputEditText);
                } else {
                    videoIdEt.setText(videoIdEt.getText().toString().trim() + keyboardNumbers.get(position));
                    videoIdEt.setSelection(videoIdEt.getText().length());
                }
                if (videoIdEt.getText().length() > 0) {
                 findViewById(R.id.ai_long_tv_confirm).setBackgroundResource(R.drawable.bg_determine_text);
                    Drawable drawable = getResources().getDrawable(R.drawable.ic_delete1);    
                  //设置 ClickableEditText中只显示左边图标，删除图标可见
                    videoIdEt.setCompoundDrawablesWithIntrinsicBounds(mDrawable, null, drawable,null);
                }
                break;
        }
    }          

手指触摸事件:获取手指按下和滑动停止的位置。将结果传给手势监听。

private View.OnTouchListener onTouchListener = new View.OnTouchListener() {
        @RequiresApi(api = Build.VERSION_CODES.ECLAIR)
        @SuppressLint("ClickableViewAccessibility")
        @Override
        public boolean onTouch(View view, MotionEvent motionEvent) {
            if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
                Log.d(TAG, "MotionEvent.ACTION_DOWN");
            }
            if (motionEvent.getAction() == MotionEvent.ACTION_UP) {
                Log.d(TAG, "MotionEvent.ACTION_UP");
                refreshStartPoint = true;
            }
            if (motionEvent.getAction() == MotionEvent.ACTION_MOVE) {
                if (refreshStartPoint) {
                    startPointEvent = motionEvent.getX(0);
                    curatorIndex = videoIdEt.getSelectionStart();
                }
                refreshStartPoint = false;
                stopPointEvent = motionEvent.getX();
                Log.d(TAG, "MotionEvent.ACTION_MOVE");
            }
            return mDetector.onTouchEvent(motionEvent);
        }
    };   

用户手势的监测。计算开始和停止滑动距离的大小(滑动前和滑动后的距离),通过计算滑动距离来计算光标移动多少，并通过距离的正负来判断滑动的方向，从而达到在键盘上滑动来控制光标移动的目的。

 @RequiresApi(api = Build.VERSION_CODES.CUPCAKE)
    private void initGestureDetector() {
        mDetector = new GestureDetector(this, new GestureDetector.OnGestureListener() {
            @Override
            public boolean onDown(MotionEvent motionEvent) {
                Log.d(TAG, "onDown");
                return true;
            }

            @Override
            public void onShowPress(MotionEvent motionEvent) {
                Log.d(TAG, "onShowPress");
            }

            @Override
            public boolean onSingleTapUp(MotionEvent motionEvent) {
                Log.d(TAG, "onShowPress");
                return false;
            }

            @Override
            public boolean onScroll(MotionEvent motionEvent, MotionEvent motionEvent1, float v, float v1) {
                DisplayMetrics displayMetrics = getResources().getDisplayMetrics();
                mScreenWidth = displayMetrics.widthPixels;
                float x = stopPointEvent - startPointEvent;
                float newPercent = Math.abs(x) / mScreenWidth;
                int range = (int) ((videoIdEt.getText().length()) * newPercent);
                int newIndex;
                if (x > 0) {
                    newIndex = curatorIndex + range;
                    if (curatorIndex == videoIdEt.getText().length()) {
                        videoIdEt.setSelection(curatorIndex);
                    }
                    if (newIndex > videoIdEt.getText().length()) {
                        videoIdEt.setSelection(videoIdEt.getText().length());
                    } else {
                        videoIdEt.setSelection(newIndex);
                    }
                } else {
                    newIndex = curatorIndex - range;
                    if (curatorIndex == 0) {
                        videoIdEt.setSelection(curatorIndex);
                    }
                    if (newIndex < 0) {
                        videoIdEt.setSelection(0);
                    } else {
                        videoIdEt.setSelection(newIndex);
                    }
                }
                return false;
            }

            @Override
            public void onLongPress(MotionEvent motionEvent) {
                Log.d(TAG, "onLongPress");
            }

            @Override
            public boolean onFling(MotionEvent motionEvent, MotionEvent motionEvent1, float v, float v1) {
                // startPointEvent=motionEvent1;
                Log.d(TAG, "onFling: " + "motionEvent:" + motionEvent + "motionEvent1" + motionEvent1);
                return false;
            }
        });
    }    

接着我们实现每三个数字输入一个空格。通过对ClickableEditText的监听来达到这一目的。

private TextWatcher watcher = new TextWatcher() {
        @Override
        public void beforeTextChanged(CharSequence charSequence, int i, int i1, int i2) {

        }

        @Override
        public void onTextChanged(CharSequence charSequence, int start, int before, int i2) {
            if (isTextChanging) {
                isTextChanging = false;
                return;
            }
            isTextChanging = true;
            String result = "";
            String newStr = charSequence.toString();
            newStr = newStr.replace(" ", "");
            int index = 0;
            while ((index + 3) < newStr.length()) {
                result += (newStr.substring(index, index + 3) + " ");
                index += 3;
            }
            result += (newStr.substring(index, newStr.length()));
            int i = videoIdEt.getSelectionStart();
            videoIdEt.setText(result);
            try {
                if (i % 4 == 0 && before == 0) {
                    if (i + 1 <= result.length()) {
                        videoIdEt.setSelection(i + 1);
                    } else {
                        videoIdEt.setSelection(result.length());
                    }
                } else if (before == 1 && i < result.length()) {
                    videoIdEt.setSelection(i);
                } else if (before == 0 && i < result.length()) {
                    videoIdEt.setSelection(i);
                } else {
                    videoIdEt.setSelection(result.length());
                }
            } catch (Exception e) {
                e.printStackTrace();
            }
        }

        @Override
        public void afterTextChanged(Editable editable) {

        }
    };

对右下角删除按钮的监听，只能删除一个一个删除，不能一下删除所输入的内容

 @Override
    public void onDeleteClick(View view, RecyclerView.ViewHolder holder, int position) {
        int currentIndex = videoIdEt.getSelectionStart();
        if (currentIndex > 0) {
            videoIdEt.getText().delete(currentIndex - 1, currentIndex);
            if (videoIdEt.getText().length() == 0) {
               //设置 ClickableEditText中只显示左边图标，删除图标不可见
                videoIdEt.setCompoundDrawablesWithIntrinsicBounds(mDrawable, null, null,null);
                findViewById(R.id.ai_long_tv_confirm).setBackgroundResource(R.drawable.bg_determine_disable);
            }
        }
    }

输入框右边删除按钮的点击事件，点击可消除所有输入的内容。

   @Override
    public void onDrawableRightClick(View view) {
        switch (view.getId()) {
            case R.id.ai_long_et_video_code:
                videoIdEt.getText().clear();
                 //设置 ClickableEditText中只显示左边图标，删除图标不可见
                videoIdEt.setCompoundDrawablesWithIntrinsicBounds(mDrawable, null, null,null);           
        findViewById(R.id.ai_long_tv_confirm).setBackgroundResource(R.drawable.bg_determine_disable);
                break;
            default:
                break;
        }
    }

结论

以上就是整个项目的实现过程，注意一点，ClickableEditText是自定义的一个EditText，由于使用ConstraintLayout，在输入框的前后两端加按钮，是为了可以点击右边删除按钮能删除所有输入的内容所写。