• android 之 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对象。

        4. 调用本地html:  webView.loadUrl("file:///android_asset/android.html") ;

     

     
    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.     }     

     

     

    上面是基本的WebView 操作。

     

    2.  public void addJavascriptInterface (Object object, String name)    此方法的主要作用是JS调用Java代码。原理为:将WebView与一个任意对象绑定,并赋予此对象一个名字,

        此时可以在这个对象里加入任意方法,执行你想要的操作,比如方法名为goBaidu();  这时就可以在html中调用这个方法了,调用代码为在javascript的function中 window.name.goBaidu();

        下面是示例代码:

         Activity中:

       

        webView.addJavascriptInterface(new Object() {
                public void closeThisPage() {
                    Toast.makeText(WebViewActivity.this, "JavascriptInterface is clicking", Toast.LENGTH_LONG).show();
                    WebViewActivity.this.finish();
                }

                public void goToBaidu() {
                    Toast.makeText(WebViewActivity.this, "JavascriptInterface is clicking", Toast.LENGTH_LONG).show();
                    webView.loadUrl("http://www.baidu.com");
                }

            }, "huihui");

           Html中:

         

    <html>
    <head>
        <meta charset="utf-8" content="text/html" http-equiv="Content-Type"/>    //!!!charset
        <script type="text/javascript" language="javascript">
            function xixi(){
            window.huihui.closeThisPage();    //核心代码
            }
            function haha(){
            window.huihui.goToBaidu();      //核心代码
            }

        </script>
    </head>
    <body>
    <a href="" onclick="haha()">Go to baidu page...</a>
    <br/>
    <a href="" onclick="xixi()">Close</a>
    </body>
    </html>

    3.  Java调用JS :核心代码 

    Java中:

    webview.loadUrl("javascript:method()");       //如果要传参数到Js中,注意参数形式。简单的String类型,参数两个都需要加上“’”表示字符串

    JS:

    <script type="text/javascript" language="javascript">

    function method(){

    alert("From  java code....");

    }

    </script>

    4.  WebView 的 public void setWebChromeClient (WebChromeClient client)。此方法用处很多,我觉得里面的onJsAlert() onJsConfirm() onJsPrompt() 方法很好。

         在WebChromeClient类里可以重写这三个方法,此时WebView中加载的html中如果执行alert("alert....");    confirm("confirm...");  prompt("prompt...", "defaultValue");

         这三个方法,该类就会监听到执行对应的三个方法。我们可以让这三个方法的返回值为true ,即自定义此方法。在里面写入自己定义的Dialog,便可实现html与Activity交互。

         注意 JsResult 此类需要在操作时,如果操作则 result.cofirm(). 取消则 result.cancel();    还必须这每一个方法中写入 dialog.setOnkeyListener(); 方法来监听Back键,listener中        要写 result.cancel();   否则系统没有消费这个事件,会出错。

         下面就一个写onJsPrompt()的示例代码吧:

         Activity中:

         @Override
            public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, final JsPromptResult result) {
                Log.e("onJsPrompt", "url:" + url + " and message:" + message + " and defaultValue:" + defaultValue);
                final Dialog dialog = new Dialog(WebViewActivity.this);
                dialog.setContentView(R.layout.prompt);  //自定义layout
                dialog.setTitle("This is prompt...");
                final EditText editText = (EditText) dialog.findViewById(R.id.editText);
                editText.setText(defaultValue);
                Button btnOk = (Button) dialog.findViewById(R.id.btnOK);
                btnOk.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        Toast.makeText(WebViewActivity.this, "You click the ok button.." + " and The editText content is:" + editText.getText().toString(), Toast.LENGTH_LONG).show();
                        result.confirm(editText.getText().toString());
                        dialog.cancel();
                    }
                });
                Button btnCancel = (Button) dialog.findViewById(R.id.btnCancel);
                btnCancel.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        Toast.makeText(WebViewActivity.this, "You click the cancel button..", Toast.LENGTH_LONG).show();
                        result.cancel();
                        dialog.cancel();
                    }
                });
                dialog.show();

        //需要监听dialog的back事件 ,否则会出错
             dialog.setOnKeyListener(new DialogInterface.OnKeyListener() {
                    @Override
                    public boolean onKey(DialogInterface dialogInterface, int i, KeyEvent keyEvent) {
                        if (i == KeyEvent.KEYCODE_BACK) {
                            dialog.cancel();
                            result.cancel();
                            return true;
                        }
                        return false;
                    }
                });
                return true;                       //此处必须返回 ture ,否则会弹出 html的 对话框。需要消费事件
              // return super.onJsPrompt(view, url, message, defaultValue, result);
            }

       

     Html 中:

      <html>
    <head>
        <script type="text/javascript" language="javascript">
            function jsAlert(){
            alert("This is jsAlert...");
            }
            function jsConfirm(){
                confirm("This is confirm...");
            }
            function jsPrompt(){
                prompt("This is prompt", "lianghui");
            }
        </script>
    </head>
    <body>
    <input onclick="jsAlert()" value="Alert" type="button" />
    <br />
    <input onclick="jsConfirm()" value="Confirm" type="button" />
    <br />
    <input type="button" value="Prompt" onclick="jsPrompt()" />
    </body>
    </html>

     

  • 相关阅读:
    锁详解
    消息组件
    分布式锁
    jvm调优
    类加载
    垃圾回收
    Mysql
    redis
    悲观锁和乐光锁
    算法常见
  • 原文地址:https://www.cnblogs.com/lianghui66/p/2987176.html
Copyright © 2020-2023  润新知