1 前提
现在的许多项目中或多或少都会接触到即时通讯的相关内容,无论是公司的自己实现,还是第三方的接入(如环信,融云,腾讯等)。可能在开发的过程中大家都会遇到这样的一个需求:就是过滤消息中的敏感词,像一些粗俗的语言,微信 QQ号码之类的东西。最近我司的直播项目中需要接入聊天的功能,由于排期的问题,我们选择了接入第三方的SDK,我们选择了腾讯的云通信。现在有这么一个需求就是需要对聊天消息进行过滤处理,当然过滤是后端做的处理,但是当我们发送的消息中带有表情的时候,他们好像无法过滤,所以就提出了类似于微信的效果,发送的表情是用[文字]的格式,然后发出去的时候用表情替换,如下图效果:
(哦,除了达到过滤的效果外,还有个原因是为了去匹配安卓那边的)本人的语言组织不太流利,下面是我的做法。
2 代码的实现
1, 资源文件的导入
我们这边没有用unicode的编码的表情,而是UI给的静态图片替换。如下图这种:
2, 代码的具体操作
腾讯的sdk中提供了多种消息类型,我们没用使用他们提供的textElem类型,而是使用的自定义的customElem类型,这样做的可控性会跟强一点,当然你们完全也可以使用直接的文字消息类型。
表情键盘的实现代码这里就不做介绍了,很简单的布局操作,然后在点击表情的点击事件中操作:首先取出plist文件中的数组,然后在textview的显示地方出入文字的显示,在点击消息发送的试试,在显示消息的气泡上面再用图片替换回来即可,其实实现过程很简单
NSString *cfgPath = [[NSBundle mainBundle] pathForResource:@"ChatSystemFaceConfig" ofType:@"plist"];
NSArray *array = [NSArray arrayWithContentsOfFile:cfgPath];
下面是插入表情文字的操作
// 按下情情符号 这是点击表情的方法,在plist文件中取出的数组中增加model
- (void)onInputSystemFace:(ChatSystemFaceItem *)item
{
NSAttributedString* emojiTag = [[NSAttributedString alloc]initWithString:item.emojiTag];
[_textView.textStorage insertAttributedString:emojiTag atIndex:_textView.selectedRange.location];
_textView.selectedRange = NSMakeRange(_textView.selectedRange.location + [item.emojiTag length], _textView.selectedRange.length);
这样在textView显示问题就先解决了。
下一步就是在聊天气泡中显示表情的问题,做法是:使用正则表达式取出[xxx]的内容,然后在用表情图片来替换显示即可。
-(void)changeEmojiWithString:(NSString*)emoji{
//转成可变属性字符串
NSMutableAttributedString * mAttributedString = [[NSMutableAttributedString alloc]initWithString:emoji];
//创建匹配正则表达式的类型描述模板
NSString * pattern = @"\\[[a-zA-Z0-9\\u4e00-\\u9fa5]+\\]";
//创建匹配对象
NSError * error;
NSRegularExpression * regularExpression = [NSRegularExpression regularExpressionWithPattern:pattern options:NSRegularExpressionCaseInsensitive error:&error];
//判断
if (!regularExpression)//如果匹配规则对象为nil
{
NSLog(@"正则创建失败!");
NSLog(@"error = %@",[error localizedDescription]);
return ;
}
NSArray * resultArray = [regularExpression matchesInString:mAttributedString.string options:NSMatchingReportCompletion range:NSMakeRange(0, mAttributedString.string.length)];
//开始遍历 逆序遍历
for (NSInteger i = resultArray.count - 1; i >= 0; i --)
{
//获取检查结果,里面有range
NSTextCheckingResult * result = resultArray[i];
//根据range获取字符串
NSString * rangeString = [mAttributedString.string substringWithRange:result.range];
//获取图片
UIImage * image = [self getImageWithRangeString:rangeString];//这是个自定义的方法
if (image != nil)
{
//创建附件对象
NSTextAttachment * imageTextAttachment = [[NSTextAttachment alloc]init];
//设置图片属性
imageTextAttachment.image = image;
imageTextAttachment.bounds = CGRectMake(0, 0, 24, 24);
//根据图片创建属性字符串
NSAttributedString * imageAttributeString = [NSAttributedString attributedStringWithAttachment:imageTextAttachment];
//开始替换
[mAttributedString replaceCharactersInRange:result.range withAttributedString:imageAttributeString];
}
}
//处理完毕后显示在label上 这个是气泡上面的 显示的label
_chatText.attributedText = mAttributedString;
}
//根据rangeString获取plist中的图片
-(UIImage *)getImageWithRangeString:(NSString *)rangeString
{
//加载数组
NSString * path = [[NSBundle mainBundle]pathForResource:@"ChatSystemFaceConfig" ofType:@"plist"];
NSArray* pictureArray = [[NSArray alloc] initWithContentsOfFile:path];
//开始遍历
for (NSDictionary * tempDict in pictureArray)
{
if ([tempDict[@"emojiTag"] isEqualToString:rangeString])
{
NSLog(@"tempDict == %@",tempDict[@"emojiTag"]);
//获得字典中的图片名
NSString * imageName = tempDict[@"emojiIndex"];
//根据图片名获取图片
UIImage * image = [UIImage imageNamed:[NSString stringWithFormat:@"%@.png",imageName]];
//返回图片
return image;
}
}
return nil;
}
这样显示的内容基本上就没什么问题了,很简单的实现过程。
3 删除表情的操作
删除表情的时候也是参照腾讯的做法,每次删除都是删除整个[xxxx]内容,做法也是使用正则删除
//删除文字
- (void) deleteEmojiStringAction
{
NSString *souceText = _textView.text;
NSRange range = _textView.selectedRange;
if (range.location == NSNotFound) {
range.location = _textView.text.length;
}
if (range.length > 0) {
[_textView deleteBackward];
return;
}else{
//正则匹配要替换的文字的范围
//正则表达式
NSString * pattern = @"\\[[a-zA-Z0-9\\u4e00-\\u9fa5]+\\]";
NSError *error = nil;
NSRegularExpression * re = [NSRegularExpression regularExpressionWithPattern:pattern options:NSRegularExpressionCaseInsensitive error:&error];
if (!re) {
NSLog(@"%@", [error localizedDescription]);
}
//通过正则表达式来匹配字符串
NSArray *resultArray = [re matchesInString:souceText options:0 range:NSMakeRange(0, souceText.length)];
NSTextCheckingResult *checkingResult = resultArray.lastObject;
//加载数组
NSString * path = [[NSBundle mainBundle]pathForResource:@"ChatSystemFaceConfig" ofType:@"plist"];
NSArray* pictureArray = [[NSArray alloc] initWithContentsOfFile:path];
for (NSDictionary *faceDic in pictureArray) {
NSString *faceName = faceDic[@"emojiTag"];
if ([souceText hasSuffix:@"]"]) {
if ([[souceText substringWithRange:checkingResult.range] isEqualToString:faceName]) {
NSLog(@"faceName %@", faceName);
NSString *newText = [souceText substringToIndex:souceText.length - checkingResult.range.length + 1];
NSLog(@"newText %@",newText);
_textView.text = newText;
return;
}
}
// else
//
// {
//
// [_textView deleteBackward];
//
// return;
//
// }
}
}
}
以上就是项目中用到的东西,希望能帮助到遇到相同问题的童鞋!!加油!!!