iOS Dev从头做个直播app收藏ios

iOS直播聊天评论区的实现

2017-04-01  本文已影响291人  Accepted_

效果参照下面截图,来自映客直播APP

映客直播示意图

先分析一下需求,一条一条的评论是从下往上顶的,那么我们每次把新评论添加到tableView的最后一行,但是这样的话,如果tableView中还没有数据,或者所有评论的高度加起来还不满一个tableView的高度,则是从上往下先填满的。如下图中②所示

但是我们需要的是①那样。从一开始就从下往上顶。我们可以把tableView倒过来(上下翻转),每次插入数据都插在第一行。这样就实现了每次插入数据,都是从下往上顶。但这样,所有cell的内容也是倒着的,那么再把contentView再倒转一次,就正过来了,而且还是从下往上顶。插入数据也是每次往数组的第0个位置插入。

_tableView.transform=CGAffineTransformMakeScale(1, -1);

在自定义cell中:

self.contentView.transform=CGAffineTransformMakeScale(1, -1);

插入的代码:

[self.commentDisplayedArr insertObject:dataDict atIndex:0]; //commentDisplayedArr是存储显示在屏幕上的评论信息的数组

NSIndexPath * indexPath = [NSIndexPath indexPathForRow:0 inSection:0];

[self.tableView insertRowsAtIndexPaths:@[indexPath] withRowAnimation: UITableViewRowAnimationTop];

这样就实现了。

效果图

若想实现花椒那种用户滑到最顶部的时候,再有新消息都不在往上滚动了。则在insert的时候加个判断,判断是否到达tableView的底部(因为我们tableView翻转过,所以用户看到的顶部其实是tableView的底部),判断方法参考我的简书 如何判断tableView滑动到了底部 。如果你知道,可以跳过继续往下。

效果图:

花椒直播间截图

首先你需要在tableView的底部加一个tableView的高度。

_tableView.contentInset=UIEdgeInsetsMake(0, 0, �height, 0);

if(self.isReachBottom)  //如果滑动到达�tableView底部

{

NSIndexPath * indexPath = [NSIndexPath indexPathForRow:0 inSection:0];

[self.tableView insertRowsAtIndexPaths:@[indexPath] withRowAnimation: UITableViewRowAnimationTop];

indexPath = [NSIndexPath indexPathForRow:self.commentDisplayedArr.count - 1 inSection:0];

//无动画,滚动到最后一个cell

[self.tableView scrollToRowAtIndexPath:indexPath atScrollPosition: UITableViewScrollPositionNone animated:NO];

}

上一篇下一篇

猜你喜欢

热点阅读