更新记录

1.0.0（2022-04-11）

  • 输入框自定义键盘
  • 监听键盘出现、消失事件，自动弹出/隐藏系统键盘，实时监听输入文本，监听键盘按键事件
  • 明文/密文切换
  • 切换键盘类型，如纯数字、电话号码、日期等类型键盘
  • 仿微信实现系统键盘和表情包输入切换
  • 设置return键类型

平台兼容性

Android Android CPU类型 iOS
适用版本区间：4.4 - 11.0 armeabi-v7a：未测试，arm64-v8a：未测试，x86：未测试 适用版本区间：9 - 15

原生插件通用使用流程：

  1. 购买插件，选择该插件绑定的项目。
  2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
  4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

功能

  • 输入框自定义键盘
  • 监听键盘出现、消失事件，自动弹出/隐藏系统键盘，实时监听输入文本，监听键盘按键事件
  • 明文/密文切换
  • 切换键盘类型，如纯数字、电话号码、日期等类型键盘
  • 仿微信实现系统键盘和表情包输入切换
  • 设置return键类型

接入步骤

如不了解原生插件接入步骤的同学请参考： https://www.jianshu.com/p/830ccc503e29 或 https://blog.csdn.net/wenrisheng/article/details/124057700

组件


        <wrs-customKeyboardTextField ref='txtField' :style="'width:'+width+'px;height:'+height+'px;'"
            @beginEditing="beginEditing" @endEditing="endEditing" @changeEditing="changeEditing"
            @onLoadView="onLoadView" @keyboardWillShow="keyboardWillShow" @keyboardWillHide="keyboardWillHide"
            >

事件

  • beginEditing 开始编辑
  • endEditing 结束编辑
  • changeEditing 输入文字改变
  • onLoadView 控件视图加载，一般调用API需要在此事件里或之后才能调用
  • keyboardWillShow 弹出键盘
  • keyboardWillHide 收起键盘
  • onKey 键盘按键事件,android和iOS返回的数据不一样，需要各自适配，数据都在event.detail里

方法

  • setText 设置文本

                this.$refs.txtField.setText({
                    text: this.text
                });
  • setPlaceholder 设置占位符

                this.$refs.txtField.setPlaceholder({
                    "text": "请您输入姓名"
                });
  • setTextColor 设置文字颜色

                // 设置文字颜色
                this.$refs.txtField.setTextColor({
                    "color": "#ff0000"
                });
  • setTextFont 设置字体大小

                // 设置字体大小
                this.$refs.txtField.setTextFont({
                    "font": 40
                });
  • setTextAligment 设置文本对齐方式

                // 设置文字对齐方式
                var textAligment = 0;
                switch (uni.getSystemInfoSync().platform) {
                    case 'android':
                        // 3: LEFT
                        // 17: CENTER
                        // 5: RIGHT
                        textAligment = 17;
                        break;
                    case 'ios':
                        // 0:NSTextAlignmentLeft
                        // 1:NSTextAlignmentCenter
                        // 2:NSTextAlignmentRight
                        // 3:NSTextAlignmentJustified
                        // 4:NSTextAlignmentNatural
                        textAligment = 1;
                        break;
                }
                this.$refs.txtField.setTextAligment({
                    "textAligment": textAligment
                });
  • setKeyboardType 设置键盘类型

                // 设置系统键盘类型
                var keyboardType = 0;
                switch (uni.getSystemInfoSync().platform) {
                    case 'android':
                        // int TYPE_CLASS_DATETIME = 4; // 日期时间
                        // int TYPE_CLASS_NUMBER = 2; // 数字文本
                        // int TYPE_CLASS_PHONE = 3; // 电话号码
                        // int TYPE_CLASS_TEXT = 1; // 普通文本
                        // int TYPE_DATETIME_VARIATION_DATE = 16;
                        // int TYPE_DATETIME_VARIATION_NORMAL = 0;
                        // int TYPE_DATETIME_VARIATION_TIME = 32;
                        // int TYPE_MASK_CLASS = 15;
                        // int TYPE_MASK_FLAGS = 16773120;
                        // int TYPE_MASK_VARIATION = 4080;
                        // int TYPE_NULL = 0; // 不指定类型
                        // int TYPE_NUMBER_FLAG_DECIMAL = 8192;// 输入类型为小数数字，允许十进制小数点提供分数值。
                        // int TYPE_NUMBER_FLAG_SIGNED = 4096;//输入类型为数字是带符号的，允许在开头带正号或者负号
                        // int TYPE_NUMBER_VARIATION_NORMAL = 0;
                        // int TYPE_NUMBER_VARIATION_PASSWORD = 16;
                        // int TYPE_TEXT_FLAG_AUTO_COMPLETE = 65536;
                        // int TYPE_TEXT_FLAG_AUTO_CORRECT = 32768;
                        // int TYPE_TEXT_FLAG_CAP_CHARACTERS = 4096;
                        // int TYPE_TEXT_FLAG_CAP_SENTENCES = 16384;
                        // int TYPE_TEXT_FLAG_CAP_WORDS = 8192;
                        // int TYPE_TEXT_FLAG_IME_MULTI_LINE = 262144;
                        // int TYPE_TEXT_FLAG_MULTI_LINE = 131072;
                        // int TYPE_TEXT_FLAG_NO_SUGGESTIONS = 524288;
                        // int TYPE_TEXT_VARIATION_EMAIL_ADDRESS = 32;
                        // int TYPE_TEXT_VARIATION_EMAIL_SUBJECT = 48;
                        // int TYPE_TEXT_VARIATION_FILTER = 176;
                        // int TYPE_TEXT_VARIATION_LONG_MESSAGE = 80;
                        // int TYPE_TEXT_VARIATION_NORMAL = 0;
                        // int TYPE_TEXT_VARIATION_PASSWORD = 128;
                        // int TYPE_TEXT_VARIATION_PERSON_NAME = 96;
                        // int TYPE_TEXT_VARIATION_PHONETIC = 192;
                        // int TYPE_TEXT_VARIATION_POSTAL_ADDRESS = 112;
                        // int TYPE_TEXT_VARIATION_SHORT_MESSAGE = 64;
                        // int TYPE_TEXT_VARIATION_URI = 16;
                        // int TYPE_TEXT_VARIATION_VISIBLE_PASSWORD = 144;
                        // int TYPE_TEXT_VARIATION_WEB_EDIT_TEXT = 160;
                        // int TYPE_TEXT_VARIATION_WEB_EMAIL_ADDRESS = 208;
                        // int TYPE_TEXT_VARIATION_WEB_PASSWORD = 224;
                        keyboardType = 2;
                        break;
                    case 'ios':
                        // 0:UIKeyboardTypeDefault,                // Default type for the current input method.
                        // 1:UIKeyboardTypeASCIICapable,           // Displays a keyboard which can enter ASCII characters
                        // 2:UIKeyboardTypeNumbersAndPunctuation,  // Numbers and assorted punctuation.
                        // 3:UIKeyboardTypeURL,                    // A type optimized for URL entry (shows . / .com prominently).
                        // 4:UIKeyboardTypeNumberPad,              // A number pad with locale-appropriate digits (0-9, ۰-۹, ०-९, etc.). Suitable for PIN entry.
                        // 5:UIKeyboardTypePhonePad,               // A phone pad (1-9, *, 0, #, with letters under the numbers).
                        // 6:UIKeyboardTypeNamePhonePad,           // A type optimized for entering a person's name or phone number.
                        // 7:UIKeyboardTypeEmailAddress,           // A type optimized for multiple email address entry (shows space @ . prominently).
                        // 8:UIKeyboardTypeDecimalPad API_AVAILABLE(ios(4.1)),   // A number pad with a decimal point.
                        // 9:UIKeyboardTypeTwitter API_AVAILABLE(ios(5.0)),      // A type optimized for twitter text entry (easy access to @ #)
                        // 10:UIKeyboardTypeWebSearch API_AVAILABLE(ios(7.0)),    // A default keyboard type with URL-oriented addition (shows space . prominently).
                        // 11:UIKeyboardTypeASCIICapableNumberPad API_AVAILABLE(ios(10.0)), // A number pad (0-9) that will always be ASCII digits.
                        // 12:UIKeyboardTypeAlphabet = UIKeyboardTypeASCIICapable, // Deprecated
                        keyboardType = 5;
                        break;
                }
                this.$refs.txtField.setKeyboardType({
                    "keyboardType": keyboardType
                });
  • setSecureTextEntry 设置密文显示

