---恢復內容開始---

最近,需求要求做一個專輯詳情的圖文混排,整個界面大概分為4部分:

　　1.頂部banner和音頻控制區

　　2.中間圖文混排區,文字解析CSS代碼,圖片做多種跳轉

　　3.下部留言區,可進行點贊

　　4.底部控制區,主要有字號,點贊,留言,分享等調節

大概如下:

由於涉及到隨機跳轉,首先想到的是應該用UITableView或者UICollectionView進行繪制,至於解析CSS代碼則是找一個第三方庫進行處理,在布局的時候UIScrollView和UIButton的結合使用是無法滿足需求的.

通過對比,在GitHub找到了兩個CSS代碼解析庫,其連接和優缺點如下:

1.Gallop-master,鏈接:https://github.com/suxianzhou/Gallop-master

　　優點:

　　　　1) 使用方便

　　　　2) 對於類似於微信公號文章的格式渲染效果好

　　　　3) 集成簡單

　　　　4) 可解析文字和圖片

　　缺點:

　　　　1) 無法直接渲染CSS代碼樣式,展示樣式是用OC代碼自己重新寫的

　　　　2) 只能讀取同意目錄層級下的文字,子目錄無法讀取

　　　　3) 圖片和文字需要分別單獨解析

2.MLLabel,鏈接:https://github.com/molon/MLLabel

　　優點:

　　　　1) 能夠直接將包含圖文信息的CSS代碼以字符串的形式進行解析

　　缺點:

　　　　1) 適配SDWebImage4.0.0,如果工程中有些三方庫適配更低版本,則需要手動升級適配

　　　　2) 只能解析文字,圖片需要服務器單獨給

　　　　3) 文字格式只能按照CSS代碼進行渲染,無法再渲染前或渲染後進行設置

　　　　4) 解析過程需要在主線程進行,如果解析內容過多可能會產生卡頓

我最後選用的是MLLabel

---恢復內容結束---

圖文混排-------專輯詳情