android高仿今日頭條富文字編輯(釋出文章)

前言： 在經歷了幾個月的專案期限。我們遇到了前端釋出文章，要用到富文字編輯的功能。在一番衡量下最終用到了richeditor-android第三方框架。實現原理就是通過webView和js實現前端富文字。有想了解的可以點開上面連結，研究研究。雖然richeditor-android已經幫我們實現了大部分核心內容，但是很多細節它都沒有完善，這也是為什麼他的issues達到170多的原因。也不知道它有沒有停更。接下來是作者踩了N多坑之後，把功能基本補全。可以說是高仿「今日頭條富文字編輯」。

一、先來看看都實現了補全了哪些功能

（這裡不會重複richeditor-android原有功能，只會詳細講解補全的細節功能）

1.1、在沒有焦點時，主動獲取焦點並彈出軟鍵盤

修改後： 在第一開啟富文字編輯時，點選加粗，下劃線或上傳圖片時，主動獲取焦點並彈出軟鍵盤。

1.2、在遊標主動回到某處，下方tab選中當前的樣式，同理復原和回退

修改後： 在遊標變化，復原回退，或者主動點刪除時，下方tab會根據當前樣式選中要選中的樣式

1.3、上傳圖片，自動換行，且自動捲動到底部。且充滿螢幕

修改後： 選中圖片後，插入圖片自動換行，自動捲動到底部，彈出軟鍵盤。（圖片充滿螢幕）

1.4、點選圖片，可編輯圖片（剪裁），或刪除圖片

修改後： 點選圖片增加了刪除和編輯功能，編輯剪裁圖片也是模仿頭條的。（注：這裡的圖片選擇和圖片剪裁是其他第三方，後續給上連結，作者修改後增加了比例切換的動畫，且適配了全面屏和處理了虛擬鍵）

1.5、根據頭條的排版樣式，修改了文字，圖片還有序號的排版樣式

修改後： 原樣式，比較不理想。在看了頭條的排版樣式後，修改了css樣式。儘量模仿出頭條的感覺

1.6、選中文字後，在不點選螢幕前，選中文字都不變。高度模仿頭條

修改後： 之前點選1下或者2下加粗時，選中文字會取消。現在不是主動點選螢幕，選中文字不會取消

1.7、在作者在實現這塊功能時，還遇到了缺少ssl證書，圖片沒法顯示出來。還加了忽略ssl證書

在華為和小米都有出現過。出現的時候，我用頭條app去上傳圖片也是遇到上傳圖片失敗。過一會，手機又正常了。反正加上忽略ssl是一定可以成功的。

二、現在讓我們一起看看釋出文章重新編輯的功能吧、

三、總結。

至此一個高仿頭條的富文字就此而生。如果你開發遇到了或者有什麼古怪的功能還不滿足你的要求，請聯絡我。

• 文中用到的圖片選擇框架，建議用demo的，是作者適配全面屏修改過的
• 文章用到的剪裁框架，建議用demo的，是作者適配全面屏修改過的
• 請注意：文中用到本地路徑的圖片，如果是網圖，則可直接替換成網圖即可
• 最終生成的是html,可在前端各個端展示

高仿今日頭條富文字編輯，釋出文章，github地址

想和我一起成長嗎？請關注我的公眾號