前言

由于工作需要，App需要添加社區(qū)功能，要求圖文混排，故研究兩天后完成。

所有需求盡量以原生Android開發(fā)

一、需求

編輯器要求：
1、要求允許插入圖片，視頻，表情。圖片要求可以點擊放大查看
2、可以在文章的任意位置進行插入
閱讀器要求：
1、要求圖文混排
2、要求視頻可以直接在帖子內(nèi)播放

二、思路

編輯器整體可以使用listView或recyclerView完成，兩者皆可，當前使用的為recyclerView + 自定義View完成。

三、實現(xiàn)

1、先做一個背景

image.png

2、完成

image.png

image.png

image.png

中間夾雜了很多東西，先放上完成效果。（手動滑稽）

3、完成細節(jié)
（1）、整體由一個recyclerView構(gòu)成。adapter的Holder共包括三種view，如下

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/content_item"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:focusable="true"
    android:focusableInTouchMode="true"
>
    <com.tlioylc.custom_ui.CustomImageView1
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
    <com.tlioylc.custom_ui.CustomVideoURLView
        android:id="@+id/video"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
    <EditText
        android:id="@+id/text"
        android:textColor="#99ffffff"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="8dp"
        android:lineSpacingExtra = "4dp"
        android:textSize="16sp"
        android:gravity="center_vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textCursorDrawable="@null"
        android:textColorHint="@color/font3"
        android:background="@null"/>
</FrameLayout>

根據(jù)輸入類型來判斷，界面底部為四個控件分別為圖片獲取，攝像，表情及鏈接處理，四種方式的實現(xiàn)方法就暫時先不解釋了，重點說一下表情的問題，表情列表用的是recyclerView多行模式，簡單方便

GridLayoutManager gridLayoutManager = new GridLayoutManager(this,6);
        iconRecyclerView.setLayoutManager(gridLayoutManager);

列表中三種View的實現(xiàn)方式已放入源碼中，可自行查看，如果有問題，可在下方留言處留言。App內(nèi)用的所有圖標基本都為Iconfont，具體不便提交，可自行替換為圖片使用。表情圖標可無限制添加，可以自行上下滾動，如需左右滾動，設置滾動方向即可。
github源碼鏈接：
富文本圖文混排編輯器
歡迎Fork