前阵子在处理json数据,突然发现或得到的json数据是MarkDown类型的数据,想在app上直接做一个MarkDownView来处理MarkDown类型的json数据。后来,在伟大的github上发现了一个MarkDownView,就决定改改做成自己需要的MarkDownView,所以便有了这个MarkDownView。
原MarkDownView——github:21 Star 548 Fork 102 falnatsheh/MarkdownView
MarkDownView
idea:
将获取到的MarkDown类型的json数据转换成Html,然后通过用WebView来呈现出来。
步骤:
1.导入依赖项
MarkDownView需要导入我们需要的一个依赖项。
在Android Studio中的buil.gradle中添加:
dependencies {
compile 'org.markdownj:markdownj-core:0.4'
}
或者:github-MarkdownJ http://markdownj.org直接下载
2.代码
MarkDownView由于是将json数据转化为Html,所以MarkDownView继承于WebView。
各位看官就将就看下代码,代码就几十行,大家看看就行…-.-
import android.content.Context;
import android.util.AttributeSet;
import android.webkit.WebView;
import org.markdownj.MarkdownProcessor;
/**
* 2016年8月3日 09:35:43
* MarkdownView是继承于WebView的,使用WebView能够浏览HTML的内容的功能,
* 将用compile 'org.markdownj:markdownj-core:0.4'的支持库将我们从
* 数据库获取的JSON数据中的Content内容(MarkDown格式)转换成我们能够查看
* 的网页.
*
* 缺点:这里尚未实现图片点击响应放大缩小的功能
* */
public class MarkdownView extends WebView {
public MarkdownView(Context context) {
super(context);
}
public MarkdownView(Context context, AttributeSet attrs) {
super(context, attrs);
}
/**
* 读取MarkDown字符串并转换成一个Html.
*
* @param json MarkDown字符串
*/
public void loadMarkdown(String json) {
// 第二个参数是样式
loadMarkdownToView(json, "file:///android_asset/paperwhite.css");
}
public void loadMarkdown(String json,String cssFileUrl) {
// 第二个参数是样式
loadMarkdownToView(json, cssFileUrl);
}
private void loadMarkdownToView(String json, String cssFileUrl) {
MarkdownProcessor m = new MarkdownProcessor();
String html = m.markdown(json);
if (cssFileUrl != null) {
html = "<link rel='stylesheet' type='text/css' href='"+ cssFileUrl +"' />" + html;
}
loadDataWithBaseURL("fake://", html, "text/html", "UTF-8", null);
}
}
3.小小的解释
这里就简单的解释下其中主要的函数:
private void loadMarkdownToView(String json, String cssFileUrl) {
MarkdownProcessor m = new MarkdownProcessor();
String html = m.markdown(json);
if (cssFileUrl != null) {
html = "<link rel='stylesheet' type='text/css' href='"+ cssFileUrl +"' />" + html;
}
loadDataWithBaseURL("fake://", html, "text/html", "UTF-8", null);
}
在这个函数中:这玩意MarkdownProcessor 就是将MarkDown文本转换成Html的主要功臣了,这个MarkdownProcessor东西的主要作用就是解析这个。-.-,这个类就是就这个作用。好吧,没了!
MarkDown样式
顺便给各位看官们几个MarkDownView的CSS样式: