AppCan文档中心-uexChatKeyboard
 
下载文档

uexChatKeyboard
更新时间:2016-10-21

1、简介

1.1、说明

提供聊天输入相关的功能,集成了表情、拍照、从相册选取图片等分享功能,支持通过关键字插入内容如评论中@好友功能,只需简单的widget配置即可实现自定义表情集和分享选项内容。具体配置使用详见各接口说明。
注:使用安卓版本插件时需要打包选择压缩模式,不适用于平移模式,如果个别页面需要使用平移模式,可以根据需要动态切换键盘模式,调用此设置键盘模式接口。

1.2、UI展示

1.3、开源源码

插件测试用例与源码下载:点击 插件中心至插件详情页 (插件测试用例与插件源码已经提供)

2、API概览

2.1、方法

open 打开聊天输入

uexChatKeyboard.open(viewInfo)

说明:

在界面的底部打开聊天输入框界面
注:使用该插件需要打包选择压缩模式,不适用于平移模式。
参数:

  1. var viewInfo={
  2. "emojicons":,//(必选)自定义表情配置文件的路径res协议,详见配置如下
  3. "shares":,//(必选)自定义分享选项配置文件的路径res协议,详见配置如下
  4. "placeHold":,//(可选)输入框提示语
  5. "touchDownImg": ,//(可选)录音按钮按下时提示控件的背景
  6. "dragOutsideImg": ,//(可选)按下录音按钮后滑动到录音范围之外时提示控件的背景
  7. "textColor": ,//(可选)录音时间文字颜色
  8. "textSize": ,//(可选)录音时间文字大小
  9. "sendBtnbgColorUp": ,//(可选)发送按钮正常时控件的背景
  10. "sendBtnbgColorDown": ,//(可选)发送按钮按下时控件的背景
  11. "sendBtnText": ,//(可选)发送按钮展示文字
  12. "sendBtnTextSize": ,//(可选)发送按钮文字大小
  13. "sendBtnTextColor": ,//(可选)发送按钮文字颜色
  14. "keywords": ['','',''....],//(可选)输入监听关键字(字符串数组)
  15. "inputMode"://(可选) 输入框默认输入方式,0-文字输入;1-语音输入。默认为0。
  16. }

参数emojicons的自定义表情配置文件为:”res://emojicons/emojicons.xml”res协议路径,详细配置步骤:

1、在widget的wgtRes目录下创建emojicons目录;
2、 在emojicons中放入表情以及删除的图片资源,表情的默认命名格式:
ace_emoji_1,删除的默认命名格式:ace_emoji_delete.png;
3、 在emojicons中创建emojicons.xml文件,格式如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <emojicons delete="ace_emoji_delete.png ">
  3. <key>[微笑]</key>
  4. <string> ace_emoji_1.png</string>
  5. <key>[憋嘴]</key>
  6. <string> ace_emoji_2.png</string>
  7. </emojicons>
  • delete:删除对应的图片名;
  • key:表情对应的文字;
  • string:表情对应的图片名;
  • 表情目录、图片名以及配置文件名都可以自定义命名,但是必须保
    证配置文件中的图片名与资源图片对应。

参数shares的自定义分享选项配置文件为:”res://emojicons/emojicons.xml”res协议路径,详细配置步骤:

1、在widget的wgtRes目录下创建shares目录;
2、在shares中放入分享选项的图片资源,图片的默认命名格式:
ace_share_1;
3、 在shares中创建shares.xml文件,格式如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <shares>
  3. <key>拍照</key>
  4. <string>ace_share_1.png</string>
  5. <key>图片</key>
  6. <string>ace_share_2.png</string>
  7. <key>位置</key>
  8. <string>ace_share_3.png</string>
  9. </shares>
  • key:分享选项显示的文字
  • string:分享选项对应的图片名说明;
  • 分享目录、图片名以及配置文件名都可以自定义命名,但是必须保
    证配置文件中的图片名与资源图片对应。

