iOS開發之商品評價列表的構建

首先看一下效果


效果圖.gif

Demo中使用了幾個三方


image.png

image.png

注: 查看大圖片的這個工具有點坑,不知道是我不會使用還是原本就有bug,坑在下面的這個地方,如果不修改的話,會導致下拉刷新的操作被屏蔽,因爲offset距離頂部爲0了,剛好被屏蔽了。


image.png

言歸正傳說Demo

cell主要由三部分組成:
第一部分是用戶基本信息和文字評論區域,第二部分是圖片顯示部分,獨立出去的一個XBWCSMyOrderEvaluationImageView,這樣方便操控view的顯示,如果需要33矩陣佈局或者其他42矩形佈局的,也方便佈局。唯一注意的是imageview的複用,防止圖片混亂,造成最終查看大圖造成崩潰。第三部分是商家回覆區域,也是獨立出去的XBWCSMyOrderEvaluationReplyView。

image.png

佈局說完了,說高度的問題。
像這種的文字較多,不確定高度的cell,就需要用到緩存高度的思想,一方面是爲了佈局的正確性,另一方面是爲了優化cell的流暢度。我們知道在tableview的滑動過程中,會不斷的調用

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;

這個方法,如果將cell的高度計算放在這裏,將會造成不可限量的消耗,可能數據量小的時候看不出來,但是量多了,就可怕了。
大多數的高度緩存思想,無非就是拿到數據即拿到高度,數據是死的,高度也就是死的,只是看怎麼去處理這個高度。


image.png

在獲取到數據的時候,剝離出去一個方法,用於計算cell的高度。同時在創建數據model的時候,多添加一個cellHeight屬性,將計算好的高度再次賦值給cellHeight這個屬性。


image.png

這樣我們就將需要的高度緩存起來了,在後面需要的時候,取出cellHeight就可以了。


image.png

計算文字高度,其實很簡單就是計算富文本size


image.png

額外補充下查看大圖的方法


image.png

傳送門

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章