以前有个项目做一个笔记本类似的东西,觉得写的不太好,最近重新写,就发现了这个富文本编辑器他的效果是这样的
感觉有点厉害啊
废话不多说开始撸码
1先添加依赖
dependencies {
compile ‘jp.wasabeef:richeditor-android:1.2.0’
}
2写布局
<jp.wasabeef.richeditor.RichEditor
android:id="@+id/editor"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" />
3设置属性啥的
RichEditor mEditor = (RichEditor) findViewById(R.id.editor);
mEditor.setEditorHeight(200);//起始编辑设置高度
mEditor.setEditorFontSize(22);//设置字体大小
mEditor.setEditorFontColor(Color.RED);//设置字体颜色
mEditor.setBold();//设置粗体
mEditor.setItalic();//设置斜体
mEditor.insertImage(RealPath, "image");//添加图片,这个图片可以是本地路径也可以是网络路径 网络路径需要添加访问网络权限,本地需要读写存储器权限
//。。。。还有好多方法大家慢慢去发现
4那我们怎么拿到这个日记文件
mEditor.setOnTextChangeListener(new RichEditor.OnTextChangeListener() {
@Override
public void onTextChange(String text) {
mPreview.setText(text);//这个text就是所输入的所有文件 他是一个html格式的
}
});
5:打开这个日记
上面说到拿到这个text了 读取这个text只需要
mEditor.setHtml(text);//就会在编辑器里面显示
6在webview里面显示
WebView webView = (WebView) findViewById(R.id.showdiarys);
webView.loadDataWithBaseURL(null, Text, "text/html", "utf-8", null);
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient());
附上所有的文件 摘自github,自己用的话改点东西
MainActivity.java
package jp.wasabeef.sample;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.TextView;
import jp.wasabeef.richeditor.RichEditor;
public class MainActivity extends AppCompatActivity {
private RichEditor mEditor;
private TextView mPreview;
@Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mEditor = (RichEditor) findViewById(R.id.editor);
mEditor.setEditorHeight(200);
mEditor.setEditorFontSize(22);
mEditor.setEditorFontColor(Color.RED);
//mEditor.setEditorBackgroundColor(Color.BLUE);
//mEditor.setBackgroundColor(Color.BLUE);
//mEditor.setBackgroundResource(R.drawable.bg);
mEditor.setPadding(10, 10, 10, 10);
// mEditor.setBackground("https://raw.githubusercontent.com/wasabeef/art/master/chip.jpg");
mEditor.setPlaceholder("Insert text here...");
mPreview = (TextView) findViewById(R.id.preview);
mEditor.setOnTextChangeListener(new RichEditor.OnTextChangeListener() {
@Override public void onTextChange(String text) {
mPreview.setText(text);
}
});
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.setBold();
}
});
findViewById(R.id.action_italic).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setItalic();
}
});
findViewById(R.id.action_subscript).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setSubscript();
}
});
findViewById(R.id.action_superscript).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setSuperscript();
}
});
findViewById(R.id.action_strikethrough).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setStrikeThrough();
}
});
findViewById(R.id.action_underline).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setUnderline();
}
});
findViewById(R.id.action_heading1).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(1);
}
});
findViewById(R.id.action_heading2).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(2);
}
});
findViewById(R.id.action_heading3).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(3);
}
});
findViewById(R.id.action_heading4).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(4);
}
});
findViewById(R.id.action_heading5).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(5);
}
});
findViewById(R.id.action_heading6).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setHeading(6);
}
});
findViewById(R.id.action_txt_color).setOnClickListener(new View.OnClickListener() {
private boolean isChanged;
@Override public void onClick(View v) {
mEditor.setTextColor(isChanged ? Color.BLACK : Color.RED);
isChanged = !isChanged;
}
});
findViewById(R.id.action_bg_color).setOnClickListener(new View.OnClickListener() {
private boolean isChanged;
@Override public void onClick(View v) {
mEditor.setTextBackgroundColor(isChanged ? Color.TRANSPARENT : Color.YELLOW);
isChanged = !isChanged;
}
});
findViewById(R.id.action_indent).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setIndent();
}
});
findViewById(R.id.action_outdent).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setOutdent();
}
});
findViewById(R.id.action_align_left).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setAlignLeft();
}
});
findViewById(R.id.action_align_center).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setAlignCenter();
}
});
findViewById(R.id.action_align_right).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setAlignRight();
}
});
findViewById(R.id.action_blockquote).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.setBlockquote();
}
});
findViewById(R.id.action_insert_image).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.insertImage("http://www.1honeywan.com/dachshund/image/7.21/7.21_3_thumb.JPG",
"dachshund");
}
});
findViewById(R.id.action_insert_link).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.insertLink("https://github.com/wasabeef", "wasabeef");
}
});
findViewById(R.id.action_insert_checkbox).setOnClickListener(new View.OnClickListener() {
@Override public void onClick(View v) {
mEditor.insertTodo();
}
});
}
}
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/black">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="@+id/action_undo"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/undo" />
<ImageButton
android:id="@+id/action_redo"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/redo" />
<ImageButton
android:id="@+id/action_bold"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/bold" />
<ImageButton
android:id="@+id/action_italic"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/italic" />
<ImageButton
android:id="@+id/action_subscript"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/subscript" />
<ImageButton
android:id="@+id/action_superscript"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/superscript" />
<ImageButton
android:id="@+id/action_strikethrough"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/strikethrough" />
<ImageButton
android:id="@+id/action_underline"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/underline" />
<ImageButton
android:id="@+id/action_heading1"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h1" />
<ImageButton
android:id="@+id/action_heading2"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h2" />
<ImageButton
android:id="@+id/action_heading3"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h3" />
<ImageButton
android:id="@+id/action_heading4"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h4" />
<ImageButton
android:id="@+id/action_heading5"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h5" />
<ImageButton
android:id="@+id/action_heading6"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/h6" />
<ImageButton
android:id="@+id/action_txt_color"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/txt_color" />
<ImageButton
android:id="@+id/action_bg_color"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/bg_color" />
<ImageButton
android:id="@+id/action_indent"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/indent" />
<ImageButton
android:id="@+id/action_outdent"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/outdent" />
<ImageButton
android:id="@+id/action_align_left"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/justify_left" />
<ImageButton
android:id="@+id/action_align_center"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/justify_center" />
<ImageButton
android:id="@+id/action_align_right"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/justify_right" />
<ImageButton
android:id="@+id/action_blockquote"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/blockquote" />
<ImageButton
android:id="@+id/action_insert_image"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/insert_image" />
<ImageButton
android:id="@+id/action_insert_link"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@drawable/insert_link" />
<ImageButton
android:id="@+id/action_insert_checkbox"
android:layout_width="48dp"
android:layout_height="48dp"
android:background="@null"
android:contentDescription="@null"
android:src="@android:drawable/checkbox_on_background" />
</LinearLayout>
</HorizontalScrollView>
<jp.wasabeef.richeditor.RichEditor
android:id="@+id/editor"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="HTML Preview"
android:textSize="12sp" />
<TextView
android:id="@+id/preview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp" />
</LinearLayout>
代码片
showText.java
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.widget.TextView;
public class showText extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_show_diarys);
final Bundle bundle = getIntent().getExtras();
final String title = bundle.getString("title");
TextView diaryTitle = (TextView) findViewById(R.id.diarytitle);
diaryTitle.setText(title);
TextView edit = (TextView) findViewById(R.id.editDiary);
final String diarysText = bundle.getString("diarys");
edit.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent();
intent.setClass(ShowDiarysActivity.this, EditActivity.class);
Bundle bundle1 = new Bundle();
bundle.putString("title", title);
bundle.putString("diary", diarysText);
intent.putExtras(bundle);
startActivity(intent);
}
});
// diarysText.replace("src=\"","src=\"file:/");
// diarysText = "<html>"
// + "<body>" + "加班<sub>啊啊啊墨迹<strike>呃呃呃</strike></sub><img src=//storage/emulated/0/DCIM/P60623-161740.jpg\" alt=\"dachshund\">" + "</body>" + "</html>";
System.out.println(diarysText);
String imageUrl = "file:/storage/emulated/0/DCIM/P60623-161740.jpg";
// String data = "<HTML><IMG src=\""+imageUrl+"\""+"/>";
// webview.loadDataWithBaseURL(imageUrl, data, "text/html", "utf-8", null);
WebView webView = (WebView) findViewById(R.id.showdiarys);
webView.loadDataWithBaseURL(imageUrl, diarysText, "text/html", "utf-8", null);
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient());
}
}
附上下载地址
时间: 2024-10-05 22:18:12