您的位置:首页 > Web前端

Butterknife工具类之-自动解析网页版

2016-11-25 15:53 393 查看

Butterknife工具类-自动解析网页篇

背景

Butterknife想必大家都很熟悉,解决了我们手动重复写大量的findViewById和点击事件功能!理论上说已经很完美了,但是对于我这样的懒人来说还是麻烦,因为还是要写@InjectView和@Bind方法

网上提供了一种解决方案Android Butterknife Zelezny这个插件,但是使用过程中还是感觉不是很完美,因为需要手动选择生成很监听对象,每修改一次都要重复的使用这个插件导入;还有就是一次多个监听自动写成了switch语句,导致逻辑混乱还要自己分开写方法……所以决定自己编写一个工具类使用html通过网页的方式来实现自动解析!

本篇主要是提供给大家另一种偷懒的方式,赢在创意,技术性不是太强!

效果



使用

直接将html文件拖入到浏览器中,可以收藏网页在标签栏,下次打开会自动导入xml界面

将xml的layout布局文件copy到第一个显示栏中,点击读取即可

功能

设置变量的统一前缀,修饰符,注入和事件模板,字母大写等

自动解析:生成switch语句;传统findview对象和代码;butterknife注释类和事件对象方法

实现

熟悉html的同学可以了解下,因为是用html实现,很简单!亮点在于创意

工具栏

主要是显示可设置变量的工具栏

<body >
<div>
名字前缀 <input id="default_name" value="m"></input><br\>
title <input id="title" value=""></input><br\>
mainView <input id="mainView" value="this"></input><br\>
注入变量模板 <input id="default_id" value="@BindView  (R.id.?)"></input><br\>
注入事件模板 <input id="default_event" value="@OnClick(value = R.id.?)"></input><br\>
<input id="checkbox" type="checkbox" checked="true">首字母大写</input>
<button onclick="initializeSelect()">读取</button><br\>
<button onclick="clearData()">还原</button><br\>

</div>

<textarea  id="text1"   style="height:30%;width:40%"></textarea>
<textarea    id="show5"   style="height:30%;width:40%"></textarea>

<textarea    id="show1"  style="height:30%;width:40%"></textarea>

<textarea    id="show2"   style="height:30%;width:40%"></textarea>

<textarea    id="show3"   style="height:30%;width:40%"></textarea>
<textarea    id="show4"   style="height:30%;width:40%"></textarea>
</body>
</body>


读取xml数据

将layout布局复制到第一个显示框中,通过xml解析得到我们的数据对象

loadXML = function(xmlString){
var xmlDoc=null;
if(!window.DOMParser && window.ActiveXObject){   //window.DOMParser
var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
for(var i=0;i<xmlDomVersions.length;i++){
try{
xmlDoc = new ActiveXObject(xmlDomVersions[i]);
xmlDoc.async = false;
xmlDoc.loadXML(xmlString); //loadXML
break;
}catch(e){
}
}
}
else if(window.DOMParser && document.implementation && document.implementation.createDocument){
try{

domParser = new  DOMParser();
xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
}catch(e){
}
}
else{
return null;
}

return xmlDoc;
}


解析显示

将解析的的原始数据,按照分类分别解析然后显示在对应的显示框中,很简单都是些html标签和方法,感兴趣的同学可以自行研究!

