android项目实战之编辑器集成

引言

项目需要用到编辑器,采用RichEditor,如下效果

实现

  1. 引入库2

    implementation 'jp.wasabeef:richeditor-android:2.0.0'

  2. XML


    复制代码
         <LinearLayout
             android:orientation="horizontal"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content">
    
             <ImageButton
                 android:id="@+id/action_undo"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/undo" />
    
             <ImageButton
                 android:id="@+id/action_redo"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/redo" />
    
             <ImageButton
                 android:id="@+id/action_bold"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/bold" />
    
             <ImageButton
                 android:id="@+id/action_heading1"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h1" />
    
             <ImageButton
                 android:id="@+id/action_heading2"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h2" />
    
             <ImageButton
                 android:id="@+id/action_heading3"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h3" />
    
             <ImageButton
                 android:id="@+id/action_heading4"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h4" />
    
             <ImageButton
                 android:id="@+id/action_heading5"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h5" />
    
             <ImageButton
                 android:id="@+id/action_heading6"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/h6" />
    
             <ImageButton
                 android:id="@+id/action_insert_image"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:background="@null"
                 android:contentDescription="@null"
                 android:src="@mipmap/insert_image" />
    
    
         </LinearLayout>
    
     </HorizontalScrollView>
     <androidx.core.widget.NestedScrollView
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
         <jp.wasabeef.richeditor.RichEditor
             android:id="@+id/editor"
             android:layout_width="match_parent"
             android:layout_height="wrap_content" />
     </androidx.core.widget.NestedScrollView>
    
     <TextView
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_marginTop="20dp"
         android:text="详情预览"
         android:visibility="gone"
         android:textSize="12sp" />
    
     <TextView
         android:id="@+id/preview"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_marginTop="15dp"
         android:visibility="gone"/>
  3. fragement片段初始化

    private void initEditor(){
    mPreview = (TextView) mActivity.findViewById(R.id.preview);
    mEditor = (RichEditor) mActivity.findViewById(R.id.editor);
    //初始化编辑高度
    mEditor.setEditorHeight(200);
    //初始化字体大小
    mEditor.setEditorFontSize(16);
    //初始化字体颜色
    mEditor.setEditorFontColor(Color.BLACK);
    //初始化内边距
    mEditor.setPadding(10, 10, 10, 10);
    //设置默认显示语句
    mEditor.setPlaceholder("请输入...");
    //设置编辑器是否可用
    mEditor.setInputEnabled(true);

    复制代码
         //mPreview = (TextView) mActivity.findViewById(R.id.preview);
    
         mEditor.setOnTextChangeListener(new RichEditor.OnTextChangeListener() {
             @Override
             public void onTextChange(String text) {
                 mPreview.setText(text);
             }
         });
    
         mActivity.findViewById(R.id.action_undo).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.undo();
             }
         });
    
         mActivity.findViewById(R.id.action_redo).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.redo();
             }
         });
    
         mActivity.findViewById(R.id.action_heading1).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(1);
             }
         });
    
         mActivity.findViewById(R.id.action_heading2).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(2);
             }
         });
    
         mActivity.findViewById(R.id.action_heading3).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(3);
             }
         });
    
         mActivity.findViewById(R.id.action_heading4).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(4);
             }
         });
    
         mActivity.findViewById(R.id.action_heading5).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(5);
             }
         });
    
         mActivity.findViewById(R.id.action_heading6).setOnClickListener(new View.OnClickListener() {
             @Override
             public void onClick(View v) {
                 mEditor.setHeading(6);
             }
         });
相关推荐
初雪云9 小时前
UniApp 云打包拿到 IPA 后,真正的发布工作才刚开始
ios·自动化·编辑器·产品经理·iphone
幸运小圣1 天前
Buffer 新手入门【Node.js】
node.js·编辑器·vim
*wait for?1 天前
VScode使用uv-创建python虚拟环境
ide·vscode·编辑器
lzx_0022 天前
Linux 开发工具(二) 简单认识一下编辑器 —— vim
linux·编辑器·vim
golang学习记3 天前
VSCode AI完成任务的仪式感:撒礼花
ide·vscode·编辑器
mklpo1476 天前
在win7 sp1 系统上安装最新版 的 Visual Studio Code。2026-10-04
ide·vscode·编辑器
Highcharts.js6 天前
图表开发实战总结| 7 条“黄金法则”与“性能铁律”
前端·javascript·vue.js·编辑器·时序数据库·highcharts
广东帝工8 天前
智能防撞进入高增长周期:多技术融合推动桥梁防护从被动硬抗迈向主动预警时代
编辑器
星辰徐哥10 天前
鸿蒙平台 KDevelop 集成开发环境适配实战:基于 Electron 壳方案的跨平台多语言代码编辑器开发
electron·编辑器·harmonyos
风华同学10 天前
vscode远程连接
ide·vscode·编辑器