在Android开发中，通常使用xml格式来描述布局文件。就目前而言，熟悉android布局及美化的人员少之又少，出现了严重的断层。大部分企业，其实还是程序员自己动手布局。这样既浪费时间和精力，也未必能达到理想的效果。但是，在企业级的android开发中，使用html页面进行布局，也有很多的优势（例如：简单，大部分开发人员及美工都熟悉，方便统一进行更新，管理）。据笔者了解，已经有不少的公司在使用这种方式进行布局开发。这也可能是一种趋势。

下面，我将给出一个实例代码，供大家学习使用html页面给Android应用布局。

MainActivity.java

01 package com.dazhuo.ui;  
02     
03 import java.util.List;  
04     
05 import org.json.JSONArray;  
06 import org.json.JSONObject;  
07     
08 import com.dazhuo.domain.Person;  
09 import com.dazhuo.service.PersonService;  
10     
11 import Android.app.Activity;  
12 import Android.content.Intent;  
13 import Android.net.Uri;  
14 import Android.os.Bundle;  
15 import Android.util.Log;  
16 import Android.webkit.WebView;  
17     
18     
19 public class MainActivity extends Activity {  
20    private PersonService service;  
21    private WebView webview;  
22     @Override  
23     public void onCreate(Bundle savedInstanceState) {  
24         super.onCreate(savedInstanceState);  
25         setContentView(R.layout.main);  
26         service =new PersonService();  
27         webview = (WebView) this.findViewById(R.id.webView);//Android内置浏览器对象   
28         webview.getSettings().setJavaScriptEnabled(true);//启用javascript支持   
29         //添加一个js交互接口，方便html布局文件中的javascript代码能与后台java代码直接交互访问   
30         webview.addJavascriptInterface(new PersonPlugin() , "Person");//new类名，交互访问时使用的别名   
31        // <body onload="javascript:Person.getPersonList()">   
32         webview.loadUrl("file:///Android_asset/index.html");//加载本地的html布局文件  
33         //其实可以把这个html布局文件放在公网中，这样方便随时更新维护  例如 webview.loadUrl("www.xxxx.com/index.html");   
34     }  
35     //定义一个内部类，从java后台(可能是从网络，文件或者sqllite数据库) 获取List集合数据，并转换成json字符串，调用前台js代码   
36     private final class PersonPlugin{  
37         public void getPersonList(){  
38          List<Person> list = service.getPersonList();//获得List数据集合   
39          //将List泛型集合的数据转换为JSON数据格式   
40           try {  
41             JSONArray arr =new JSONArray();  
42             for(Person person :list)  
43             {  
44                 JSONObject json =new JSONObject();  
45                 json.put("id", person.getId());  
46                 json.put("name", person.getName());  
47                 json.put("mobile",person.getMobile());  
48              arr.put(json);  
49                 
50             }  
51             String JSONStr =arr.toString();//转换成json字符串   
52             webview.loadUrl("javascript:show('"+ JSONStr +"')");//执行html布局文件中的javascript函数代码--   
53              Log.i("MainActivity", JSONStr);  
54           } catch (Exception e) {  
55             // TODO: handle exception   
56         }  
57             
58         }  
59         //打电话的方法   
60         public void call(String mobile){  
61             Intent intent = new Intent(Intent.ACTION_CALL, Uri.parse("tel:"+ mobile));  
62             startActivity(intent);  
63         }  
64     }  
65 }

Person.java

01 package com.dazhuo.domain;  
02     
03 public class Person {  
04     private Integer id;  
05     public Integer getId() {  
06         return id;  
07     }  
08     public Person(Integer id, String name, String mobile) {  
09         super();  
10         this.id = id;  
11         this.name = name;  
12         this.mobile = mobile;  
13     }  
14     public void setId(Integer id) {  
15         this.id = id;  
16     }  
17     public String getName() {  
18         return name;  
19     }  
20     public void setName(String name) {  
21         this.name = name;  
22     }  
23     public String getMobile() {  
24         return mobile;  
25     }  
26     public void setMobile(String mobile) {  
27         this.mobile = mobile;  
28     }  
29     private String name;  
30     private String mobile;  
31 }

PersonService.java

01 package com.dazhuo.service;  
02     
03 import java.util.ArrayList;  
04 import java.util.List;  
05     
06 import com.dazhuo.domain.Person;  
07     
08 public class PersonService {  
09    public List<Person> getPersonList()  
10    {  
11            
12        List<Person> list =new ArrayList<Person>();  
13        list.add(new Person(32, "aa", "13675574545"));  
14        list.add(new Person(32, "bb", "13698874545"));  
15        list.add(new Person(32, "cc", "13644464545"));  
16        list.add(new Person(32, "dd", "13908978877"));  
17        list.add(new Person(32, "ee", "15908989898"));  
18      return list;  
19    }  
20 }

index.html

