直播App越來越值得市場(chǎng)關(guān)注睬辐,那么我們也要越來越關(guān)注直播的需求挠阁。
做為一名開發(fā)菜鳥,不得不跟隨市場(chǎng)的發(fā)展而努力的學(xué)習(xí)溯饵。
打工也要認(rèn)真侵俗,沒錯(cuò)就是這句話。
回到正題:
本菜鳥再做直播項(xiàng)目的一些分享共勉 . . .
今天教你一步步實(shí)現(xiàn)直播間評(píng)論效果功能 . . .
首先丰刊,look 需求 :
每當(dāng)有人進(jìn)入房間隘谣、評(píng)論、送禮物啄巧、第一次點(diǎn)贊直播消息時(shí)寻歧,消息列表都要及時(shí)顯示并有從下往上滑動(dòng)的效果。效果如下:
怎么實(shí)現(xiàn)呢码泛,怎么實(shí)現(xiàn)呢 。澄耍。噪珊。
消息列表,必定是一個(gè)UITableView齐莲,每個(gè)消息是一個(gè)cell痢站,每次接收到一條消息立刻添加到數(shù)據(jù)數(shù)組中,同時(shí)刷新UITableView选酗,滾動(dòng)到底部阵难。
沒錯(cuò)思路就是這樣,但是問題來了. . .
你每次都去刷新 . . . 即使UITableView有復(fù)用機(jī)制芒填,也還是不行的呜叫,整個(gè)效果有一閃一閃的。You可以試一下就知道了殿衰。??
那么不能刷新怀偷,我們就用插入第n行,并且滾動(dòng)到第n行
沒錯(cuò) . . . 沒錯(cuò) . . . 就是這樣實(shí)現(xiàn)效果了 . . .
代碼如下:
[_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];
再看一下我們實(shí)現(xiàn)的效果圖:不然文字看累了
是不是very happy 蜀踏,但是別急维蒙,這種方法,你寫了會(huì)發(fā)現(xiàn)實(shí)現(xiàn)了我們的功能了果覆,但是還存在一個(gè)很小的問題颅痊,那就是:
消息只有屈指可數(shù)的兩三條的時(shí)候,它并沒有從下往上一直頂上去局待,而是直接一直顯示斑响,沒有動(dòng)畫效果菱属。
原因,在于消息所在的高度還不過我們?cè)O(shè)置UITableView的高度舰罚,滾動(dòng)到第n行的時(shí)候并沒有效果纽门。
那么我們換一個(gè)思路,來實(shí)現(xiàn)营罢,那就是從下往上添加數(shù)據(jù)赏陵。????
這樣不管你數(shù)據(jù)多少都會(huì)有動(dòng)畫。
再來看一下我們實(shí)現(xiàn)的效果圖饲漾,不然文字又看累了??
那么實(shí)現(xiàn)的思路就是考传,我們一直添加到數(shù)據(jù)源的第一條吃型,這樣不管數(shù)據(jù)多少,是不是都會(huì)有動(dòng)畫效果僚楞,腦袋里想象一下败玉,答案是肯定的。
那么問題又來了镜硕,一直往第一條添加运翼,是有動(dòng)畫了,但是他是從上往下的啊 . . . 啊 . . .
從上往下就從上往下兴枯,我們給所有的區(qū)域旋轉(zhuǎn)180度血淌,不就變成了從下往上了。
厲害了我的哥啊财剖,真的可以實(shí)現(xiàn)悠夯,代碼怎么寫呢。
不急 . . . 代碼來了 . . . You look . . .
[_dataArray insertObject:chatModel atIndex:0];
[self.tableView insertSections:[NSIndexSet indexSetWithIndex:0] withRowAnimation:UITableViewRowAnimationTop];
注意咯:數(shù)據(jù)我們是一直加在第一條的位置躺坟。
look 旋轉(zhuǎn)180
_tableView.transform = CGAffineTransformMakeScale(1, -1);
然后單單把UITableView旋轉(zhuǎn)沦补,你會(huì)發(fā)現(xiàn),還有問題啊. . . 啊 . . .
什么問題 咪橙? 什么問題 夕膀?
文字內(nèi)容翻轉(zhuǎn)了 。 美侦。 产舞。
那我們?cè)诎盐淖謨?nèi)容的視圖在旋轉(zhuǎn)180,即cell旋轉(zhuǎn)180
self.contentView.transform = CGAffineTransformMakeScale(1, -1);
沒錯(cuò)就是這樣菠剩,重要代碼 . . . 全部在這里了 . . .
效果圖 . . . 找不到上傳GIF的地方 . . . 只能看上面的圖片 . . .
滿意了吧易猫,如果還實(shí)現(xiàn)不了,那么就留下怎么聯(lián)系你吧
或者直接留言具壮,讓本菜鳥試試 . . .
不喜勿噴准颓,大神多多指教哈蝇,謝謝。