WebView

来源：互联网发布：2016中国贫富差距数据编辑：程序博客网时间：2024/05/20 06:25

WebView

WebView能加载显示网页，可以将其视为一个可以嵌入在Android界面中的浏览器。

Html调用java代码

如果网页要调用java代码需要通过javascript方法调用java对象传递给webview的对象点方法。

public void onCreate(BundlesavedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

webview = (WebView) findViewById(R.id.webview);

//加载网页

webview.loadUrl("file:///android_asset/test.html");

//webview默认是不能够执行javascript

//允许webview能够执行javascript代码

webview.getSettings().setJavaScriptEnabled(true);

//把java对象传递给webview的插件

webview.addJavascriptInterface(new Plug(),"plug" );

}

private class Plug{

public void call(String phone){

Intent intent = new Intent(Intent.ACTION_CALL,Uri.parse("tel:"+ phone));

startActivity(intent);

}

Html

<scripttype="text/javascript">

function call(){

plug.call('18888888888');

}

</script>

</head>

<body>

这是一个html页面,现在在WebView中运行

<ahref="javascript:call()">打电话给18888888888</a>

Java代码交互html

运行应用程序，onCreate方法中利用webview加载html页面

Html加载完毕后会调用window.onload函数，onload方法中调用java接口的方法生成数据

Java端生成完数据将集合转换为json，调用js的渲染页面方法，并将json作为参数传入

Js端渲染方法迭代json数组并且渲染数据至页面

用户点击网页中的拨号按钮调用java接口的拨号方法

Html

<scripttype="text/javascript">

//保存模板html代码

vartemplate;

//让java调用,生成联系人数据

functionshow(arr){

for(var i=0;i<arr.length;i++){

varinnerHtml = document.body.innerHTML;

//利用模板替换生成每条数据

varrow = template;

row= row.replace('name',arr.name);

row= row.replace('amount',arr.amount);

row= row.replace('phone',arr.phone);

//将html拼接到body标签中

document.body.innerHTML= innerHtml+row;

}

//初始化并且调用showcontacts去java请求数据

functioninitContacts(){

template = document.body.innerHTML;

document.body.innerHTML = "";

contact.showcontacts();

}

//按钮点击时调用java的call

functioncall(phone){

contact.call(phone);

}

//页面加载时调用

window.onload= initContacts;

</script>

</head>

<body>

<divclass="contact">

<spanstyle="position:absolute;left:5px">name</span><br>

<spanstyle="position:relative;top:5px;">phone</span><br>

</div>

</body>

</html>

Activity

//你可以把webview看成一个浏览器，webview里面有一个插件，可以把一个java对象传递给webview的插件，当插件得到这个对象之后，就可以让网页里面的

//javascript代码对这个java对象进行调用

webview = (WebView) findViewById(R.id.webview);

//webview默认是不能够执行javascript

//允许webview能够执行javascript代码

webview.getSettings().setJavaScriptEnabled(true);

//把java对象传递给webview的插件

webview.addJavascriptInterface(new ContactPlugin(),"contact");

//加载网页

webview.loadUrl("file:///android_asset/contacts.html");

service = new ContactService();

}

//准备传入webview,让js调用

private final class ContactPlugin{

//初始化数据,由js调用,获得数据后转换为json并且调用js的方法返回

public void showcontacts(){

try {

List<ContactInfo> contacts =service.getContacts();

JSONArray jsonArray = new JSONArray();

for(ContactInfo info:contacts){

JSONObjectjsonObject = new JSONObject();

jsonObject.put("name",info.getName());

jsonObject.put("phone",info.getPhone());

jsonArray.put(jsonObject);

}

String json = jsonArray.toString();

//webview执行javascript代码

webview.loadUrl("javascript:show("+ json + ")");

}catch (Exception e) {

e.printStackTrace();

}

//让js调用,打电话

public void call(String phone){

Intentintent = new Intent(Intent.ACTION_CALL,Uri.parse("tel:" + phone));

startActivity(intent);

}

ContactService：

public static List<ContactInfo> getContacts() {

List<ContactInfo>contactInfos = newArrayList<ContactInfo>();

contactInfos.add(new ContactInfo("刘备", "13900123456"));

contactInfos.add(new ContactInfo("关羽", "1867686878"));

contactInfos.add(new ContactInfo("张飞", "18900888888"));

contactInfos.add(new ContactInfo("曹操", "18000888888"));

return contactInfos;

}

ContactInfo：

public class ContactInfo {

private String name;

private String phone;

public ContactInfo() {

super();

// TODO Auto-generated constructor stub

}

public ContactInfo(String name,String phone) {

super();

this.name = name;

this.phone = phone;

}

public String getName() {

return name;

}

public void setName(String name) {

this.name = name;

}

public String getPhone() {

return phone;

}

public void setPhone(String phone) {

this.phone = phone;

}

课后问题

1.要显示网页用什么控件

webView

2.java调用javaScrpit用什么方法？

// 允许webview能够执行javascript代码

wv.getSettings().setJavaScriptEnabled(true);
Webview对象.loadUrl("javascript:方法名");

3.javaScript调用java的实现步骤。

// 把java对象传递给webview的插件

Webview.addJavascriptInterface(new Contact(), "contact");

Html：

function call(phone){

contact.call(phone);

}

0 0