移动端强大的富文本编辑器richeditor-android

最新推荐文章于 2025-05-26 20:00:10 发布

findhappy117

最新推荐文章于 2025-05-26 20:00:10 发布

阅读量5.4k

点赞数 1

CC 4.0 BY-SA版权

文章标签：移动端富文本编辑器 richeditor android

本文链接：https://blog.csdn.net/findhappy117/article/details/88413890

本文介绍了移动端富文本编辑器RichEditor-Android的使用，包括引入控件、所需权限、初始化、监听输入内容及图片适配等功能，并提供了相关代码链接和参考文章。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码地址如下：
http://www.demodashi.com/demo/14883.html

####一、运行效果图

####二、代码具体实现

1.引入richeditor-android

richeditor-android需要的jar：
implementation 'jp.wasabeef:richeditor-android:1.2.2'

这是一个Dialog框架，demo中不想自己去写，所以就使用了第三方
implementation 'com.afollestad.material-dialogs:core:0.9.6.0'

2.引入控件RichEditor

<jp.wasabeef.richeditor.RichEditor
        android:id="@+id/editor"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

3.使用到的权限

如果拍照需要相机权限，选择图片需要SD卡权限，插入网络图片需要网络权限

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.INTERNET" />

4.初始化RichEditor

mEditor = (RichEditor) findViewById(R.id.editor);

//初始化编辑高度
mEditor.setEditorHeight(200);
//初始化字体大小
mEditor.setEditorFontSize(22);
//初始化字体颜色
mEditor.setEditorFontColor(Color.BLACK);
//mEditor.setEditorBackgroundColor(Color.BLUE);

//初始化内边距
mEditor.setPadding(10, 10, 10, 10);
//设置编辑框背景，可以是网络图片
//mEditor.setBackground("https://raw.githubusercontent.com/wasabeef/art/master/chip.jpg");
// mEditor.setBackgroundColor(Color.BLUE);
mEditor.setBackgroundResource(R.drawable.bg);
//设置默认显示语句
mEditor.setPlaceholder("Insert text here...");
//设置编辑器是否可用
mEditor.setInputEnabled(true);

5.实时监听Editor输入内容

mPreview = (TextView) findViewById(R.id.preview);
        mEditor.setOnTextChangeListener(new RichEditor.OnTextChangeListener() {
   
   
            @Override
            public void onTextChange(String text) {
   
   
                mPreview.setText(text);
            }
        });

6.功能方法

     /**
         * 撤销当前标签状态下所有内容
         */
        findViewById(R.id.action_undo).setOnClickListener(new View.OnClickListener() {
   
   
            @Override
            public void onClick(View v) {
   
   
                mEditor.undo();
            }
        });
        /**
         * 恢复撤销的内容
         */
        findViewById(R.id.action_redo).setOnClickListener(new View.OnClickListener() {
   
   
            @Override
            public void onClick(View v) {
   
   
                mEditor.redo();
            }
        });
        /**
         * 加粗
         */
        findViewById(R.id.action_bold).setOnClickListener(new View.OnClickListener() {
   
   

            @Override
            public void onClick(View v) {
   
   
                mEditor.focusEditor();
                mEditor.setBold();
            }
        });
        /**
         * 斜体
         */
        findViewById(R.id.action_italic).setOnClickListener(new View.OnClickListener() {
   
   

            @Override
            public void onClick(View v) {
   
   
                mEditor.focusEditor();
                mEditor.setItalic();
            }
        });
        /**
         * 下角表
         */
        findViewById(R.id.action_subscript).setOnClickListener(new View.OnClickListener() {
   
   
            @Override
            public void onClick(View v) {
   
   
                mEditor.focusEditor();
                if (mEditor.getHtml() == null) {
   
   
                    return;