平台支持:

Android 2.2+
iOS 6.0+

版本支持:
3.0.0+

示例:

  1. var jsonstr ={
  2. "emojicons": "res://emojicons/emojicons.xml",
  3. "shares": "res://shares/shares.xml",
  4. "placeHold": "请输入内容",
  5. "touchDownImg": "res://1.png",
  6. "dragOutsideImg": "res://2.png",
  7. "textColor": "#FFF",
  8. "textSize": "15.5",
  9. "sendBtnbgColorUp": "#45C01A",
  10. "sendBtnbgColorDown": "#298409",
  11. "sendBtnText": "发送",
  12. "sendBtnTextSize": "15.5",
  13. "sendBtnTextColor": "#FFF",
  14. "keywords": ['@','☺','正益'],
  15. "inputMode":1
  16. };
  17. uexChatKeyboard.open(jsonstr);

close 关闭聊天输入

uexChatKeyboard.close()

说明:

关闭聊天输入

参数:

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

3.0.0+

示例:

  1. uexChatKeyboard.close();

getInputBarHeight 获取输入工具条高度

uexChatKeyboard.getInputBarHeight();

说明

获取输入工具条高度
通过回调cbGetInputBarHeight返回结果

参数:

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

3.0.7+

示例:

  1. uexChatKeyboard.getInputBarHeight();

hideKeyboard 收起键盘

uexChatKeyboard.hideKeyboard()

说明:

收起键盘。

参数:

平台支持:

Android2.2+
iOS6.0+

版本支持:

Android 3.0.10+
iOS 3.0.10+

示例:

  1. uexChatKeyboard.hideKeyboard();

changeWebViewFrame 改变webview的高度以适应弹出的键盘

uexChatKeyboard.changeWebViewFrame(height)

说明:

收到 onKeyBoardShow回调,并且status为1时调用这个方法传入当前div(表示文本输入框的高度)的高度,键盘会根据高度将聊天内容推上去

参数:

参数名称 参数类型 是否必选 说明
height Number div的高度

平台支持:

iOS6.0+

版本支持:

iOS 3.0.10+

示例:

  1. uexChatKeyboard.changeWebViewFrame(600);

insertTextByKeyword 通过关键字插入内容

uexChatKeyboard.insertTextByKeyword(jsonStr)

说明:
通过关键字插入内容功能。调用此接口之前先监听,监听方法onInputKeyword
例子:
@好友功能,收到关键字“@”的监听uexChatKeyboard.onInputKeyword之后,选择好友。选择完毕后调用此接口添加好友到关键字@后面,或替换原有@字符。

参数:

参数名称 参数类型 是否必选 说明
jsonStr String 插入信息参数,json格式如下:
  1. var jsonStr = {
  2. 'keyword' : ,//关键字
  3. 'insertText' : ,//插入的数据
  4. 'insertTextColor' : ,//插入的数据字体颜色
  5. 'isReplaceKeyword' : // 是否替换掉关键字,0:不替换;1:替换
  6. };
参数名称 参数类型 是否必选 说明
keyword String 关键字
insertText String 插入的数据
insertTextColor String 插入的数据字体颜色,此参数不支持iOS
isReplaceKeyword String 是否替换掉关键字,0:不替换;1:替换

平台支持:

Android,iOS

示例:

  1. var params = {
  2. keyword : '@',
  3. insertText : '@守望宝宝',
  4. insertTextColor : '#FF0000',
  5. isReplaceKeyword : 1
  6. };
  7. uexChatKeyboard.insertTextByKeyword(JSON.stringify(params));

2.2、回调方法

cbGetInputBarHeight 获取输入工具条高度的回调方法

uexChatKeyboard.cbGetInputBarHeight(data);

说明

getInputBarHeight获取输入工具条高度的回调方法

