android_webView加载.html文件

来源：互联网发布：乐视会员淘宝编辑：程序博客网时间：2024/06/06 13:01

首先在layout文件夹下的xml中加入Java代码

<WebViewandroid:id="@+id/wv1"android:layout_width="fill_parent"android:layout_height="fill_parent"/>

Java代码
public class jsWebDemo extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); WebView wView = (WebView)findViewById(R.id.wv1); ProxyBridge pBridge = new ProxyBridge(); wView.addJavascriptInterface(pBridge, "AliansBridge"); WebSettings wSet = wView.getSettings(); wSet.setJavaScriptEnabled(true); wView.loadUrl("file:///android_asset/index.html"); } public class ProxyBridge { public int one () { return 1; } } } public class jsWebDemo extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); WebView wView = (WebView)findViewById(R.id.wv1); ProxyBridge pBridge = new ProxyBridge(); wView.addJavascriptInterface(pBridge, "AliansBridge"); WebSettings wSet = wView.getSettings(); wSet.setJavaScriptEnabled(true); wView.loadUrl("file:///android_asset/index.html"); } public class ProxyBridge { public int one () { return 1; } }}

wView.addJavascriptInterface(pBridge, "AliansBridge");
上句代码是实例化一个方法为的是在html中的js中调用，第二个参数则是实例化方法的别名，如果要使用这个pBridge，则在js中使用的名字就是AliansBridge。

WebSettings wSet = wView.getSettings();
wSet.setJavaScriptEnabled(true);
上面两句就是允许使用js的意思

wView.loadUrl(file:///android_asset/index.html);
就是在asset下放入一个index.html文件，这个文件包含js的代码，注意路径是“///”，这个android_asset不是文件夹的名字是系统自动生成的，其实就是asset文件夹的系统路径。

index.html 内容如下

Java代码
<html><body> <div id="output">Test page.</div> <input type="submit" value="change to 1" onclick="document.getElementById('output').innerHTML = AliansBridge.one()" /> </body></html> <html><body><div id="output">Test page.</div><input type="submit" value="change to 1" onclick="document.getElementById('output').innerHTML = AliansBridge.one()" /></body></html>

这里要注意如果你只有一个方法需要被js调用

ProxyBridge pBridge = new ProxyBridge();
wView.addJavascriptInterface(pBridge, "AliansBridge");

如果你需要调用好多个方法呢这里只要

wView.addJavascriptInterface(this, "AliansBridge");

把整个android程序所在的类本身实例化传递就可以了

这里呢可以参看附件中的实例riademo

你如果想继续扩展可以参看

http://www.ophonesdn.com/article/show/115

2.上面是javascript调用android的方法，那么android也可以调用js的方法

Java代码
public class webJsDemo extends Activity { /** Called when the activity is first created. */ private WebView mWebView; private Handler mHandler = new Handler(); @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); mWebView = (WebView) findViewById(R.id.wv1); WebSettings webSettings = mWebView.getSettings(); webSettings.setSavePassword(false); webSettings.setSaveFormData(false); webSettings.setJavaScriptEnabled(true); webSettings.setSupportZoom(false); mWebView.setWebChromeClient(new MyWebChromeClient()); mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); mWebView.loadUrl("file:///android_asset/demo.html"); } final class DemoJavaScriptInterface { DemoJavaScriptInterface() { } /** * This is not called on the UI thread. Post a runnable to invoke * loadUrl on the UI thread. */ public void clickOnAndroid() { mHandler.post(new Runnable() { public void run() { mWebView.loadUrl("javascript:wave()"); } }); } } /** * Provides a hook for calling "alert" from javascript. Useful for * debugging your javascript. */ final class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { // TODO Auto-generated method stub Log.d("aa", message); Log.d("url", url); Log.d("result", ""+result); result.confirm(); return super.onJsAlert(view, url, message, result); } } public class webJsDemo extends Activity { /** Called when the activity is first created. */ private WebView mWebView; private Handler mHandler = new Handler(); @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); mWebView = (WebView) findViewById(R.id.wv1); WebSettings webSettings = mWebView.getSettings(); webSettings.setSavePassword(false); webSettings.setSaveFormData(false); webSettings.setJavaScriptEnabled(true); webSettings.setSupportZoom(false); mWebView.setWebChromeClient(new MyWebChromeClient()); mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo"); mWebView.loadUrl("file:///android_asset/demo.html"); } final class DemoJavaScriptInterface { DemoJavaScriptInterface() { } /** * This is not called on the UI thread. Post a runnable to invoke * loadUrl on the UI thread. */ public void clickOnAndroid() { mHandler.post(new Runnable() { public void run() { mWebView.loadUrl("javascript:wave()"); } }); } } /** * Provides a hook for calling "alert" from javascript. Useful for * debugging your javascript. */ final class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { // TODO Auto-generated method stub Log.d("aa", message); Log.d("url", url); Log.d("result", ""+result); result.confirm(); return super.onJsAlert(view, url, message, result); } }

其中上面的代码也提到了怎么在android中调试js mWebView.setWebChromeClient(new MyWebChromeClient());

上面的代码来源于别人的实例。

最后还要注意在这个实例中demo.html和两个image应该在同一个文件夹asset下