01 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
02 <html>  
03 <head>  
04 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
05 <title>Insert title here</title>  
06 <script type="text/javascript">  
07     function show(jsondata){  
08             var jsonobjs = eval(jsondata);  
09             var table = document.getElementById("personTable");  
10             for(var y=0; y<jsonobjs.length; y++){  
11                 var tr = table.insertRow(table.rows.length); //添加一行  
12                 //添加三列  
13                 var td1 = tr.insertCell(0);  
14                 var td2 = tr.insertCell(1);  
15                 td2.align = "center";  
16                 var td3 = tr.insertCell(2);  
17                 td3.align = "center";  
18                 //设置列内容和属性  
19                 td1.innerHTML = jsonobjs[y].id;   
20                 td2.innerHTML = jsonobjs[y].name;   
21                 td3.innerHTML = "<a href='javascript:Person.call(\""+ jsonobjs[y].mobile+ "\")'>"+ jsonobjs[y].mobile+ "</a>";   
22             }  
23     }  
24 </script>  
25     
26 </head>  
27 <!-- js代码通过webView调用其插件中的java代码 -->  
28 <body onload="javascript:Person.getPersonList()">  
29    <table border="0" width="100%" id="personTable" cellspacing="0">  
30         <tr>  
31             <td width="20%">编号</td><td width="40%" align="center">姓名</td><td align="center">电话</td>  
32         </tr>  
33     </table>  
34     <a href="javascript:window.location.reload()">刷新</a>  
35 </body>  
36     
37 </html>

Android 中使用 html 作布局文件的更多相关文章

  1. android中使用html作布局文件

    在android开发中,通常使用xml格式来描述布局文件.就目前而言,熟悉android布局及美化的人员少之又少,出现了严重的断层.大部分企业,其实还是程序员自己动手布局.这样既浪费时间和精力,也未必 ...

  2. Android 自定义View及其在布局文件中的使用示例(三):结合Android 4.4.2_r1源码分析onMeasure过程

    转载请注明出处 http://www.cnblogs.com/crashmaker/p/3549365.html From crash_coder linguowu linguowu0622@gami ...

  3. Android 自定义View及其在布局文件中的使用示例(二)

    转载请注明出处 http://www.cnblogs.com/crashmaker/p/3530213.html From crash_coder linguowu linguowu0622@gami ...

  4. Android 自定义View及其在布局文件中的使用示例

    前言: 尽管Android已经为我们提供了一套丰富的控件,如:Button,ImageView,TextView,EditText等众多控件,但是,有时候在项目开发过程中,还是需要开发者自定义一些需要 ...

  5. android 非activity如何得到布局文件 （java文件中获取布局文件）

    Android中得到布局文件对象有两种方式第一种,在Activity所在类中this.getLayoutInflater().inflater(R.layout.布局文件名,null);第二种,在非A ...

  6. Android笔记——在布局文件中插入另一个布局文件

    假如有一个布局文件A.xml想把另外一个布局文件B.xml引进其布局,则可以通过下面的代码 <include layout="@layout/B" />

  7. android学习——Android Studio下创建menu布局文件

    一.问题: android studio项目中没有看到menu文件夹: 在android studio项目中想要添加menu布局文件,一开始我的做法是:直接在res文件夹右键选择xml文件来添加,如下 ...

  8. Android Studio下创建menu布局文件

    一.问题: android studio项目中没有看到menu文件夹: 在android studio项目中想要添加menu布局文件,一开始我的做法是:直接在res文件夹右键选择xml文件来添加,如下 ...

  9. 源代码解析Android中View的layout布局过程

    Android中的Veiw从内存中到呈如今UI界面上须要依次经历三个阶段:量算 -> 布局 -> 画图,关于View的量算.布局.画图的整体机制可參见博文 < Android中Vie ...

随机推荐

  1. ASP.NET-FineUI开发实践-6(二)

    1.上回说到修改以前的会出现好几个5: 这是因为新增时是只新增到最后一行,所以点击选好了就跑到最后一行了,而且行号不会累积,只加到初始化的行号. 其实js里是有插入的,例子里可以插入到第一行,新增是a ...

  2. eclipse中的web-inf下没有web.xml

  3. mysql查询计划

    mysql查询计划 1:客户端发起查询请求 2:服务器接收到请求后,先查询缓存 如果缓存命中,直接返回数据给客户端 否则,解析sql 3:sql解析完成后,进行预处理 4:有查询优化器生存查询计划 5 ...

  4. sql server备份相关

    本文转载自http://dreamfire.blog.51cto.com/418026/152075/ 感谢作者的分享!!   数据库没有备份---应如何还原丢失的数据   环境描述: 某公司装了一台 ...

  5. [转]C++ list 类学习笔记

    双向循环链表list list是双向循环链表,,每一个元素都知道前面一个元素和后面一个元素.在STL中,list和vector一样,是两个常被使用的容器.和vector不一样的是,list不支持对元素 ...

  6. decode()与case then 学习与使用

    今天做项目的时候遇到一个oracle数值转换的问题,按需求需要对匹配系统时间进行固定赋值,为了避免增加复杂度并易于维护,尽量不要使用存储过程或触发器,最好是使用oracle 自带函数. 如: SQL& ...

  7. Javascript的location对象

    JavaScript window.location对象 示例 注意 方法 经常使用window.location,它的结构总是记不住,简单梳理下,方便以后查询. 示例 URL:http://b.a. ...

  8. How To Learn English Very Fast

    How do you learn English very fast? Every week, I get emails about this topic.   Typically, someone ...

  9. js常用 禁止F5 和右键

    document.oncontextmenu = function() {event.returnValue = false;} //右键 document.onkeydown = function( ...

  10. javascript 滚动条下拉导航fixed

    <!doctype html> <html> <style> body{ margin:; padding:; } #top{ background:#; widt ...