- 下载Demo后解压根目录下的
EaseMobSDK.zip
- 将appDelegate中[[MMEmotionCentre defaultCentre] setAppId:@“your app id” secret:@“your secret”]设置成分配到的
id
和secret
。 - 本Demo在环信官方Demo的基础上集成了BQMM1.7,在修改的地方我们都加上了“BQMM集成"的注释,可在项目中全局搜索查看。
- 我们提供了集成之后的Demo与官方Demo的Diff文档
ChatDemo2.2.6_BQMM集成文档.html
,供大家查看。
- 为 APP 提供了完整的表情键盘及表情商店。
- 环信官方
SDK2.2.6 ChatDemoUI3.0
版Demo已默认集成表情云 SDK,可以直接下载试用。
表情云 SDK包含 BQMM.framework
和 BQMM_EXT
,BQMM.framework
提供表情键盘、表情商店,BQMM_EXT
以开源方式提供,实现表情消息的展示。
将BQMM
添加到工程中。
@Class:AppDelegate
@Function:- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions;
@description: appId及secret由表情云分配
// 初始化表情云 SDK
[[MMEmotionCentre defaultCentre] setAppId:@“your app id” secret:@“your secret”]
@Class:EaseChatToolbar
@Function:- (instancetype)initWithFrame:(CGRect)frame horizontalPadding:(CGFloat)horizontalPadding verticalPadding:(CGFloat)verticalPadding inputViewMinHeight:(CGFloat)inputViewMinHeight inputViewMaxHeight:(CGFloat)inputViewMaxHeight type:(EMChatToolbarType)type;
[MMEmotionCentre defaultCentre].delegate = self;
@Class:EaseChatToolbar
@Function:- (void)faceButtonAction:(id)sender;
if (!_inputTextView.isFirstResponder) {
[_inputTextView becomeFirstResponder];
}
[[MMEmotionCentre defaultCentre] attachEmotionKeyboardToInput:_inputTextView];
@Class:EaseChatToolbar
@Function:- (void)faceButtonAction:(id)sender;
[[MMEmotionCentre defaultCentre] switchToDefaultKeyboard];
@Class:AppDelegate
@Function:-- (void)applicationWillEnterForeground;
[[MMEmotionCentre defaultCentre] clearSession];
@Class:EaseChatToolbar
@Function:- (void)setupSubviews;
[[MMEmotionCentre defaultCentre] shouldShowShotcutPopoverAboveView:self.faceButton withInput:self.inputTextView];
SDK提供UITextView+BQMM
作为表情编辑控件的扩展实现。
/**
* 用于显示图文混排的表情消息。
*/
@property(nonatomic, assign) NSString *mmText;
在编辑图文混排表情消息时,注意使用textView.mmText
替换原有textView.text
。
[self.delegate didSendText:textView.mmText];
@Class:EaseChatToolbar
#pragma mark - *MMEmotionCentreDelegate
//点击键盘中大表情的代理
- (void)didSelectEmoji:(MMEmoji *)emoji
{
if ([self.delegate respondsToSelector:@selector(didSendMMFace:)]) {
[self.delegate didSendMMFace:emoji];
}
}
//点击联想表情的代理
- (void)didSelectTipEmoji:(MMEmoji *)emoji
{
if ([self.delegate respondsToSelector:@selector(didSendMMFace:)]) {
[self.delegate didSendMMFace:emoji];
self.inputTextView.text = @"";
}
}
//点击表情小表情键盘上发送按钮的代理
- (void)didSendWithInput:(UIResponder<UITextInput> *)input
{
if ([self.delegate respondsToSelector:@selector(didSendText:)]) {
[self.delegate didSendText:_inputTextView.mmText];
self.inputTextView.text = @"";
[self willShowInputTextViewToHeight:[self getTextViewContentH:self.inputTextView]];
}
}
//点击输入框切换表情按钮状态
- (void)tapOverlay
{
self.faceButton.selected = NO;
}
@Class:EaseMessageViewController
//发送图文混排消息
- (void)sendTextMessage:(NSString *)text
{
NSString *text_ = [text stringByReplacingOccurrencesOfString:@"\a" withString:@""];
[MMTextParser localParseMMText:text_ completionHandler:^(NSArray *textImgArray) {
NSDictionary *mmExt = nil;
NSString *sendStr = @"";
for (id obj in textImgArray) {
if ([obj isKindOfClass:[MMEmoji class]]) {
MMEmoji *emoji = (MMEmoji*)obj;
if (!mmExt) {
mmExt = @{@"txt_msgType":@"emojitype",
@"msg_data":[MMTextParser extDataWithTextImageArray:textImgArray]};
}
sendStr = [sendStr stringByAppendingString:[NSString stringWithFormat:@"[%@]", emoji.emojiName]];
}
else if ([obj isKindOfClass:[NSString class]]) {
sendStr = [sendStr stringByAppendingString:obj];
}
} [self sendTextMessage:sendStr withExt:mmExt];
}];
}
//发送单条大表情的方法
-(void)sendMMFaceMessage:(MMEmoji *)emoji
{
NSDictionary *mmExt = @{@"txt_msgType":@"facetype",
@"msg_data":[MMTextParser extDataWithEmojiCode:emoji.emojiCode]};
[self sendMMFaceMessage:emoji withExt:mmExt];
}
我们将表情显示部分的代码从表情云 SDK中分离出来,方便开发者根据自己的业务实现表情图片显示逻辑,同时我们提供了MMTextView
类,作为表情消息解析和显示的示例。
首先,SDK在MMTextParser
中提供从字符串解析表情的方法parseMMText
和localParseMMText
。
@Class MMTextParser
+ (void)parseMMText:(NSString *)text completionHandler:(void(^)(NSArray *textImgArray))completionHandler;
+ (void)localParseMMText:(NSString *)text completionHandler:(void(^)(NSArray *textImgArray))completionHandler;
localParseMMText
只解析本地已下载的表情。
参数text
为需要解析的字符串,格式为@"你好[hhd]"
方括号里是emojiCode
。
completionHandler
回调的参数textImgArray
是消息中字符串和Emoji
对象的数组,例:@[@"你好", <Emoji*>]
。
另外,SDK提供了MMTextParser
的开源扩展MMTextParser+ExtData
,可以实现textImgArray
、text
和extData
的互相转换。
@Class MMTextParser+ExtData
+ (NSArray *)extDataWithTextImageArray:(NSArray *)textImageArray;
+ (NSArray *)extDataWithEmojiCode:(NSString *)emojiCode;
+ (MMEmoji *)placeholderEmoji;
+ (NSString *)stringWithExtData:(NSArray *) extData;
extData
是SDK推荐的用于解析的表情消息发送格式(在Demo中作为消息扩展message.ext[@"msg_data"]
发送),格式是一个二维数组,内容为拆分完成的text
和emojiCode
,并且说明这段内容是否是一个emojiCode
。例:
@[@[@"你好", @"0"], @[@"hhd", @"1"]]
0
表示文本内容,1
表示emojiCode
。
placeholderEmoji
方法提供以占位图显示的小表情对象,在MMTextView
中需要显示小表情时,都先显示一个placeholderEmoji
,对应的表情图片会自动从服务器下载。
@Class MMTextView
@Function -(void)setMmTextData:(NSArray *)extData;
根据表情code获取emoji对象,emoji的成员对象emojiImage即是大表情图片
@Class MMEmotionCentre
@Function - (void)fetchEmojisByType:(MMFetchType)fetchType codes:(NSArray *)emojiCodes completionHandler:(void (^)(NSArray *emojis))completionHandler;
在点击大表情消息时添加单个表情详情页面,在详情页面可以查看和下载表情包信息。
@Class EaseMessageViewController
@Function - (void)messageCellSelected:(id)model;
UIViewController *emojiController = [[MMEmotionCentre defaultCentre] controllerForEmotionCode:model.message.ext[@"msg_data"][0][0]];
[self.navigationController pushViewController:emojiController animated:YES];
表情云 SDK通过MMTheme
提供一定程度的UI定制。
创建一个MMTheme
对象,设置相关属性, 然后[[MMEmotionCentre defaultCentre] setTheme:]即可修改商店和键盘样式。
开发者可以用setUserId
方法设置App UserId,以便在后台统计时跟踪追溯单个用户的表情使用情况。