|
hintChatBox (输入框)模块试用分享
[复制链接]
本帖最后由 uoaccw 于 2018-11-26 09:57 编辑
hintChatBox 是一个聊天输入框模块,集成了表情,从相册选取图片的功能。开发者可自定义表情集,只需简单配置即可实现自定义表情和添加点击事件。开发者可自定义快捷输入面板,用户可选择快捷输入。
模块文档地址
先看模块效果:
说明:
1. 模块背景色和图标图片可以通过模块参数配置。开发者可以根据UI需求进行灵活调整。
2. 左边按钮(leftButton参数),对应快捷文字面板。如果不需要这个功能,可以不传这个参数,则不显示输入框左边按钮。
注意事项:
1. 模块参数较多,写代码输入时注意不要输入中文冒号/中文逗号,导致代码运行报错。
2. setInputFieldListener (监听输入框高度/模块面板高度接口)应在模块打开成功后调用。
3. 配置键盘弹出方式:
- <preference name="softInputMode" value="resize"/>
复制代码
open接口示例代码:
- var hintChatBox = api.require('hintChatBox');
- hintChatBox.open({
- bgColor: "#F00",
- lineColor: "#F00",
- borderColor: "rgba(0,0,0,0)",
- fileBgColor: "#eee", //输入框背景色
- switchButton: {
- faceNormal: 'widget://image/face.png',
- faceHighlight: "widget://image/face1.png",
- keyboardNormal: 'widget://image/key1.png',
- keyboardHighlight: "widget://image/key2.png",
- addNormal: 'widget://image/append.png',
- addHighlight: "widget://image/append1.png",
- },
- addButtons: [{
- normal: 'widget://image/image.png',
- highlight: "widget://image/image1.png",
- title: '相册',
- titleSize: 12
- }, {
- normal: 'widget://image/packet.png',
- highlight: 'widget://image/packet1.png',
- title: '钱包',
- titleSize: 12
- }],
- pageControl: {
- normalColor: "#333",
- highlightColor: "#f00"
- },
- sourcePath: 'widget://image/emotion',
- placeholder: "请输入。。。",
- maxLines: 2,
- leftButton: {
- hint: { //快捷文字提示面板设置,不可为空
- bg: "#fff", //(可选项)面板背景设置,支持 rgb,rgba,#,img,默认白色
- buttons: [{ //提示面板导航按钮组成的数组
- normal: "widget://image/btntxt.png", //按钮常态下的背景图片
- selected: "widget://image/btntxt.png" //点击后背景图片
- }, { //提示面板导航按钮组成的数组
- normal: "widget://image/btntxt1.png", //按钮常态下的背景图片
- selected: "widget://image/btntxt1.png" //点击后背景图片
- }],
- hints: [{ //快捷提示文面板设置,数组对象,与buttons按序一一对应
- size: 12, //(可选项)快捷文字大小,数字类型,默认12
- color: "#0f0", //(可选项)快捷文字颜色,默认黑色,支持 rgb,rgba,#
- contents: ["早上好!", "bye!"], //快捷文字内容组成的数组,数组对象
- normal: "widget://image/txt.png", //快捷提示文字开头标注图标,支持widget,fs,等本地路径
- selected: "widget://image/txt.png" //快捷提示文字开头选中标注图标,支持widget,fs,等本地路径
- }, { //快捷提示文面板设置,数组对象,与buttons按序一一对应
- size: 12, //(可选项)快捷文字大小,数字类型,默认12
- color: "#0f0", //(可选项)快捷文字颜色,默认黑色,支持 rgb,rgba,#
- contents: ["您好!", "Hello!"], //快捷文字内容组成的数组,数组对象
- normal: "widget://image/txt.png", //快捷提示文字开头标注图标,支持widget,fs,等本地路径
- selected: "widget://image/txt.png" //快捷提示文字开头选中标注图标,支持widget,fs,等本地路径
- }],
- activeBtn: 0 //数字类型;leftBtn显示的当前活跃按钮的索引,小于buttons数组元素总数;默认值为0
- }
- }
- }, function(ret, err) {
- if (ret) {
- console.log(JSON.stringify(ret));
- } else {
- console.log(JSON.stringify(err));
- }
- });
复制代码
FAQ:
1. Android open 提示json解析错误或IO错误,是什么原因?
可能原因1:表情包文件及json文件不符合规范。可参考附件代码包中的资源。
2:sourcePath路径填写错误。
3:资源未同步到手机上。WiFi全量同步后测试。
|
本帖子中包含更多资源,您需要 登录 才可以下载或查看,没有帐号?立即注册
X
|