参数:

  1. var data={
  2. "height":100
  3. }

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

iOS 3.0.4+
Android 3.0.7+

示例

  1. uexChatKeyboard.cbGetInputBarHeight = function(json) {
  2. alert(json);
  3. }

2.3、监听方法

onCommit 完成输入的监听方法

uexChatKeyboard.onCommit(data)

说明

完成输入的监听方法

参数:
:

  1. var data={
  2. "emojiconsText": "[微笑] [憋嘴]"
  3. }

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

3.0.0+

示例

  1. uexChatKeyboard.onCommit = function(data){
  2. alert(data);
  3. }

onShareMenuItem 点击分享里选项的监听方法

uexChatKeyboard.onShareMenuItem(data)

说明

点击分享里选项的监听方法

参数:

参数名称 参数类型 是否必选 说明
data Number 分享里各选项对应的位置

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

3.0.0+

示例

  1. uexChatKeyboard.onShareMenuItem = function(data){
  2. alert(data);
  3. }

onVoiceAction 录音按钮的监听方法

uexChatKeyboard.onVoiceAction(data)

说明

录音按钮的监听方法

参数:

  1. var data={
  2. "status":,//录音按钮的状态,0-----开始录音,1-----录音完成,-1-----取消录音
  3. }

平台支持:

Android 2.2+
iOS 6.0+

版本支持:

3.0.0+

示例

  1. uexChatKeyboard.onVoiceAction = function(data){
  2. var json = JSON.parse(data);
  3. alert(json.status);
  4. //alert(data);
  5. }

onKeyBoardShow 键盘弹出或收起时的监听方法

uexChatKeyboard.onKeyBoardShow(json)

参数:

  1. var json = {
  2. "status":"1"
  3. }
参数名称 参数类型 是否必选 说明
status Number 键盘状态 0-收起 1-弹出

支持平台:
Android2.2+
iOS6.0+

版本支持:

Android 3.0.10+
iOS 3.0.10+

示例:

  1. function onKeyBoardShow(data) {
  2. alert(data);
  3. }
  4. window.uexOnload = function(){
  5. uexChatKeyboard.onKeyBoardShow = onKeyBoardShow;
  6. }

onCommitJson 点击发送的监听方法

uexChatKeyboard.onCommitJson(json)

参数:

参数名称 参数类型 是否必选 说明
json JSON 回调数据json格式如下
  1. var json = {
  2. emojiconsText:,//输入框里的内容
  3. insertTexts:[//插入过的关键字
  4. {
  5. insertText:,//插入的内容
  6. insertTextColor:,//插入内容的颜色
  7. start:,//插入的内容开始位置
  8. end:,//插入的内容结束位置
  9. },
  10. ...
  11. ]
  12. }
参数名称 参数类型 是否必选 说明
emojiconsText String 输入框里的内容
insertTexts Array 插入过的关键字数组
insertText String 插入的内容
insertTextColor String 插入内容的颜色
start String 插入的内容开始位置
end String 插入的内容结束位置

支持平台:
Android2.2+
iOS6.0+

版本支持:

Android 3.0.10+
iOS 3.0.10+

示例:

  1. function onCommitJson(data) {
  2. alert(data);
  3. }
  4. window.uexOnload = function(){
  5. uexChatKeyboard.onCommitJson = onCommitJson;
  6. }

onInputKeyword 编辑框输入监测的关键字之后的监听方法

uexChatKeyboard.onInputKeyword(json)

参数:

参数名称 参数类型 是否必选 说明
json JSON Object类型 回调数据json格式如下
  1. var json = {
  2. keyword:,//触发的关键字
  3. }
参数名称 参数类型 是否必选 说明
keyword String 触发的关键字

