`

webview 的使用

阅读更多

在Android手机中内置了一款高性能webkit内核浏览器,在SDK中封装为一个叫做WebView组件。  

什么是webkit  

WebKit 是Mac OS X v10.3及以上版本所包含的软件框架(对v10.2.7及以上版本也可通过软件更新获取)。 同时,WebKit也是Mac OS X的Safari网页浏览器的基础。WebKit是一个开源项目,主要由KDE的KHTML修改而来并且包含了一些来自苹果公司的一些组件。  

传 统上,WebKit包含一个网页引擎WebCore和一个脚本引擎JavaScriptCore,它们分别对应的是KDE的KHTML和KJS。不过, 随着JavaScript引擎的独立性越来越强,现在WebKit和WebCore已经基本上混用不分(例如Google Chrome和Maxthon 3采用V8引擎,却仍然宣称自己是WebKit内核)。  

这里我们初步体验一下在android是使用webview浏览网页,在SDK的Dev Guide中有一个WebView的简单例子 。  

在开发过程中应该注意几点:  
    1.AndroidManifest.xml中必须使用许可"android.permission.INTERNET",否则会出Web page not available错误。
    2.如果访问的页面中有Javascript,则webview必须设置支持Javascript。
        webview.getSettings().setJavaScriptEnabled(true);  
    3.如果页面中链接,如果希望点击链接继续在当前browser中响应,而不是新开Android的系统browser中响应该链接,必须覆盖 webview的WebViewClient对象。

  1. mWebView.setWebViewClient( new  WebViewClient(){       
  2.                     public   boolean  shouldOverrideUrlLoading(WebView view, String url) {       
  3.                         view.loadUrl(url);       
  4.                         return   true ;       
  5.                     }       
  6.         });   

 4.如果不做任何处理,浏览网页,点击系统“Back”键,整个Browser会调用finish()而结束自身,如果希望浏览的网 页回退而不是推出浏览器,需要在当前Activity中处理并消费掉该Back事件。

  1. public   boolean  onKeyDown( int  keyCode, KeyEvent event) {       
  2.         if  ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {       
  3.             mWebView.goBack();       
  4.                    return   true ;       
  5.         }       
  6.         return   super .onKeyDown(keyCode, event);       
  7.     }     

下一步让我们来了解一下android中webview是如何支持javascripte自定义对象的,在w3c标准中js有 window,history,document等标准对象,同样我们可以在开发浏览器时自己定义我们的对象调用手机系统功能来处理,这样使用js就可以 为所欲为了。

  看一个实例:

  1. public   class  WebViewDemo  extends  Activity {        
  2.     private  WebView mWebView;       
  3.     private  Handler mHandler =  new  Handler();       
  4.        
  5.     public   void  onCreate(Bundle icicle) {       
  6.         super .onCreate(icicle);       
  7.         setContentView(R.layout.webviewdemo);       
  8.         mWebView = (WebView) findViewById(R.id.webview);       
  9.         WebSettings webSettings = mWebView.getSettings();       
  10.         webSettings.setJavaScriptEnabled(true );       
  11.         mWebView.addJavascriptInterface(new  Object() {       
  12.             public   void  clickOnAndroid() {       
  13.                 mHandler.post(new  Runnable() {       
  14.                     public   void  run() {       
  15.                         mWebView.loadUrl("javascript:wave()" );       
  16.                     }       
  17.                 });       
  18.             }       
  19.         }, "demo" );       
  20.         mWebView.loadUrl("file:///android_asset/demo.html" );       
  21.     }       
  22. }   

我们看addJavascriptInterface(Object obj,String interfaceName)这个方法,该方法将一个java对象绑定到一个javascript对象中,javascript对象名就是 interfaceName(demo),作用域是Global。这样初始化webview后,在webview加载的页面中就可以直接通过 javascript:window.demo访问到绑定的java对象了。来看看在html中是怎样调用的。

  1. < html >        
  2.         < mce:script   language = "javascript" > <!--     
  3.        
  4.                 function wave() {       
  5.                     document.getElementById("droid").src = "android_waving.png" ;       
  6.                 }       
  7.              
  8. // --> </ mce:script >        
  9.         < body >        
  10.             < a   onClick = "window.demo.clickOnAndroid()" >        
  11.                                 < img   id = "droid"   src = "android_normal.png"   mce_src = "android_normal.png" /> < br >        
  12.                                 Click me!       
  13.             </ a >        
  14.         </ body >        
  15. </ html >       

这样在javascript中就可以调用java对象的clickOnAndroid()方法了,同样我们可以在此对象中定义很多方法(比 如发短信,调用联系人列表等手机系统功能。),这里wave()方法是java中调用javascript的例子。

这里还有几个知识点:  

1)为了让WebView从apk文件中加载 assets,Android SDK提供了一个schema,前缀为"file:///android_asset/"。WebView遇到这样的schema,就去当前包中的 assets目录中找内容。如上面的"file:///android_asset/demo.html"  
2)addJavascriptInterface方法中要绑定的Java对象及方法要运行另外的线程中,不能运行在构造他的线程中,这也是使用 Handler的目的。

分享到:
评论

相关推荐

    原生登录cookie保持提供webview使用

    本文将深入探讨这个主题,主要围绕"原生登录cookie保持提供webview使用"这一核心知识点进行展开。 首先,我们需要理解cookie的工作原理。Cookie是服务器在客户端存储的小型文本文件,通常用于跟踪用户会话、存储...

    Android之WebView使用Demo

    **Android之WebView使用Demo** 在Android开发中,`WebView`是一个非常重要的组件,它允许我们在应用程序内部加载和显示网页内容,极大地扩展了Android应用的功能。本教程将详细讲解如何在Android应用中使用`WebView...

    webView 使用指南及使用心得总结

    以下是对WebView使用指南及使用心得的详细总结: 一、WebView的基本使用 1. 添加依赖:在AndroidManifest.xml中添加Internet权限,以确保WebView能够访问网络。 ```xml ``` 2. 在布局文件中添加WebView: ```xml...

    android demo,webview使用的源代码

    【标题】:“Android Demo, WebView使用的源代码” 这个标题揭示了我们关注的是一个关于Android平台的演示项目,其中包含了使用WebView组件的源代码。WebView是Android SDK中的一个重要组件,它允许开发者在Android...

    WebView使用解析(一)之基本用法

    默认情况下,WebView使用自身的WebViewClient,但我们可以自定义一个WebViewClient来处理网络请求,例如重定向、加载进度等。下面的代码展示了如何自定义WebViewClient: ```java webView.setWebViewClient(new ...

    Google官方的Chromium WebView使用示例.zip

    这个"Google官方的Chromium WebView使用示例.zip"是一个开源项目,旨在帮助开发者更好地理解和使用Chromium WebView进行应用开发。下面将详细介绍Chromium WebView的关键特性和使用方法,以及如何利用提供的示例进行...

    博客《 WebView使用详解(三)——WebChromeClient与LoadData补充》对应源码

    博客《 WebView使用详解(三)——WebChromeClient与LoadData补充》对应源码,博客地址:http://blog.csdn.net/harvic880925/article/details/51583253

    webview使用及使用自定义图片查看界面

    这篇博客“webview使用及使用自定义图片查看界面”将深入探讨如何有效地利用WebView,并介绍如何定制一个专门用于查看图片的界面。 首先,WebView的基本使用涉及到以下步骤: 1. 初始化WebView:在XML布局文件中...

    WebView使用及在WebView中Java和JS交互

    **WebView使用详解** WebView是Android系统提供的一种原生组件,用于在应用中展示网页内容,类似于浏览器的一个轻量级版本。它可以加载HTML、CSS、JavaScript等网页资源,为开发者提供了在Android应用中嵌入网页...

    这是一份全面&详细的Webview使用攻略

    Android WebView 使用攻略 Android 中的 WebView 是一个基于 webkit 引擎、展现 web 页面的控件,广泛应用于 Hybrid App 的开发中。下面是关于 WebView 的详细使用攻略。 1. 简介 WebView 是 Android 中的一个...

    WebView使用总结3(应用函数与JS函数互相调用)

    这篇博文"WebView使用总结3(应用函数与JS函数互相调用)"聚焦于如何实现Android应用中的Java函数与JavaScript函数之间的交互,这对于构建混合式应用或者增强Web页面与原生应用的集成至关重要。 首先,我们要理解...

    webView 使用指南

    这篇“webView使用指南”将深入探讨WebView的基本用法、高级特性以及实际应用中的注意事项,旨在帮助开发者更好地理解和运用这一功能。 一、WebView基础 1. 初始化WebView:首先,在布局文件中添加WebView元素,并...

    WebView入门小例子

    - 这可能是一个简单的示例项目,包含了一个基础的WebView使用案例。可能包含了AndroidManifest.xml配置、布局文件(如activity_main.xml)以及主Activity(MainActivity.java)的代码,展示了如何创建、初始化并...

    Android中webview使用x5内核集成demo

    Android x5内核集成demo 解决webview在使用内核时跟h5混合调用时出现的白屏,加载缓慢,vue报错各种兼容问题。在x5内核加载失败时,会切换成系统本身的内核来加载h5内容。如果项目上架Google商店等海外市场运营的,...

    Android4.4 WebView使用实例,实现后退前进刷新错误处理等功能

    Android 4.4 WebView使用实例,实现后退、前进、刷新、错误处理等功能。完成项目,可直接eclipse运行。有WebViewClient常用方法注释,WebChromeClient常用方法注释。

    Android中WebView使用

    在AndroidManifest.xml中,需要为使用WebView的Activity添加Internet权限: ```xml ``` 然后,在布局文件(如activity_main.xml)中添加WebView组件: ```xml &lt;WebView android:id="@+id/web_view" android:...

    使用webview 封使用了webrtc 打开摄像头 的页面demo

    在本示例中,“使用webview 封装使用了webrtc 打开摄像头的页面demo”意味着我们要在Webview中集成Webrtc,以便在Android应用中通过Web接口调用摄像头功能。 首先,我们需要了解Webview的基本用法。在...

    WebView使用Ionic框架混合式开发

    - **WebView优化**:启用硬件加速,使用`setLayerType(View.LAYER_TYPE_HARDWARE, null)`提高WebView渲染速度。 - **离线存储**:通过Service Worker和Cache API实现离线缓存,提升离线场景下的用户体验。 - **代码...

    Android中webview使用js与java交互

    在Android开发中,WebView是一个非常重要的组件,它允许我们在应用程序中内嵌网页内容,并且能够实现...通过理解并熟练掌握JavaScript Interface的使用,开发者可以充分利用WebView的功能,提升应用的用户体验。

Global site tag (gtag.js) - Google Analytics