前几天，前同事找到我，具体是让我帮忙，实现一个类似答题的UI页面（这哥们又接外包了－－！）。
1、具体功能如图：
2、做为一个android程序员，首先自然想到是在android上如何实现。捋了一下官方给出的所有控件，并没有能解决该UI界面的方法，于是，只能自定义view了。
3、首先思路是创建自定义view，然后用textPaint绘制文字及下划线。用onTouch判断位置，设置点击事件。思路很清晰，做下去后发现，存在两个问题。
- textPaint无法绘制出下划线。（原因未明）
- 点击事件该如何设置。
4、无法绘制下划线的问题，可能是厂商或者版本的问题，具体也没有去深究了（真不是一个合格的程序员。。。）
5、既然解决不了上述两个问题，只能用其他办法了。条条大路同罗马嘛，不能在一个胡同里面扎死。所以灵机一动，为什么不用h5实现。
6、思路是有了，技术上基本没有难点。点击事件只需要简单的h5与源生交互。行了，马上行动。
7、具体方法如下：
1、编写h5代码：
/********************
* 作者：malus
* 日期：16/10/15
* 时间：上午10:06
* 注释：
********************/
public class StringUtil {
static String[] str = {" ① "," ② "," ③ "," ④ "," ⑤ "," ⑥ "," ⑦ "," ⑧ "," ⑨ "," ⑩ "," ⑪ "," ⑫ "," ⑬ "," ⑭ "," ⑮ "," ⑯ "," ⑰ "," ⑱ "," ⑲ "," ⑳ "};
static String msg = "The Zapata rail (@ cerverai) is a medium-sized, dark-coloured rail. It has brown @, greyish-blue underparts, a red-based yellow bill, white undertail coverts, and red eyes and @. Its short wings render it almost flightless. It is endemic to the wetlands of the Zapata Peninsula in southern @, where its only known nest was found in sawgras.";
static int mIndex = 0;
public static String getQuestion(){
msg = "<!DOCTYPE html><meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" /><html><body>"+msg+"</html></body>";
while (msg.contains("@")){
msg = msg.replaceFirst("@","<a href='http://www.baidu.com?index="+mIndex+"'>"+str[mIndex]+"</a>");
mIndex++;
}
return msg;
}
}
2、webview展示：
<span style="white-space:pre"> </span>mWebView = (WebView)findViewById(R.id.webview);
mWebView.loadData(StringUtil.getQuestion(),"text/html; charset=UTF-8",null);3、点击事件交互：
<span style="white-space:pre"> </span>mWebView.setWebViewClient(new WebViewClient(){
@Override
public void onLoadResource(WebView view, String url) {
super.onLoadResource(view, url);
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if(url.contains("index=")){
String index = url.split("index=")[1];
int mIndex = Integer.parseInt(index);
Toast.makeText(MainActivity.this,"答案"+mIndex,Toast.LENGTH_LONG).show();
}
return true;
}
});8、实现结果我就不描述了。这里并没有涉及到太难的技术点。我只是想提供一个思路，就是一个复杂的，源生难以实现的页面，换做h5实现可能也是一个不错的方法。如果只是简单的loaddata，对性能的影响应该不大。
9、感谢阅读，纯分享，不喜勿喷。