Android WebView代码高亮

引用自http://www.xukailun.me/article/200/

先说明,本博客是参考了上面的博客后,通过自己的总结写出来的。

要使用WebView来做代码高亮,其实是跟浏览器上的原理一样的,无非都是css和js。这些css和js是有现成的了,来自SyntaxHighlighter,点击可以进入下载页面。 

第一、下载了zip包后,找到里面的shBrushJava.js、shCore.js和shCoreDefault.css文件,把文件复制到项目的assets文件夹中,然后制作index.html。

第二、在assets文件夹中新建一个index.html文件。

在index.html中加上如下代码


<!DOCTYPE html>
<html>
<head>
	<title>code demo</title>
	<script type="text/javascript" src="shCore.js"></script>
	<script type="text/javascript" src="shBrushJava.js"></script>
	<link rel="stylesheet" type="text/css" href="shCoreDefault.css">
	<script type="text/javascript">SyntaxHighlighter.all();</script>
</head>
<body>
	<pre class="brush: java;">
	int i = 1;
	while (i != 5) {
	  	switch (i++ % 3) {
	    case 0:
	      System.out.print("A");
	      break;
	    case 1:
	      System.out.print("B");
	      break;
	    case 2:
	      System.out.print("C");
	      break;
	  }
	}
	</pre>

</body>
</html>
第三、使用WebView加载。


先设置WebView支持JavaScript。用以下语句。


webView.getSettings().setJavaScriptEnabled(true);
然后读取assets中的index.html文件的内容。



try {
	InputStream is = context.getResources().getAssets()
						.open("index.html");
	ByteArrayOutputStream bs = new ByteArrayOutputStream();
	byte[] buffer = new byte[1024];
	int i = 0;
	while ((i = is.read(buffer, 0, buffer.length)) > 0) {
		bs.write(buffer, 0, i);
	}
		content = new String(bs.toString());
	} catch (IOException e) {}
}


接下来吧内容加载到WebView中,webView.loadDataWithBaseURL("file:///android_asset/",
content, "text/html", "utf-8", null);

这样webView显示的代码就可以高亮了,如果要想动态改变代码,可以使用字符串替换的方法,具体方法就不说了。下面说一下SyntaxHighlighter的使用吧。

假如完全使用我的index.html的代码,你会看见左面有序号和一条绿色的线,而右上角就会多了一个问号,如果你想去掉的话就把

<pre class="brush: java;">

改为

<pre class="brush: java; gutter: false; gutter: false;toolbar: false;">
这样就可以了!!!


你可能感兴趣的:(WebView代码高亮)