圖文混排-------專輯詳情
---恢復內容開始---
最近,需求要求做一個專輯詳情的圖文混排,整個界面大概分為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
---恢復內容結束---
圖文混排-------專輯詳情