現(xiàn)在很多app都有圖文混排的需求,而且需要支持app端和web端恢准,在這里分享一下自己在做這些方面的探索。
方案一 webview
web的富文本區(qū)別于iOS原生富文本內(nèi)容,是html內(nèi)容
優(yōu)勢(shì):使用webview實(shí)現(xiàn)富文本是一種比較簡(jiǎn)單的方式寞缝,創(chuàng)建webview加載富文本字符串即可,而且可以保持不同iOS端仰泻、Android端荆陆、web端的高度統(tǒng)一
劣勢(shì):webview加載比較消耗性能,如cell中要也要顯示富文本集侯,則需要?jiǎng)?chuàng)建多個(gè)webview被啼,這樣開(kāi)銷(xiāo)較大
具體實(shí)現(xiàn):
1. 由web端文本編輯器生成富文本內(nèi)容帜消,APP端則用UIWebview或WKWebview加載顯示;
2. app端的編輯浓体,如app端支持的編輯格式有限泡挺,可自己將編輯內(nèi)容拼成html富文本格式,如需豐富的編輯樣式命浴,可采用三方框架:ZSSRichTextEditor娄猫,可自動(dòng)生成html富文本
優(yōu)化方案:使用三方框架:DTCoreText,DTCoreText會(huì)對(duì)HTML文件進(jìn)行解析咳促,并自動(dòng)關(guān)聯(lián)相對(duì)應(yīng)的css樣式稚新,輸出帶有排版樣式的NSAttributedString
官方文檔
DTCoreText使用總結(jié)
方案二 CoreText
優(yōu)勢(shì):CoreText 是用于處理文字和字體的底層技術(shù),具有高速的排版效果
劣勢(shì):需要處理編輯的內(nèi)容結(jié)構(gòu),如果需要兼容更多web樣式跪腹,則需要定義更多的內(nèi)容結(jié)構(gòu)
具體實(shí)現(xiàn):web端和app端定義一套統(tǒng)一的內(nèi)容結(jié)構(gòu)褂删,app端,可按照內(nèi)容結(jié)構(gòu)順序轉(zhuǎn)換成NSAttributedString冲茸,進(jìn)行顯示屯阀,這里可以使用YYText
[
{//文字
"type": "text",
"content": "平凡"
},
{//圖片
"type": "image",
"url": "http://www.baidu.com",
"width":100,
"height":100
},
{//鏈接
"type": "link",
"url": "http://www.baidu.com"
}
]
注:編輯的時(shí)候,把文本轴术,圖片难衰,鏈接等樣式按照順序組裝成一個(gè)數(shù)組,轉(zhuǎn)換成富文本的時(shí)候就可以根據(jù)數(shù)組順序解析