initializeSelect = function(){
var oShow1 = document.getElementById("show1");
var oShow2 = document.getElementById("show2");
var oShow3 = document.getElementById("show3");
document.getElementById("show4").value = "";;
document.getElementById("show5").value = "";
oShow1.value = "";
oShow2.value = "";
oShow3.value = "";
var xmlstr= document.getElementById("text1").value;
var xmlDoc = checkXMLDocObj(xmlstr);
title = document.getElementById("title").value;
mainView = document.getElementById("mainView").value;
default_name = document.getElementById("default_name").value;
default_id = document.getElementById("default_id").value;
default_event = document.getElementById("default_event").value;
checkbox = document.getElementById("checkbox").checked;
getNotes(xmlDoc.documentElement);

}
getNotes = function(nnn){
var ch = nnn.childNodes;
if(ch != null &&  ch.length != 0){
writeNotesName(nnn);
for(var j=0;j<ch.length;j++){
if(ch[j].nodeName != "#text" ){
getNotes(ch[j]);
}
}
}else{
writeNotesName(nnn);
}

}
writeNotesName = function(nnn){
var oShow1 = document.getElementById("show1");
var oShow2 = document.getElementById("show2");
var oShow3 = document.getElementById("show3");
var oShow4 = document.getElementById("show4");
var oShow5 = document.getElementById("show5");
var data3 = "-1";

var data = "-1";
data = nnn.nodeName;

var mdata = "-1";
var attrs = nnn.attributes;
if(attrs != null){
for(var k=0;k<attrs.length;k++)
{
var attr = attrs[k];
var attr_name = attr.name;
if(attr_name == "android:id" ){
var attr_value =  attr.value;
mdata = attr_value;
}
}
}

if(mdata != "-1" && data != "-1" && data != null){
mdata = mdata.replace("@+id/","");
var name = getViewName(mdata);

oShow1.value = oShow1.value + "\n" +title+" "+data+" "+default_name+name+";";

data3= "\n" +default_id.replace("?",mdata)+"\n"+title+" "+data+" "+default_name+name+";"

if(mainView != "" && mainView != undefined && mainView != null && mainView.indexOf(".") == -1)
mainView = mainView+".";

oShow2.value = oShow2.value + "\n" +" "+default_name+name+" = ("+data+") "+mainView+"findViewById(R.id."+mdata+");";
oShow3.value = oShow3.value + data3;
oShow4.value = oShow4.value + "\n"  + default_event.replace("?",mdata)+"\nvoid on"+name+"Click(View view) {}";
var idCick = oShow5.value;
if(idCick.indexOf("}") != -1){
var nn1 = idCick.substring(0,idCick.indexOf("}"));
oShow5.value = nn1 + "\n"  + "case R.id."+mdata+":\n  break;\n}";
}else
oShow5.value = oShow5.value + "switch (view.getId()) {\n"  + "case R.id."+mdata+":\n  break;}";
}
}
getViewName = function(name){
var a;
if(checkbox){
a = name.substring(0,1);
a = a.toUpperCase( );
name = name.substring(1,name.length);
name = a + name;
}
while(name.indexOf("_") != -1){
var index = name.indexOf("_");
var nn1 = name.substring(0,index);
var nn2 = name.substring(index+1,name.length);
a = nn2.substring(0,1);
a = a.toUpperCase( );
nn2 = nn2.substring(1,name.length);
nn2 = a + nn2;
name = nn1+nn2;
}
return name;
}

var title = "";
var mainView = "this";
var default_name = "m";
var default_id = "@BindView  (R.id.?)";
var default_event = "@OnClick(value = R.id.?)";
var checkbox = true;

clearData = function(){
var oShow1 = document.getElementById("show1");
var oShow2 = document.getElementById("show2");
var oShow3 = document.getElementById("show3");
document.getElementById("show4").value = "";
document.getElementById("show5").value = "";

var text = document.getElementById("text1");
title = "";
mainView = "this";
default_name = "m";
default_id = "@BindView  (R.id.?)";
default_event = "@OnClick(value = R.id.?)";

text.value = "";
oShow1.value = "";
oShow2.value = "";
oShow3.value = "";
document.getElementById("title").value = title;
document.getElementById("mainView").value = mainView;
document.getElementById("default_name").value = default_name;
document.getElementById("default_id").value = default_id;
document.getElementById("default_event").value = default_event;
document.getElementById("checkbox").checked = true;

}
</script>


总结

本章和Android技术关系不大,只不过是给大家分享自己的小工具,其实开发工程中大家可以多多试验,多点想法解放我们的双手,不会偷懒的程序猿不是好程序猿哦!

文件传送门-csdn
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: