需求：实现聊天文字收发功能，不需要图片,视频,音频等数据的传输。
内容：界面布局(UIButton包裹内容)，通信(基于socket和http)，本地存储(FMDB)，酒一点一点喝，内容一个一个介绍。
界面布局：
界面。png
cell高度调整思路:
有自动布局和手动计算布局两种,孰优孰劣,各取所需吧,本人更倾向于手动布局.这两种我都尝试了一下,感觉上使用自动布局在,进入界面的时候会慢一点,滑动的时候没有手动计算的流畅.
cell的布局计算,网上也有比较多的Demo,在这就不贴代码.介绍一下主要思路和关键点:
- 气泡图片的拉伸处理,是在images.xcassets中的Show Slicing中进行图片处理,如果不了解相关操作,可以戳这里.首先将此图片设置为UIButton的背景图片,然后内容自然就是设置title了,边距的设置就设置UIButton的属性 contentEdgeInsets来调整.
- 数据模型,做法是两个Model类,一个是聊天内容的Model类(time时间戳,message内容,userID用户ID等),一个是计算出cell布局的FrameModel类,主要用来根据传入聊天内容的Model类去计算出Rect.
//FrameModel类可能是这个样子的
/** 头像的Frame */
@property (nonatomic,assign)CGRect avatarViewFrame;
/** 时间的Frame */
@property (nonatomic,assign)CGRect timeFrame;
/** 按钮(内容)的Frame */
@property (nonatomic,assign)CGRect btnFrame;
/** cell的高度 */
@property (nonatomic,assign)CGFloat cellHeight;
/**
* 数据模型
*/
@property (nonatomic,strong)DTVLetterModel *letterModel;
//根据letterModel初始化
+(instancetype)modelFrameWithLetterModel:(DTVLetterModel *)letterModel timeIsHidden:(BOOL)timeHidden;
//计算出Rect的方法,NSString的方法
//size:最大的范围 options:NSStringDrawingUsesLineFragmentOrigin attributes:NSFontAttributeName:[UIFont systemFontOfSize:字号] context:nil
- (CGRect)boundingRectWithSize:(CGSize)size options:(NSStringDrawingOptions)options attributes:(nullable NSDictionary<NSString *, id> *)attributes
context:(nullable NSStringDrawingContext *)context NS_AVAILABLE(10_11, 7_0);
//最后返回cell的高度
//比较输入的内容和头像的Y值哪个大
CGFloat cellH = MAX(CGRectGetMaxY(frameModel.btnFrame),CGRectGetMaxY(frameModel.avatarViewFrame));
frameModel.cellHeight = cellH + distance;
- 关于弹出键盘高度处理和tableView增加数据后滑动处理
//对键盘添加通知,这里可以只用UIKeyboardWillChangeFrameNotification,也可以两个都用,区别就是在一个方法中还是两个方法中处理而已
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillChangeFrameNotification object:nil];
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];
//在这里会有一个处理系统键盘和第三方键盘弹出高度不同的问题,第三方键盘弹出时keyboardWillShow会被调用三次,处理判断后只收到最后一次
- (void)keyboardWillShow:(NSNotification *)notification {
NSDictionary *userInfo = notification.userInfo;
// 动画的持续时间
NSNumber *duration = userInfo[UIKeyboardAnimationDurationUserInfoKey];
CGFloat curkeyBoardHeight = [[[notification userInfo] objectForKey:@"UIKeyboardBoundsUserInfoKey"] CGRectValue].size.height;
CGRect begin = [[[notification userInfo] objectForKey:@"UIKeyboardFrameBeginUserInfoKey"] CGRectValue];
CGRect end = [[[notification userInfo] objectForKey:@"UIKeyboardFrameEndUserInfoKey"] CGRectValue];
// 第三方键盘回调三次问题，监听仅执行最后一次
if(begin.size.height > 0 && (begin.origin.y - end.origin.y > 0)){
if ([_delegate respondsToSelector:@selector(inputView:willShowKeyboardHeight:time:)]) {
//代理
[_delegate inputView:self willShowKeyboardHeight:curkeyBoardHeight time:duration];
}
}
}
- (void)keyboardWillHide:(NSNotification *)notification {
if ([_delegate respondsToSelector:@selector(willHideKeyboardWithInputView:time:)]) {
[_delegate willHideKeyboardWithInputView:self time:[notification.userInfo objectForKey:UIKeyboardAnimationDurationUserInfoKey]];
}
}
//控制器中执行的键盘代理方法,我在这里tableView和下面的工具条是用约束来布局的,所以两者也会跟着一起变化
- (void)inputView:(DTVInPutView *)inputView willShowKeyboardHeight:(CGFloat)height time:(NSNumber *)time {
if (height == 0) return;
//动画调整视图的大小,
[UIView animateWithDuration:time.floatValue animations:^{
self.view.frame = CGRectMake(Zero,NavigationBarHeight + StatusBarHeight, self.view.width,Screen_Height - NavigationBarHeight - StatusBarHeight - height);
}completion:^(BOOL finished) {
//让tableView显示最后一条数据在底部
[self upDataTableViewFrame];
}];
}
//恢复Frame
- (void)willHideKeyboardWithInputView:(DTVInPutView *)inputView time:(NSNumber *)time {
[UIView animateWithDuration:time.floatValue animations:^{
self.view.frame = CGRectMake(Zero,NavigationBarHeight + StatusBarHeight, self.view.width,Screen_Height - NavigationBarHeight - StatusBarHeight);
}];
}
//作用:让tableView显示最后一条数据在底部,每次显示一条数据都执行一次这个方法,就可以在进入控制器,聊天,弹出键盘时做到信息一直显示出来的效果了
- (void)upDataTableViewFrame {
NSUInteger count = self.letterChatArray.count;
if (count > 0) {
NSIndexPath *lastIndex = [NSIndexPath indexPathForRow:count - 1 inSection:0];
[self.tableView scrollToRowAtIndexPath:lastIndex atScrollPosition:UITableViewScrollPositionBottom animated:NO];
[self.view layoutIfNeeded];
}
}
- 时间的显示和隐藏,我们用的是上一条信息和最新一条信息相隔5分钟就显示时间,在聊天Model和FrameModel转换时,记录上一条时间戳,进行时间戳比较小于300秒就设置timeFrame高度为0.
界面方向大概就这么些了,如有遗漏,忘各位看官不吝赐教
通信
用户自己发送消息,我们用的是HTTP的请求来传递的(当然这样不是很严谨,但是后台老大这样做的,而且本来就是非专业的嘛).既然这样各位肯定也就知道了发消息如何实现的了.
UITextField的代理方法(textFieldShouldReturn:)和UIButton[发送]点击触发发送消息事件,在控制器中处理事件
1:如果输入字符串长度0或者空格,提醒用户;
2:根据内容message,自己的ID,当前时间戳生成一个Model对象,存入本地数据库,将Model转为FrameModel添加进tableView的数据源数组中,刷新tableView,再让显示最后一条数据在底部.(需求让用户先看到自己发的东西,再网络发送请求,跟着需求走)
3,发送请求,把聊天目标ID,和内容message发给服务器.
----------------------------------------------------------------------------------------------------------------------
用户收消息我们用的是Socket,关于Socket使用在此不多做赘述,定义好收到消息后Socket传递的类型(比如用10086),收到10086类型的数据,就发出一个通知,这个通知有两个观察者Observer,一个是本地存储数据用(因为非专业,所以服务器不存那么多数据,只能存本地了),把这条信息存入数据库中,另外一个是聊天界面,如果收到的消息数据里的ID和当前聊天界面的目标ID一样,那就得显示出来,显示流程和发送消息一样.
在这里会有一个表情文字混编的问题,后台老大把HTTP收到的消息进行Base64和UTF8编码,客户端收到消息再对内容进行解码.
//对聊天内容进行解码
NSString *msgStr = dictionary[@"msg"];
NSData *chatConentData = [[NSData alloc]initWithBase64EncodedString:msgStr options:0];
NSString *chatConent = [[NSString alloc] initWithData:chatConentData encoding:NSUTF8StringEncoding];
本地存储
本地储存用的FMDB写的,github上封装好的很多,可以根据需要搜索,各位根据自己喜好自己选择存储方式了.我的方法也是贪图快,很多细节没有处理特别好,大概流程就是根据用户自己的ID创建一个文件夹(有可能一台机子登录两个账号,所以用ID标识),每个目标ID创建一个表,表里存的就是聊天的Model类.这样插入信息就直接到表的最下方了.之后就是对表的操作了,增删改查~每次进入聊天界面,就去表里查询出数据,转换为聊天的Model,再转为FrameModel.
还有一点是收到新消息的提醒,和提醒用户未读有几条信息,我是用的plist做得.记录了是否已读状态,和未读的条数,每个聊天列表的cell显示时,查询Plist中记录,有未读消息就和QQ一样显示出标记和未读条数.(不知道别人怎么做的,我是感觉自己做的挺笨的,可能别人是服务器端做的,而我们做本地了).每次向数据库插入信息时,以及当点开聊天列表查看详情时,相应修改plist中数据.
//otherUid:修改阅读状态的ID status:是否已阅读
- (void)changeChatMarkWithOtherUid:(NSString *)otherUid status:(BOOL)status {
//如果用户正在聊天界面,目标ID和收到的ID一样,直接返回,不处理
if (self.targetID && [self.targetID.stringValue isEqualToString:otherUid]) {
return;
}
//如果不一致就根据uidKey找到plist文件中的对应的字典
NSString *uidKey = [NSString stringWithFormat:@"%zd%@",[PTVLoginUserInfo getLoginUserInfo].uid,otherUid];
NSMutableDictionary *markDict = [self readLocalPlist];
//如果此字典存在
if (markDict[uidKey]) {
NSDictionary *dict = markDict[uidKey];
//修改阅读状态
[dict setValue:@(status) forKey:markStatusKey];
//取出未读的条数
NSNumber *lastNumber = dict[markNumberKey];
//如果是标记未阅读,未读条数+1,否则,修改为0
if (status) {
NSInteger newNumber = lastNumber.integerValue + 1;
[dict setValue:@(newNumber) forKey:markNumberKey];
}else{
[dict setValue:@(0) forKey:markNumberKey];
}
}else{
//如果此字典不存在,就记录状态,未读条数为1
NSDictionary *dict = @{markStatusKey : @(status),
markNumberKey : @(1)
};
[markDict setObject:dict forKey:uidKey];
}
//写入本地中
[markDict writeToFile:self.dataPath atomically:YES];
}
发送图片我想也可以实现,无外乎服务器再传一个是文字还是图片的类型,将图片data数据转为image显示出来.聊天功能大概就写了这些,如果有疑问或者还有什么遗漏,希望大家提醒一下,我找时间补充上.
2017年8月11日补充,关于GCDAsyncSocket适配Ipv6的问题
解决方案：如果当前是处于IPv6的网络环境中，那就对该IPv4的IP进行转换，拿到一个IPv6格式的IP进行连接。
CocoaAsyncSocket里面有一个类方法 :
+ (NSMutableArray *)lookupHost:(NSString *)host port:(uint16_t)port error:(NSError **)errPtr
它的作用是:通过这个传入一个IPv4的IP或者传入一个URL可以查到对应的IPv6的IP，前提是在IPv6的网络环境
下，如果是在IPv4的网络环境下，只会拿到IPv4的IP，当判断查到的array里面有IPv6的IP的时候就直接用这个
进行连接，否则用IPv4的IP进行连接
//针对ipv6网络环境下适配，ipv4环境直接使用原来的地址
- (NSString *)getProperIPWithAddress:(NSString *)ipAddr port:(UInt32)port
{
NSError *addresseError = nil;
NSArray *addresseArray = [GCDAsyncSocket lookupHost:ipAddr port:port error:&addresseError];
if (addresseError) {
LQ_Log(@"转换IPV6出错---%@",addresseError.localizedDescription);
}
NSString *ipv6Addr = @"";
for (NSData *addrData in addresseArray) {
if ([GCDAsyncSocket isIPv6Address:addrData]) {
ipv6Addr = [GCDAsyncSocket hostFromAddress:addrData];
}
}
if (ipv6Addr.length == 0) {
ipv6Addr = ipAddr;
}
return ipv6Addr;
}
每次连接socket的时候都将连接的ip和port传进来，最后会输出一个合适的ip，用这个ip和port进行连接就好了。
