在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. noip 2009 道路游戏

    /*10分钟的暴力 意料之中的5分..*/ #include<iostream> #include<cstdio> #include<cstring> #defin ...

  2. hdu 1175

    #include <iostream> #include <string> #include <stdio.h> using namespace std; int ...

  3. hdu 2190

    //hdu2190 水题  题意是给一个n*3的教室,用1*1,2*2的砖去铺满,有多少种铺法,一开始没发现这个规律,想了一下,应该是递归. #include <iostream> usi ...

  4. 【转】Multithreaded Python Tutorial with the “Threadworms” Demo

    The code for this tutorial can be downloaded here: threadworms.py or from GitHub. This code works wi ...

  5. Android开发中在一个Activity中关闭另一个Activity

    比如有ActivityA, ActivityB,在ActivityB中关闭ActivityA 解决方案: 1. 在 ActivityA 里面设置一个静态的变量instance,初始化为this在 Ac ...

  6. 《CSS网站布局实录》学习笔记（三）

    第三章 CSS网页布局与定位 3.1 div 几乎XHTML中的任何标签都可以用于浮动与定位,而div首当其冲.对于其他标签而言,往往有它自身存在的目的,而div元素存在的目的就是为了浮动与定位. 3 ...

  7. 以下是jQuery和JavaScript实现相同操作的等价代码。

    选择元素  Javascript代码 1.// jQuery   2.var els = $('.el');   3.  4.// 原生方法   5.var els = document.queryS ...

  8. JS数组常用方法

      // 来自 http://www.runoob.com/jsref/jsref-obj-array.html   var arr01 = [ "fuc" , "shi ...

  9. 武汉科技大学ACM ：1004: 零起点学算法74——Palindromes _easy version

    Problem Description “回文串”是一个正读和反读都一样的字符串,比如“level”或者“noon”等等就是回文串.请写一个程序判断读入的字符串是否是“回文”. Input 输入包含多 ...

  10. php中JPGraph入门配置与应用

    什么是PHP JPGraph? 专门提供图表的类库.它使得作图变成了一件非常简单的事情.生成非美工人士生成的图表.二维码算法. 到官方网站下载. docportal 帮助手册 src 包含主要代码. ...