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);
             }
         });
相关推荐
极梦网络无忧10 小时前
real-ai-editor:一款轻量、智能的纯前端 AI 富文本与 Markdown 编辑器
前端·人工智能·编辑器
longerxin20201 天前
nano编辑器插入、编辑完整操作教程(Linux日志/配置专用)
linux·运维·编辑器
寒水馨2 天前
Windows下载、安装neovim-v0.12.4(附安装包nvim-win64.msi)
windows·编辑器·vim·lua·终端·lsp·neovim
●VON3 天前
鸿蒙 PC Markdown 编辑器内核:在 ArkWeb 中离线运行 CodeMirror 6
安全·华为·编辑器·harmonyos·鸿蒙
●VON3 天前
鸿蒙 PC Markdown 编辑器存储安全:AtomicFile 原子提交与故障注入
安全·华为·编辑器·harmonyos·鸿蒙
●VON4 天前
鸿蒙 PC Markdown 编辑器 Alpha 评审:如何用退出条件判断阶段完成
网络·安全·华为·编辑器·harmonyos·鸿蒙
MGS浪疯4 天前
我用 WorkBuddy 做了一个能记住前文的 AI 小说编辑器
人工智能·编辑器·腾讯云·腾讯云ai代码助手·workbuddy开发者分享季·codebuddy开发者分享季
●VON4 天前
鸿蒙 PC Markdown 编辑器 Bridge 协议:原生外壳与 Web 内核的状态同步
前端·华为·编辑器·harmonyos·鸿蒙
●VON4 天前
鸿蒙 PC Markdown 编辑器原生右键弹层兼容
安全·华为·编辑器·harmonyos·鸿蒙
●VON5 天前
鸿蒙 PC Markdown 编辑器系统浏览器与图片查看器独立验收
华为·编辑器·harmonyos·鸿蒙