• Android开发之WebView应用


    Android开发之WebView的使用

    Android网路功能很强大,WebView组件支持直接加载网页,可以将其视为一个浏览器,要实现该功能,具体步骤如下

    1、在布局文件中声明WebView

    2、在Activity中实例化WebView

    3、调用WebView的loadUrl()方法,加载指定的URL地址网页

    4、为了让WebView能够响应超链接功能,调用setWebViewClient()方法,设置WebView客户端

    5、如果访问的页面中有Javascript,则webview必须设置支持Javascript。webview.getSettings().setJavaScriptEnabled(true); 

    6、为了让WebView支持回退功能,覆盖onKeyDown()方法

    7、一定要注意:在AndroidManifest.xml文件中添加访问互联网的权限,否则不能显示

    <uses-permission android:name="android.permission.INTERNET"/>

    下面通过一个列子来详细讲解WebView的使用。先来看该项目的运行效果图:

        

                                              图(一)                                                                                                   图(二)

        

                                             图(三)                                                                                                 图(四)

                                            图(五)

    图(一):当运行该项目,首先显示的界面。在该界面中,我们加载了一个html网页。

    图(二):当单击第一个提交按钮显示的对话框,这是个Alert对话框。

    图(三):当单击第二个提交按钮显示的对话框,这是个confirm对话框。

    图(四):当单击第三个提交按钮显示的对话框,这是个prompt对话框。

    图(五):当我们在EditText输入百度网址时,显示的百度首页。

    下面来讲解下开发该项目的全过程:

    1、创建一个Android项目,命名为WebViewTest。

    2、创建一个html页面,命名为Dialog.html,并放在assets目录下。具体代码如下:

    1. <html xmlns="http://www.w3.org/1999/xhtml">  
    2. <head>  
    3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
    4. <title>无标题文档</title>  
    5. </head>  
    6.   
    7. <body>  
    8. <p>一下是三种对话框</p>  
    9. <p>警告、提醒对话框</p>  
    10. <input type="submit" name="Submit" value="提交"  onclick="a()">  
    11.   
    12. <p>带选择的对话框</p>  
    13. <input type="submit" name="Submit" value="提交"  onclick="b()">  
    14.   
    15. <p>要求用户输入的对话框</p>  
    16. <input type="submit" name="Submit" value="提交"  onclick="c()">  
    17.    
    18. <script language="javascript">  
    19. function a(){  
    20. alert("警告、提醒对话框")  
    21. }  
    22. function b(){  
    23. confirm("带选择的对话框")  
    24. }  
    25. function c(){  
    26. prompt("要求用户输入的对话框")  
    27. }  
    28. </script>  
    29. </body>  
    30. </html>  

    在该页面中声明了三个按钮,分别用于javascript脚本显示三种不同的对话框。
    3、在layout目录下,新建一个布局文件prom_dialog.xml,用于显示对话框。具体代码如下:

    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:gravity="center_horizontal"  
    4.     android:orientation="vertical"  
    5.     android:layout_width="fill_parent"  
    6.     android:layout_height="wrap_content"  
    7.     >  
    8.     <TextView   
    9.     android:id="@+id/TextView_PROM"  
    10.         android:layout_width="fill_parent"  
    11.     android:layout_height="wrap_content"/>  
    12.     <EditText   
    13.     android:id="@+id/EditText_PROM"  
    14.     android:layout_width="fill_parent"  
    15.     android:layout_height="wrap_content"  
    16.     android:selectAllOnFocus="true"  
    17.     android:scrollHorizontally="true"/>  
    18. </LinearLayout>  

    在该布局文件中声明了一个TextView和一个EditText,该布局文件是用于第三个对话框使用的。

    4、修改主布局文件main.xml,其具体内容如下:

    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    3.     android:orientation="vertical"  
    4.     android:layout_width="fill_parent"  
    5.     android:layout_height="fill_parent"  
    6.     >  
    7.     <LinearLayout   
    8.         android:orientation="horizontal"  
    9.         android:layout_width="fill_parent"   
    10.         android:layout_height="fill_parent"   
    11.         android:animationCache="true"   
    12.         android:layout_weight="9">  
    13.         <EditText   
    14.             android:id="@+id/EditText01"   
    15.             android:layout_width="wrap_content"  
    16.             android:layout_weight="9"   
    17.             android:layout_height="wrap_content"   
    18.             android:text="请输入网址"/>  
    19.         <Button android:id="@+id/Button01"   
    20.             android:layout_width="wrap_content"  
    21.             android:layout_weight="1"   
    22.             android:layout_height="wrap_content"  
    23.             android:text="连接" />  
    24.     </LinearLayout>  
    25.     <WebView   
    26.     android:id="@+id/WebView01"   
    27.     android:layout_width="fill_parent"   
    28.     android:layout_height="fill_parent"       
    29.     android:layout_weight="1"  
    30.     />   
    31. </LinearLayout>  

    5、修改主程序文件,用于显示各项操作,具体操作都有注解,在这里就不多说了。代码如下:

    1. public class Activity01 extends Activity{  
    2.     private final String DEBUG_TAG  = "Activity01";  
    3.     private Button      mButton;  
    4.     private EditText    mEditText;  
    5.     private WebView     mWebView;  
    6.     String url="file:///android_asset/Dialog.html";  
    7.     public void onCreate(Bundle savedInstanceState)  
    8.     {  
    9.         super.onCreate(savedInstanceState);  
    10.         setContentView(R.layout.main);  
    11.         mButton = (Button) findViewById(R.id.Button01);  
    12.         mEditText = (EditText) findViewById(R.id.EditText01);  
    13.         mWebView = (WebView) findViewById(R.id.WebView01);  
    14.         //设置支持JavaScript脚本  
    15.         WebSettings webSettings = mWebView.getSettings();    
    16.         webSettings.setJavaScriptEnabled(true);  
    17.         //设置可以访问文件  
    18.         webSettings.setAllowFileAccess(true);  
    19.         //设置支持缩放  
    20.         webSettings.setBuiltInZoomControls(true);  
    21.         mWebView.loadUrl(url);  
    22.         //设置WebViewClient  
    23.         mWebView.setWebViewClient(new WebViewClient()  
    24.         {     
    25.             public boolean shouldOverrideUrlLoading(WebView view, String url)   
    26.             {     
    27.                 view.loadUrl(url);     
    28.                 return true;     
    29.             }    
    30.             @Override  
    31.             public void onPageFinished(WebView view, String url)   
    32.             {  
    33.                 super.onPageFinished(view, url);  
    34.             }  
    35.             @Override  
    36.             public void onPageStarted(WebView view, String url, Bitmap favicon)   
    37.             {  
    38.                 super.onPageStarted(view, url, favicon);  
    39.             }  
    40.         });  
    41.         //设置WebChromeClient  
    42.         mWebView.setWebChromeClient(new WebChromeClient(){  
    43.             @Override  
    44.             //处理javascript中的alert  
    45.             public boolean onJsAlert(WebView view, String url, String message,  
    46.                     final JsResult result)   
    47.             {  
    48.                 //构建一个Builder来显示网页中的对话框  
    49.                 Builder builder = new Builder(Activity01.this);  
    50.                 builder.setTitle("提示对话框");  
    51.                 builder.setMessage(message);  
    52.                 builder.setPositiveButton(android.R.string.ok,  
    53.                         new AlertDialog.OnClickListener() {  
    54.                             public void onClick(DialogInterface dialog, int which) {  
    55.                                 //点击确定按钮之后,继续执行网页中的操作  
    56.                                 result.confirm();  
    57.                             }  
    58.                         });  
    59.                 builder.setCancelable(false);  
    60.                 builder.create();  
    61.                 builder.show();  
    62.                 return true;  
    63.             };  
    64.             //处理javascript中的confirm  
    65.             public boolean onJsConfirm(WebView view, String url, String message,  
    66.                     final JsResult result)   
    67.             {  
    68.                 Builder builder = new Builder(Activity01.this);  
    69.                 builder.setTitle("带选择的对话框");  
    70.                 builder.setMessage(message);  
    71.                 builder.setPositiveButton(android.R.string.ok,  
    72.                         new AlertDialog.OnClickListener() {  
    73.                             public void onClick(DialogInterface dialog, int which) {  
    74.                                 result.confirm();  
    75.                             }  
    76.                         });  
    77.                 builder.setNegativeButton(android.R.string.cancel,  
    78.                         new DialogInterface.OnClickListener() {  
    79.                             public void onClick(DialogInterface dialog, int which) {  
    80.                                 result.cancel();  
    81.                             }  
    82.                         });  
    83.                 builder.setCancelable(false);  
    84.                 builder.create();  
    85.                 builder.show();  
    86.                 return true;  
    87.             };  
    88.             //处理javascript中的prompt  
    89.             //message为网页中对话框的提示内  
    90.             //defaultValue在没有输入时,默认显示的内容  
    91.             public boolean onJsPrompt(WebView view, String url, String message,  
    92.                     String defaultValue, final JsPromptResult result) {  
    93.                 //自定义一个带输入的对话框由TextView和EditText构成  
    94.                 final LayoutInflater factory = LayoutInflater.from(Activity01.this);  
    95.                 final View dialogview = factory.inflate(R.layout.prom_dialog, null);  
    96.                 //设置TextView对应网页中的提示信息  
    97.                 ((TextView) dialogview.findViewById(R.id.TextView_PROM)).setText(message);  
    98.                 //设置EditText对应网页中的输入框  
    99.                 ((EditText) dialogview.findViewById(R.id.EditText_PROM)).setText(defaultValue);  
    100.                 Builder builder = new Builder(Activity01.this);  
    101.                 builder.setTitle("带输入的对话框");  
    102.                 builder.setView(dialogview);  
    103.                 builder.setPositiveButton(android.R.string.ok,  
    104.                         new AlertDialog.OnClickListener() {  
    105.                             public void onClick(DialogInterface dialog, int which) {  
    106.                                 //点击确定之后,取得输入的值,传给网页处理  
    107.                                 String value = ((EditText) dialogview.findViewById(R.id.EditText_PROM)).getText().toString();  
    108.                                 result.confirm(value);  
    109.                             }  
    110.                         });  
    111.                 builder.setNegativeButton(android.R.string.cancel,  
    112.                         new DialogInterface.OnClickListener() {  
    113.                             public void onClick(DialogInterface dialog, int which) {  
    114.                                 result.cancel();  
    115.                             }  
    116.                         });  
    117.                 builder.setOnCancelListener(new DialogInterface.OnCancelListener() {  
    118.                             public void onCancel(DialogInterface dialog) {  
    119.                                 result.cancel();  
    120.                             }  
    121.                         });  
    122.                 builder.show();  
    123.                 return true;  
    124.             };  
    125.             //设置网页加载的进度条  
    126.             public void onProgressChanged(WebView view, int newProgress)   
    127.             {  
    128.                 Activity01.this.getWindow().setFeatureInt(Window.FEATURE_PROGRESS, newProgress * 100);  
    129.                 super.onProgressChanged(view, newProgress);  
    130.             }  
    131.             //设置应用程序的标题title  
    132.             public void onReceivedTitle(WebView view, String title)   
    133.             {  
    134.                 Activity01.this.setTitle(title);  
    135.                 super.onReceivedTitle(view, title);  
    136.             }  
    137.         });  
    138.         //连接按钮事件监听  
    139.         mButton.setOnClickListener(new OnClickListener()  
    140.         {  
    141.             public void onClick(View v)  
    142.             {  
    143.                 try   
    144.                 {  
    145.                     //取得编辑框中我们输入的内容  
    146.                     String url = mEditText.getText().toString();  
    147.                     //判断输入的内容是不是网址  
    148.                     if ( URLUtil.isNetworkUrl(url) )  
    149.                     {    
    150.                         //装载网址  
    151.                         mWebView.loadUrl(url);  
    152.                     }  
    153.                     else  
    154.                     {  
    155.                         mEditText.setText("输入网址错误,请重新输入");  
    156.                     }  
    157.                 }  
    158.                 catch (Exception e)   
    159.                 {  
    160.                     Log.e(DEBUG_TAG, e.toString());  
    161.                 }  
    162.             }  
    163.         });  
    164.     }  
    165.     public boolean onKeyDown(int keyCode, KeyEvent event)  
    166.     {  
    167.         if ((keyCode == KeyEvent.KEYCODE_BACK) &&   
    168.              mWebView.canGoBack())  
    169.         {  
    170.             //返回前一个页面  
    171.             mWebView.goBack();  
    172.             return true;  
    173.         }  
    174.         return super.onKeyDown(keyCode, event);  
    175.     }    
    176. }  

    6、别忘了在AndroidManifest.xml中添加"android.permission.INTERNET",否则会出Web page not available错误。

    7、项目到此就开发完毕了。执行之,便会得到以上效果。

    这里有几个知识点需要注意下: 

    1)为了让WebView从apk文件中加载assets,Android SDK提供了一个schema,前缀为"file:///android_asset/"。WebView遇到这样的schema,就去当前包中的 assets目录中找内容。如上面的"file:///android_asset/Dialog.html"

    2)在这里我们为Dialog添加了三种不同的对话框提示,在程序中,我们也使用了三种不同的javascript脚本处理了这三种不同的对话框。切忌,不同的对话框,有不同的函数进行相应的处理。

     

    最后,我们总结下:

        1、添加权限:AndroidManifest.xml中必须使用许可"android.permission.INTERNET",否则会出Web page not available错误。
        2、在要Activity中生成一个WebView组件:WebView webView = new WebView(this);
        3、设置WebView基本信息:
              如果访问的页面中有Javascript,则webview必须设置支持Javascript。
              webview.getSettings().setJavaScriptEnabled(true);  
              触摸焦点起作用
              requestFocus();
              取消滚动条
              this.setScrollBarStyle(SCROLLBARS_OUTSIDE_OVERLAY);
        4、设置WevView要显示的网页:
              互联网用:webView.loadUrl("http://www.google.com"); 
              本地文件用:webView.loadUrl("file:///android_asset/XX.html");  本地文件存放在:assets文件中
        5、如果希望点击链接由自己处理,而不是新开Android的系统browser中响应该链接。
              给WebView添加一个事件监听对象(WebViewClient)      
            
              并重写其中的一些方法
                    shouldOverrideUrlLoading:对网页中超链接按钮的响应。
                                              当按下某个连接时WebViewClient会调用这个方法,并传递参数:按下的url 
                    onLoadResource   
                    onPageStart  
                    onPageFinish  
                    onReceiveError
                    onReceivedHttpAuthRequest
              

        6、如果用webview点链接看了很多页以后,如果不做任何处理,点击系统“Back”键,整个浏览器会调用finish()而结束自身,如果希望浏览的网页回退而不是退出浏览器,需要在当前Activity中处理并消费掉该Back事件。
           覆盖Activity类的onKeyDown(int keyCoder,KeyEvent event)方法。

    1.   public boolean onKeyDown(int keyCoder,KeyEvent event){
    2.                         if(webView.canGoBack() && keyCoder == KeyEvent.KEYCODE_BACK){
    3.                                 webview.goBack();   //goBack()表示返回webView的上一页面
    4.                                 return true;
    5.                         }
    6.                         return false;
    7.                 }
  • 相关阅读:
    [CSP-S模拟测试]:party?(霍尔定理+最小割+树链剖分)
    [CSP-S模拟测试]:marshland(最大费用可行流)
    [CSP-S模拟测试]:Revive(点分治)
    [CSP-S模拟测试]:Lighthouse(哈密顿回路+容斥)
    [CSP-S模拟测试]:Lost My Music(凸包)
    [CSP-S模拟测试]:God Knows(线段树维护单调栈)
    [CSP-S模拟测试]:Star Way To Heaven(最小生成树Prim)
    [CSP-S模拟测试]:gcd(莫比乌斯反演)
    [CSP-S模拟测试]:water(BFS)
    BZOJ3462 DZY Loves Math II 【多重背包 + 组合数】
  • 原文地址:https://www.cnblogs.com/LiaoHao/p/3347587.html
Copyright © 2020-2023  润新知