[转]WxEmojiView

本文转自：https://github.com/icindy/WxEmojiView

来源信息

author: Di (微信小程序开发工程师)
organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)

          垂直微信小程序开发交流社区

github地址: https://github.com/icindy/WxEmojiView
作用: WxEmojiView-微信小程序Emoji展示输入组件
detail :
version: alpha 0.1 非正式版

效果gif(加载慢.... 请等待...)

作用

用于展示带有emoji的文本信息
用于输入和带有emoji的输入框

使用

拷贝WxEmojiView\文件夹到开发目录下
替换WxEmojiView文件夹下的emojis文件夹下的小表情图片
初始化表情

可以在app.js中进行配置，全局使用，也可单独配置使用

初始化函数WxEmoji.init(reg,emojis) reg: 分割符号 emojis：配置表情key-value(名称和后面的必须一致，否则失效，没有写转化函数)
使用代码

var WxEmoji = require('WxEmojiView/WxEmojiView.js');

App({

  onLaunch: function () {

    WxEmoji.init(":_/",{

      "00":"00.gif",

      "01":"01.gif",

      "02":"02.gif",

      "03":"03.gif",

      "04":"04.gif",

      "05":"05.gif",

      ....

    });

  }

})

引入到需要使用的地方如在index.js中进行使用
- 需要进行函数引入 var WxEmoji = require('../../WxEmojiView/WxEmojiView.js');
- 如在index.wxml中使用 <import src="../../WxEmojiView/WxEmojiView.wxml"/>

模版使用

view对文本进行展示使用模版WxEmojiView模版

  <view style="text-align: center;margin: 20px;">wxEmojiView 静态图文</view>

```

使用textarea进行输入展示使用WxEmojiTextarea模版

<view  style="text-align: center;margin: 20px;">下面是WxEmojiTextarea 输入</view>

``` * textarea组件的focus,blur事件绑定，小图标的点击事件(仅用于textarea的时候)

  WxEmojiTextareaFocus:function(e) {

    var that = this;

    WxEmoji.WxEmojiTextareaFocus(that,e);

  },

  WxEmojiTextareaBlur:function(e){

    var that = this;

    WxEmoji.WxEmojiTextareaBlur(that,e);

  },

  wxPreEmojiTap: function(e){

    var that = this;

    WxEmoji.wxPreEmojiTap(that,e);

  }

问题

目前版本还存在很多问题，所以欢迎提交isssue

来源

本项目由微信小程序开发论坛-WeAppDev http://weappdev.com/ 会员编写

巴特西

[转]WxEmojiView

来源信息

效果gif(加载慢.... 请等待...)

作用

使用

问题

来源

最新文章

热门文章