`

android WebView结合javascript相互调用

阅读更多
import java.util.ArrayList;
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.util.Log;
import android.webkit.WebView;

public class FirstActivity extends Activity{
	
	private WebView web;
	//模拟号码簿
	private ArrayList<Contact> contacts = new ArrayList<Contact>();
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        initContacts();
        web = (WebView)this.findViewById(R.id.webView);
        
        web.getSettings().setJavaScriptEnabled(true);//开启javascript设置,否则WebView不执行js脚本

        web.addJavascriptInterface(this,"phonebook"); //处理window.phonebook.xxx()的标志
        
        web.loadUrl("file:///android_asset/phonebook.html");
    }
    
    /**
     * 该方法将在js脚本中,通过window.phonebook.getContacts()进行调用
     * 返回的ArrayList对象可以使得在js中访问Java集合
     * @return
     */
    public ArrayList<Contact> getContacts(){
    	return contacts;
    
    }
    
    /**
     * 初始化电话号码簿
     */
    public void initContacts(){
    	Contact instance = new Contact();
    	instance.name = "Benny";
    	instance.phone = "13700000";
    	contacts.add(instance);
    	instance = new Contact();
    	instance.name = "Tommy";
    	instance.phone = "15800000";
    	contacts.add(instance);
    }
    
    /**
     * 通过window.phonebook.log来输出js调试信息。
     * @param info
     */
    public void log(String info){
    	Log.i("tag",info);
    }
    
    public void startActivity(){
    	Intent intent = new Intent(this,SecondActivity.class);
    	startActivity(intent);
    } 
}


assets/phonebook.html:
<html> 
<head> 
<title>js交互android</title> 
<script type="text/javascript">
window.onload = function(){
	var persons = window.phonebook.getContacts();//调用FirstActivity.getContacts()
	if(persons){//persons是ArrayList对象
		window.phonebook.log("共有"+persons.size()+"个联系人");
		var contactsE = document.getElementById("contacts");
		var i = 0; 
		while(i < persons.size()){//persons是ArrayList对象
			pnode = document.createElement("p");
			tnode = document.createTextNode("name: " + persons.get(i).getName() + " number: " + persons.get(i).getPhone());
			pnode.appendChild(tnode);
			contactsE.appendChild(pnode);
			i ++;
		}
	}else{
		window.phonebook.log("persons is null.");
	}
	
};
</script> 
</head> 
<body> 
<input type="button" onclick="window.phonebook.startActivity()" value="Goto next" />
<div id = "contacts">
	<p> this is a JS_Android demo </p>
</div>
</body> 
</html> 



还在用Android自带的WebView组件?太Out了!
http://www.open-open.com/lib/view/open1472481479625.html
分享到:
评论

相关推荐

    android WebView和javascript相互调用

    总之,Android的WebView结合JavaScript调用,为开发者提供了丰富的功能扩展性,使得原生应用能更好地集成Web内容和服务。同时,正确理解和使用`addJavascriptInterface()`、`evaluateJavascript()`以及`loadUrl()`...

    Webview与Javascript相互调用 (Android studio )demo

    本示例项目"Webview与Javascript相互调用 (Android Studio)"就是专门针对这一功能的演示,它提供了直接在Android Studio中运行的代码,帮助开发者理解和实践WebView与JavaScript之间的通信。 首先,我们来深入理解...

    android webview中使用Java调用JavaScript方法并获取返回值

    如果需要在WebView中启用JavaScript调用Android代码的功能,还要在addJavascriptInterface()方法中声明一个Java类的实例,并为其指定一个可以在JavaScript中访问的接口名字。 在Java代码中定义一个内部类,用于接收...

    android中Webview与javascript的交互(互相调用)

    本篇文章将详细探讨Android中的WebView与JavaScript如何进行交互,包括互相调用的原理、步骤以及注意事项。 **一、WebView基础知识** 1. **WebView的引入**:在Android应用中,我们需要在布局XML文件中添加WebView...

    Android WebView H5调用拍照

    总结来说,Android WebView与H5的结合使得开发者能灵活地在原生应用中实现丰富的交互功能,比如调用拍照。通过设置JavaScript接口,我们可以将Android原生功能暴露给H5页面,让网页可以直接调用设备的摄像头,从而...

    android之webview与js相互调用

    JavaScript调用Android代码则需要实现`WebViewClient`的`shouldOverrideUrlLoading()`方法,并通过`addJavascriptInterface()`添加一个Java对象到Webview,使得JavaScript可以访问这个对象的方法。 首先,创建一个...

    Android Webview 和Javascript交互,实现Android和JavaScript相互调用

    综上所述,Android Webview与JavaScript的交互涉及到了多个层次,包括接口定义、注册、JavaScript调用、数据传递以及安全防护。通过合理利用这些机制,开发者可以构建出既美观又功能强大的混合应用。在实际项目中,...

    android webview 与 JS 相互调用

    Android WebView与JavaScript的相互调用是混合开发的核心,它可以结合两者的优势,提供丰富的用户体验。同时,利用Android的原生能力如GPS定位和扫描二维码,可以增强应用的功能。但务必注意安全性和性能优化,确保...

    Android webview调用相机和相册

    这里需要用到WebView的`addJavascriptInterface`方法,创建一个Java对象并暴露给JavaScript调用。例如,我们可以创建一个名为`WebAppInterface`的类: ```java public class WebAppInterface { private Context ...

    Android下WebView中调用系统相机拍照范例

    3. 在网页中通过JavaScript调用这个接口。 4. 处理权限请求,确保应用有权限访问相机和外部存储。 5. 在相机活动返回后,更新网页以显示拍摄的照片。 通过这样的方式,你可以在Android应用的WebView中无缝集成系统...

    Android webview调用摄像头扫描二维码

    本文将详细讲解如何在Android Webview中调用摄像头进行二维码扫描,并结合ZXing(Zebra Crossing)解析包进行二维码的解析。 首先,让我们了解Android Webview的基本用法。Webview是Android SDK提供的一种视图组件...

    android使用webView实现java程序与js脚本的相互调用

    同时,WebView还提供了Java代码与JavaScript交互的能力,使得我们可以利用JavaScript的灵活性和Android原生功能的强大结合,创建出丰富的混合应用。本文将详细介绍如何在Android中使用WebView实现Java程序与JS脚本的...

    android Webview(H5)中调用相册和拍照

    在Android应用开发中,Webview是一个非常重要的组件,它允许我们加载并运行网页内容,甚至与JavaScript进行交互。本文将详细讲解如何在Android的Webview中调用相册和拍照功能,以实现H5与原生Android应用的深度集成...

    Android使用WebView调用H5完成摄像头扫描二维码

    通过WebView,开发者可以将Web技术与原生Android应用结合,实现更丰富的交互体验。 为了调用摄像头并扫描二维码,我们需要在H5页面中使用相关的JavaScript库,例如`html5-qrcode`。这个库提供了一种简单的方法来...

    Android WebView与JavaScript交互实现Web App

    1. **addJavascriptInterface()**: 这个方法可以将Android对象暴露给JavaScript,使得JavaScript可以直接调用Android的原生方法。例如,创建一个Java对象并添加到WebView: ```java webView....

    Android WebView 去除标题

    本篇文章将详细探讨如何在Android的WebView中移除标题,并利用JavaScript进行交互。 首先,我们需要了解WebView的基本用法。在Android中,我们可以通过以下方式创建一个WebView: ```java WebView webView = new ...

    android demo,webview_js(webview的js方法调用java方法)。

    本示例“android demo,webview_js”着重展示了如何通过Webview实现JavaScript调用Java方法的功能。这个功能对于创建混合式应用或者在原生应用中嵌入HTML5页面尤其有用。 首先,我们需要在Android布局文件中添加一...

    webview组件javascript调用java的小程序

    这个"webview组件javascript调用java的小程序"就是一个实例,展示了如何实现这种通信机制。下面我们将深入探讨这个主题。 首先,WebView是Android SDK提供的一种视图类,它能够加载和显示HTML、CSS和JavaScript内容...

Global site tag (gtag.js) - Google Analytics