示例:

  1. window.uexOnload = function(){
  2. uexChatKeyboard.onInputKeyword = function(json) {
  3. var keyword = json.keyword;
  4. if(keyword == '@'){
  5. var params = {
  6. keyword : '@',
  7. insertText : '@守望宝宝',
  8. isReplaceKeyword : 1
  9. };
  10. uexChatKeyboard.insertTextByKeyword(JSON.stringify(params));
  11. }
  12. }
  13. }

3、更新历史

iOS

API版本:uexChatKeyboard-3.0.29

最近更新时间:2016-10-19

历史发布版本 更新内容
3.0.29 onAt相关功能改为onInputKeyword
3.0.28 添加onAt监听
3.0.27 IDE证书更新
3.0.26 修改长按收回键盘,适配状态栏,表情放大
3.0.25 修改键盘跟输入框弹出不一致问题,修改键盘遮挡最后一条消息,修改键盘弹出时聊天内容滚动遮挡bug
3.0.24 修改键盘+号切换异常,修改发送按钮自定义
3.0.23 修改发送消息遮挡、修改录音从0开始
3.0.22 修改回调对象引用类型
3.0.21 添加IDE支持
3.0.20 修改键盘弹出时页面弹动
3.0.19 修复确定按钮背景图异常的bug
3.0.18 修复自定义功能按钮和表情按钮重新打开会弹出键盘的bug
3.0.17 修改收回键盘遮挡数据
3.0.16 修改点击发送不收回键盘
3.0.15 修复messageShareView可能会遮住文字的bug
3.0.14 修复插入表情时默认插入到最后的问题,修复在iPhone6 Plus上的显示问题
3.0.13 修复finishWidget时的崩溃问题,修复长按输入框显示放大镜时可以看见表情按钮的问题
3.0.12 修复关闭输入法后窗口显示不正常的bug
3.0.11 修复一个在iOS9下可能导致APP崩溃的bug
3.0.10 open接口新增参数inputMode默认输入方式
3.0.9 修复直接输入表情时输入框变形问题.修复联系点击录音按钮录音提示无法关闭问题
3.0.8 修复输入内容过多时的显示问题
3.0.7 新增方法onCommitJson回调,onCommit方法保持不变
3.0.6 onCommit直接回调json对象,新增方法changeWebViewFrame
3.0.5 新增API:隐藏键盘
3.0.4 新增API:获取键盘高度
3.0.3 open方法参数改为json类型,可以设置默认文字,自定义语音输入时的提示框
3.0.2 修复语音提示图片不显示的问题
3.0.1 onCommit接口的参数使用json格式
3.0.0 EUExChatKeyboard插件

Android

API版本:uexChatKeyboard-3.0.15

最近更新时间:2016-5-10

历史发布版本 更新内容
3.0.15 解决某些机型收不到getInputBarHeight回调的问题
3.0.14 修复部分机型显示不全的问题,修复关闭白屏问题,修复部分机型屏幕宽度获取不对的问题,修复键盘遮蔽问题有时候页面推动过多的问题
3.0.13 优化点击非键盘区域收回键盘时的判断机制,代码逻辑调整优化.
3.0.12 修正键盘弹出效果,修正声音相关回调问题,修正关闭崩溃错误,添加自定义参数,部分代码优化
3.0.11 去掉LocalActivityManager
3.0.10 open接口新增参数inputMode默认输入方式
3.0.9 修改EditText和webview中的输入框抢焦点问题
3.0.8 添加收回键盘接口;添加键盘状态的回调接口;部分代码的逻辑优化;添加onCommitJson回调,解决输入特殊字符的问题;
3.0.7 添加获取输入框高度的接口
3.0.6 修复点击表情,再点击空白区域,再点击输入框时撑满屏幕的问题
3.0.5 修复点击输入框再点击物理返回键,直接退出插件问题
3.0.4 修改open接口
3.0.3 修复插件关闭时系统键盘还显示问题
3.0.2 修复第二次打开界面空指针问题
3.0.1 clean函数中调用close方法
3.0.0 ChatKeyboard插件基础版