方案一:AutoLayout
1,autolayout 的第三庫用的是SDAutoLayout的同學(xué)多矮,可以使用這種方案
這里著重說下cell 里評論視圖的實現(xiàn)
1, 因為這部分的數(shù)據(jù)是不確定的蛾默,我之前的做法是重用的時候先刪除所有l(wèi)able 粪躬,然后根據(jù)model 數(shù)組袄友,重新創(chuàng)建lable 添加到cell 上殿托,這種方案非常不可取,而且滑動也比較卡頓剧蚣。
2支竹,SDAutoLayout 的demo 里用到了 label 重用的方法。它自定義了評論視圖 SDTimeLineCellCommentView,這個類里面創(chuàng)建commentLabelsArray 數(shù)組鸠按,用于存儲已經(jīng)創(chuàng)建的評論label 唾戚,當(dāng)重用時,如果評論數(shù)據(jù)的條數(shù)多于之前的(通過比較commentItemsArray數(shù)組和commentLabelsArray)待诅,那就繼續(xù)創(chuàng)建并添加到commentLabelsArray叹坦。如果少于之前的,就隱藏卑雁。然后在開始創(chuàng)建lable 和重用lable的時候募书,都需要重新綁數(shù)據(jù)和設(shè)置約束。测蹲,這種方案避免了頻繁的創(chuàng)建lable 莹捡,addSubView 和removeAllSubViews。
2扣甲,第三庫用的是Masonry篮赢,可以看看這種方案
demo里提供了兩種方案,主要是布局上的區(qū)別:
1琉挖,第一種是cell里嵌套tableview 启泣,使用masonry布局,加上HYBMasonryAutoCellHeight 的緩存高度
2示辈,第二種是將內(nèi)容視圖寥茫,九宮格圖片和評論視圖分開成,headview 和 cell 的方式
這種方案其實是將整個動態(tài)分成4個部分矾麻。文字和圖片是自定義的UITableHeaderFooterView纱耻,點贊部分是定義cell ,評論部分也是自定義cell 险耀,然后在viewForFooterInSection返回高度為10 的區(qū)尾視圖弄喘。這種方案需要注意就是點贊視圖和評論視圖是分開的,所以帶有小三角的背景圖片不是包含點贊視圖和評論視圖的甩牺,也就是說如果沒有點贊數(shù)據(jù)蘑志,評論cell 的背景是沒有小三角的,demo 里評論cell 的背景也是用的顏色,而不是圖片卖漫。
方案二:YYKit
- https://blog.ibireme.com/2015/11/12/smooth_user_interfaces_for_ios/ 可以按照YYKit里的Demo 來進行優(yōu)化费尽,
1, 沒有用自動布局,用的是frame 布局
2,在拿到數(shù)據(jù)的時候就已經(jīng)計算好了布局羊始,model -> Layout 旱幼,其它的方法,可能是布局cell的時候突委,再去計算
方案三:VVeboTableViewDemo
- 這是第三方微博給的優(yōu)化思路: https://blog.ibireme.com/2015/11/12/smooth_user_interfaces_for_ios/
不過有個缺點柏卤,就是快速滑動中會出現(xiàn)大量空白內(nèi)容
方案四:AsyncDisplayKit
AsyncDisplayKit 是 Facebook 開源的一個用于保持 iOS 界面流暢的庫,他們自己實現(xiàn)一套異步布局和渲染的機制。它的學(xué)習(xí)成本有點大匀油,可以參考自己項目缘缚,酌情使用,下面是一些學(xué)習(xí)文檔:
- 1, 大神自己翻譯的文檔:https://github.com/Awhisper/AsyncDisplayKitDocTranslation
- 2, 即刻技術(shù)團隊的博客:https://juejin.im/user/58b545d961ff4b005cb9ac1a
- 3, 關(guān)于它的布局模式可以看看 Flex 布局教程:語法篇 http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html 和 Flex 布局教程:實例篇http://www.ruanyifeng.com/blog/2015/07/flex-examples.html敌蚜,當(dāng)初學(xué)RN的時候就是看這兩篇文章的桥滨,受益匪淺。
- 4弛车,AsyncDisplayKit 教程:達到 60 FPS 的滾動幀率:https://github.com/nixzhu/dev-blog/blob/master/2014-11-22-asyncdisplaykit-tutorial-achieving-60-fps-scrolling.md
- 5齐媒,AsyncDisplaykit2.0使用「復(fù)雜界面流暢性」 http://www.reibang.com/p/afc69cd9e824 這篇文章也很詳細。
- 6, AsyncDisplayKit近一年的使用體會及疑難點 :http://qingmo.me/2017/07/21/asyndisplaykit/
方案五:Gallop
這個庫star 比較少纷跛,不過微信朋友圈Demo的滑動的效果很好,底層用的都是 CoreText,而且也用到了異步渲染喻括。
六唬血,這里說說自己在項目中遇到的一些問題
- 1,我在項目中一開始的方案是xib 布局加 FDTemplateLayoutCell 緩存高度唤崭,富文本用的是TTTAttributedLabel拷恨,開發(fā)速度確實很快,但滑動效果不是很好,后來按照YYKit 中的demo 做了優(yōu)化浩姥,在拿到數(shù)據(jù)就計算了布局挑随,然后也將UILabel 換成了 YYLabel,棄用了autolayout 采用frame 布局勒叠。然后就是評論視圖采用的是SDAutoLayout demo 中的方案,滑動效果好了很多膏孟。
- 2, 閃爍: Gallop 和 AsyncDisplayKit 在刷新的時候都會閃爍一下眯分。Gallop 在Demo 里給的解決辦法是先在當(dāng)前視圖控制器的view上添加一張截圖,刷新完之后再去掉柒桑。關(guān)于AsyncDisplayKit 的解決方法可以看看上面方案三的最后一篇文章弊决。
- 3, 如果要實現(xiàn)像微博那樣的既有圖文混排,又有視頻播放的列表∑可以試試AsyncDisplayKit 与倡,它已經(jīng)提供了ASVideoNode 節(jié)點,用于在高速滑動的滾動列表嵌入視頻昆稿。
- 4纺座,YYKit,VVeboTableViewDemo溉潭,Gallop 底層使用的都是 CoreText净响,可以看看這幾篇文章:
http://blog.devtang.com/2015/06/27/using-coretext-1/
CoreText實現(xiàn)圖文混排 http://www.reibang.com/p/6db3289fb05d