前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >IOS开发:教你实现手机直播系统平台评论功能效果

IOS开发:教你实现手机直播系统平台评论功能效果

原创
作者头像
布谷鸟网络科技
修改2019-03-14 09:23:55
2K0
修改2019-03-14 09:23:55
举报
文章被收录于专栏:用户4669341的专栏

首先,需求 :

每当有人进入房间、评论、送礼物、第一次点赞直播消息时,消息列表都要及时显示并有从下往上滑动的效果。效果如下:

映客某用户直播的图片,感谢主播让我有了效果图

怎么实现呢,怎么实现呢?

消息列表,必定是一个UITableView,每个消息是一个cell,每次接收到一条消息立刻添加到数据数组中,同时刷新UITableView,滚动到底部。

没错思路就是这样,但是问题来了. . .

你每次都去刷新 . . . 即使UITableView有复用机制,也还是不行的,整个效果有一闪一闪的。可以试一下就知道了。😄

那么不能刷新,我们就用插入第n行,并且滚动到第n行 没错 . . . 就是这样实现效果了 . . .

代码如下:

代码语言:javascript
复制
[_dataArray addObject:chatModel];
    
    [self.tableView insertSections:[NSIndexSet indexSetWithIndex:_dataArray.count-1] withRowAnimation:UITableViewRowAnimationNone];
    NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:_dataArray.count-1];
    [_tableView selectRowAtIndexPath:indexPath animated:YES  scrollPosition:UITableViewScrollPositionBottom];

再看一下我们实现的效果图:不然文字看累了

蛋疼,找不到怎么上传GIF,还是只能截图看效果,辛苦你了

但是别急,这种方法,你写了会发现实现了我们的功能了,但是还存在一个很小的问题,那就是:

消息只有屈指可数的两三条的时候,它并没有从下往上一直顶上去,而是直接一直显示,没有动画效果。

原因,在于消息所在的高度还不过我们设置UITableView的高度,滚动到第n行的时候并没有效果。

那么我们换一个思路,来实现,那就是从下往上添加数据。😁😄 这样不管你数据多少都会有动画。

再来看一下我们实现的效果图,不然文字又看累了😁

厉害了,这个就是我要的效果

那么实现的思路就是,我们一直添加到数据源的第一条,这样不管数据多少,是不是都会有动画效果,脑袋里想象一下,答案是肯定的。

那么问题又来了,一直往第一条添加,是有动画了,但是他是从上往下的

从上往下就从上往下,我们给所有的区域旋转180度,不就变成了从下往上了。 代码怎么写呢?

代码语言:javascript
复制
    [_dataArray insertObject:chatModel atIndex:0];
    [self.tableView insertSections:[NSIndexSet indexSetWithIndex:0] withRowAnimation:UITableViewRowAnimationTop];

注意咯:数据我们是一直加在第一条的位置。

旋转180

代码语言:javascript
复制
_tableView.transform = CGAffineTransformMakeScale(1, -1);

然后单单把UITableView旋转,你会发现,还有问题

什么问题 ? 文字内容翻转了 。 。 。

那我们在把文字内容的视图在旋转180,即cell旋转180

代码语言:javascript
复制
self.contentView.transform = CGAffineTransformMakeScale(1, -1);

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云直播
云直播(Cloud Streaming Services,CSS)为您提供极速、稳定、专业的云端直播处理服务,根据业务的不同直播场景需求,云直播提供了标准直播、快直播、云导播台三种服务,分别针对大规模实时观看、超低延时直播、便捷云端导播的场景,配合腾讯云视立方·直播 SDK,为您提供一站式的音视频直播解决方案。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档