用NSAttributedString實現簡單的圖文混排

iOS7以後，因為TextKit的強大，可以用NSAttributedString很方便的實現圖文混排（主要是利用了NSTextAttachment）。

關於Textkit的牛逼之處，可以參考objcio上的文章（https://objccn.io/issue-5-1/）

我用NSAttributedString仿寫了一個知乎的輸入框（低仿，就是有個功能而已），效果如圖：

有幾個需要注意的地方，值得記錄一下：

1，textView有個 typingAttributes屬性，可以讓輸入的文字自動變成NSAttributedString，根本不用自己去設定AttributedText；

2，textView有個 selectedRange屬性，就是指當前的游標的位置，可以用來確定插入圖片的位置；

3，如果打斷點觀察textView.text可以發現，插入的圖片被替換成一個特殊的UTF8字元“\U0000fffc”，這個字元在iOS裝置上不會顯示，不是空格，不是換行，

但是，它是存在的！！！它有location，有length（就是1），在整個字串中有位置（NSRage），所以應該把它當成一個佔位的字元來看待！

有了這個佔位字元，其實比沒有要方便，方便上傳伺服器，方便從伺服器獲取資料，方便與其他平臺共通資料；

如果沒有，還要自己記錄圖片的位置，這時候如果有修改，就要更新所有圖片的位置，很麻煩。。。

4，NSTextAttachment要設定bounds屬性，否則圖片會按圖片自己的尺寸顯示，如果圖片太大就會顯示不全

這裡可以把圖片裁一下顯示，上傳圖片的時候，根據需求上傳原圖或者裁剪過的圖片就行，可以讓UI更流暢

5，可以用

string enumerateAttribute:NSAttachmentAttributeNameinRange:NSMakeRange(0, string.length) options:0usingBlock:

這個方法來確定最後的attributedString最終包含的圖片，比每次插入圖片的時候記錄位置要方便的多~

6，知乎是在插入圖片的時候就把圖片上傳到伺服器了，所以把使用者打字的這段時間也利用起來了，不用最後點發布的時候再讓使用者等圖片上傳，雖然有時候可能會多浪費點流量（使用者刪圖片的時候），但是我感覺為了提升的使用者體驗這是值得的~

7，如果從伺服器取資料的話，顯示的時候其實不能用同樣的方式顯示，因為圖片肯定是需要非同步載入的，所以這時候還是要用常規的方法來做，就是一堆文字和圖片的顯示；可以直接用label和imageView排列組合，也可以用一個tableView來顯示

8，textView和textField有一個 inputAccessoryView屬性，是自動跟著鍵盤動的，如果不是需要一直顯示的輸入框，用這個屬性要比監聽鍵盤通知要方便很多~

9，圖片的佔位字元“\U0000fffc”其實是有Attributes樣式的，所以有時候刪除了圖片後的字元，再輸入的時候，新的顯示可能就是預設的Attributes樣式了，所以比較保險的做法是給佔位字元也add正文的Attributes樣式，不知道有沒有更好的辦法~

暫時就這些，等想到再補充~

有什麼問題，歡迎討論~

最新文章