时间:2021-05-21
本文介绍了Android 仿微信自定义数字键盘的实现代码,分享给大家,希望对大家有帮助
最终效果:
实现这个自定义键盘的思路很简单:
有了思路,实现起来就不难了。
1. 实现键盘的 xml 布局
网格样式的布局用 GridView 或者 RecyclerView 都可以实现,其实用 GridView 更方便一些,不过我为了多熟悉 RecyclerView 的用法,这里选择用了 RecyclerView。
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <View android:layout_width="match_parent" android:layout_height="2px" android:background="@color/btn_gray"/> <RelativeLayout android:id="@+id/rl_back" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/iv_back_bg" android:padding="10dp"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:src="@mipmap/keyboard_back"/> </RelativeLayout> <View android:layout_width="match_parent" android:layout_height="1px" android:background="@color/btn_gray"/> <android.support.v7.widget.RecyclerView android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/keyboard_bg" android:overScrollMode="never"></android.support.v7.widget.RecyclerView></LinearLayout>RecyclerView 用来实现键盘布局,上面的 RelativeLayout 则是为了实现收起键盘的点击事件。
2. 在代码中实现键盘布局,填充数据、增加点击事件
我们新建类 KeyboardView 继承自 RelativeLayout,关联上面的布局文件,然后做一些初始化操作:对 RecyclerView 填充数据、设置适配器,设置出现和消失的动画效果,写一些会用到的方法等。
public class KeyboardView extends RelativeLayout { private RelativeLayout rlBack; private RecyclerView recyclerView; private List<String> datas; private KeyboardAdapter adapter; private Animation animationIn; private Animation animationOut; public KeyboardView(Context context) { this(context, null); } public KeyboardView(Context context, AttributeSet attrs) { this(context, attrs, 0); } public KeyboardView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(context, attrs, defStyleAttr); } private void init(Context context, AttributeSet attrs, int defStyleAttr) { LayoutInflater.from(context).inflate(R.layout.layout_key_board, this); rlBack = findViewById(R.id.rl_back); rlBack.setOnClickListener(new OnClickListener() { @Override public void onClick(View view) { // 点击关闭键盘 dismiss(); } }); recyclerView = findViewById(R.id.recycler_view); initData(); initView(); initAnimation(); } // 填充数据 private void initData() { datas = new ArrayList<>(); for (int i = 0; i < 12; i++) { if (i < 9) { datas.add(String.valueOf(i + 1)); } else if (i == 9) { datas.add("."); } else if (i == 10) { datas.add("0"); } else { datas.add(""); } } } // 设置适配器 private void initView() { recyclerView.setLayoutManager(new GridLayoutManager(getContext(), 3)); adapter = new KeyboardAdapter(getContext(), datas); recyclerView.setAdapter(adapter); } // 初始化动画效果 private void initAnimation() { animationIn = AnimationUtils.loadAnimation(getContext(), R.anim.keyboard_in); animationOut = AnimationUtils.loadAnimation(getContext(), R.anim.keyboard_out); } // 弹出软键盘 public void show() { startAnimation(animationIn); setVisibility(VISIBLE); } // 关闭软键盘 public void dismiss() { if (isVisible()) { startAnimation(animationOut); setVisibility(GONE); } } // 判断软键盘的状态 public boolean isVisible() { if (getVisibility() == VISIBLE) { return true; } return false; } public void setOnKeyBoardClickListener(KeyboardAdapter.OnKeyboardClickListener listener) { adapter.setOnKeyboardClickListener(listener); } public List<String> getDatas() { return datas; } public RelativeLayout getRlBack() { return rlBack; }}Adapter 里面都是很简单的代码,这里就不贴出了,文章末尾我会给出源码下载地址。
到这里为止,自定义数字键盘基本就算写好了,不过最重要的还是要和 Edittext 结合使用。
3. 与 Edittext 结合使用
1. 禁用系统软键盘
if (Build.VERSION.SDK_INT <= 10) { etInput.setInputType(InputType.TYPE_NULL);} else { getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN); try { Class<EditText> cls = EditText.class; Method setShowSoftInputOnFocus = cls.getMethod("setShowSoftInputOnFocus", boolean.class); setShowSoftInputOnFocus.setAccessible(true); setShowSoftInputOnFocus.invoke(etInput, false); } catch (Exception e) { e.printStackTrace(); }}在网上找了一些方法,但是点击 Edittext 的时候系统软键盘依然会弹出。最后找到了这个方法,利用反射强制不弹出软键盘,效果不错。
2. 处理各个按键的点击事件
@Override public void onKeyClick(View view, RecyclerView.ViewHolder holder, int position) { switch (position) { case 9: // 按下小数点 String num = etInput.getText().toString().trim(); if (!num.contains(datas.get(position))) { num += datas.get(position); etInput.setText(num); etInput.setSelection(etInput.getText().length()); } break; default: // 按下数字键 if ("0".equals(etInput.getText().toString().trim())) { // 第一个数字按下0的话,第二个数字只能按小数点 break; } etInput.setText(etInput.getText().toString().trim() + datas.get(position)); etInput.setSelection(etInput.getText().length()); break; } } @Override public void onDeleteClick(View view, RecyclerView.ViewHolder holder, int position) { // 点击删除按钮 String num = etInput.getText().toString().trim(); if (num.length() > 0) { etInput.setText(num.substring(0, num.length() - 1)); etInput.setSelection(etInput.getText().length()); } }逻辑也非常简单,看代码就明白了。最终的效果就是第一张图的样子。
这个键盘很简单,打算之后写一个模仿微信或者支付宝的支付密码输入布局。
->->->点击下载源码<-<-<-
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
IOS数字键盘左下角添加完成按钮的实现方法实现代码:?12345678910111213141516171819202122232425262728293031
实现了一个自定义的密码输入框和自定义数字键盘,用作用户支付密码设置界面。先上效果图如下,方格样式,以及点击空白处隐藏软键盘。控件实现清单:1)集成于EditTe
台式机的键盘有所区别,也就是没有单独的数字键盘,数字键盘和一些其他功能重合,这样很容易出现按数字时出现其他字符的情况。那么,如何关闭笔记本电脑的数字键盘呢?学会
为了满足用户体验,小编用vue写了一个自定义数字键盘组件,用户体验度还不错。废话不多说,先上效果图吧~效果图具体实现布局排版请输入金额{{money}}789C
电脑键盘有几个键按不出来的原因是你的系统默认开了数字键盘,Shift+NumLK是数字键盘的切换组合键就像台式机键盘的NumLk数字键按钮一样,再重新按回去就可