this.$refs.txtField.setSecureTextEntry();
  • setNoSecureTextEntry 设置明文显示

this.$refs.txtField.setNoSecureTextEntry();
  • getText 获取当前文本

                var resp = this.$refs.txtField.getText();
                if(isString(resp)) {
                    resp = JSON.parse(resp);
                }
                this.showMsg("当前输入值:" + resp.text);
  • respondSystemKeyboard 是否响应系统键盘

                this.$refs.txtField.respondSystemKeyboard({
                    respond: false // false:点击输入框不会弹出系统键盘   true:点击输入框会弹出系统键盘
                });
  • setFocus 是否获取焦点，仅对Android有效

                var params = {};
                 params.focus = this.isFocus;
                this.$refs.txtField.setFocus(params);
  • showSystemKeyboard 是否显示系统键盘

                    this.$refs.txtField.showSystemKeyboard({
                        show: true // false:主动隐藏系统键盘   true:主动弹出弹出系统键盘
                    });
  • setReturnKeyType 设置Return键类型，仅对iOS有效

//    0:UIReturnKeyDefault,
//    1:UIReturnKeyGo,
//    2:UIReturnKeyGoogle,
//    3:UIReturnKeyJoin,
//    4:UIReturnKeyNext,
//    5:UIReturnKeyRoute,
//    6:UIReturnKeySearch,
//    7:UIReturnKeySend,
//    8:UIReturnKeyYahoo,
//    9:UIReturnKeyDone,
//    10:UIReturnKeyEmergencyCall,
//    11:UIReturnKeyContinue API_AVAILABLE(ios(9.0))
    UIReturnKeyContinue API_AVAILABLE(ios(9.0))

                    this.$refs.txtField.setReturnKeyType({
                        returnKeyType: 0 
                    });

支持定制，联系方式 QQ:252797991

如果觉得可以就点个👍吧，欢迎粉丝收藏，土豪打赏，您的关注就是我们创作的动力！

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

插件不采集任何数据

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

评论列表 撰写评论 向官方投诉
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...