Android控件：WebVIew（二）显示网页或本地html文件

[java]  view plain copy print ?

1. package app.ui.widget;  
2.   
3. import android.content.Context;  
4. import android.util.AttributeSet;  
5. import android.webkit.WebView;  
6. import android.widget.ProgressBar;  
7. /** 
8.  * 自定义WebView带进度条 
9.  * @author gaochun 
10.  * 
11.  */  
12. @SuppressWarnings("deprecation")  
13. public class ProgressWebView extends WebView {  
14.      
15.     private ProgressBar progressbar; /** 进度条 */  
16.   
17.     public ProgressWebView(Context context, AttributeSet attrs) {  
18.         super(context, attrs);  
19.         // 初始化进度条  
20.         progressbar = new ProgressBar(context, null, android.R.attr.progressBarStyleHorizontal);  
21.         // 设置进度条风格  
22.         progressbar.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, 5, 0, 0));  
23.         addView(progressbar);  
24.         setWebChromeClient(new WebChromeClient());  
25.   
26.     }  
27.   
28.     public class WebChromeClient extends android.webkit.WebChromeClient {  
29.         @Override  
30.         public void onProgressChanged(WebView view, int newProgress) {  
31.             if (newProgress == 100) {  
32.                 progressbar.setVisibility(GONE);    // 加载完成隐藏进度条  
33.             } else {  
34.                 if (progressbar.getVisibility() == GONE)  
35.                     progressbar.setVisibility(VISIBLE);  
36.                 progressbar.setProgress(newProgress);  
37.             }  
38.             super.onProgressChanged(view, newProgress);  
39.         }  
40.     }  
41.   
42.     @Override  
43.     protected void onScrollChanged(int l, int t, int oldl, int oldt) {  
44.         LayoutParams lp = (LayoutParams) progressbar.getLayoutParams();  
45.         lp.x = l;  
46.         lp.y = t;  
47.         progressbar.setLayoutParams(lp);  
48.         super.onScrollChanged(l, t, oldl, oldt);  
49.     }  
50. }  

在xml中使用：

[html]  view plain copy print ?

1. <?xml version="1.0" encoding="utf-8"?>  
2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:padding="@dimen/content_padding" >  
6.   
7.     <app.ui.widget.ProgressWebView  
8.         android:id="@+id/webview"  
9.         android:layout_width="match_parent"  
10.         android:layout_height="match_parent" />  
11.   
12.     <TextView  
13.         android:id="@+id/tv_error"  
14.         android:layout_width="match_parent"  
15.         android:layout_height="match_parent"  
16.         android:gravity="center|center_vertical"  
17.         android:text="查询失败"  
18.         android:visibility="gone" />  
19.   
20. </FrameLayout>  

在Activity中使用：

[java]  view plain copy print ?

1. /******************************************************************************* 
2.  * 
3.  ******************************************************************************/  
4. package app.ui.activity.service;  
5.   
6. import mobi.kuaidian.qunakao.R;  
7. import android.content.Intent;  
8. import android.os.Bundle;  
9. import android.view.KeyEvent;  
10. import android.webkit.WebSettings;  
11. import android.webkit.WebView;  
12. import android.webkit.WebViewClient;  
13. import app.ui.widget.ProgressWebView;  
14. /** 
15.  * @author Administrator 
16.  * 
17.  */  
18. public class ResultActivity extends Activity{  
19.   
20.     public static final String SELECT_XUELI = "http://www.chsi.com.cn/xlcx/lscx.jsp";   //学历查询地址  
21.   
22.     private ProgressWebView mWebView;  
23.     private WebSettings mWebSettings;  
24.   
25.     /* (non-Javadoc) 
26.      * @see app.ui.TitleActivity#onCreate(android.os.Bundle) 
27.      */  
28.     @Override  
29.     protected void onCreate(Bundle savedInstanceState) {  
30.         super.onCreate(savedInstanceState);  
31.         setUpViews();  
32.     }  
33.   
34.   
35.     private void setUpViews()  
36.     {  
37.         setContentView(R.layout.activity_result);  
38.         showBackwardView(R.string.button_backward, true);  
39.         mWebView = (ProgressWebView)findViewById(R.id.webview);  
40.         mWebView.loadUrl(BaseActivity.SELECT_XUELI);  
41.   
42.   
43.         mWebSettings = mWebView.getSettings();  
44.         mWebSettings.setJavaScriptEnabled(true);    //允许加载javascript  
45.         mWebSettings.setSupportZoom(true);          //允许缩放  
46.         mWebSettings.setBuiltInZoomControls(true);  //原网页基础上缩放  
47.         mWebSettings.setUseWideViewPort(true);      //任意比例缩放  
48.   
49.         /***************************************************************** 
50.          * 在点击请求的是链接时才会调用，重写此方法返回true表明点击网页里 
51.          * 面的链接还是在当前的WebView里跳转，不会跳到浏览器上运行。 
52.          *****************************************************************/  
53.         mWebView.setWebViewClient(new WebViewClient(){  
54.             @Override  
55.             public boolean shouldOverrideUrlLoading(WebView view, String url) {  
56.                 view.loadUrl(url);  
57.                 return super.shouldOverrideUrlLoading(view, url);  
58.             }  
59.         });  
60.     }  
61.   
62.     /*********************************************************** 
63.      * 监听返回键 
64.      * 注：这里的返回键是指在加载的网页中进入了另一个连接，点击返回 
65.      ***********************************************************/  
66.     public boolean onKeyDown(int keyCode, KeyEvent event) {  
67.         if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {  
68.             mWebView.goBack();  
69.             return true;  
70.         }  
71.         return super.onKeyDown(keyCode, event);  
72.     }  
73. }  

AndroidManifest.xml添加权限：

[html]  view plain copy print ?

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

效果图显示：

方式一：

[java]  view plain copy print ?

1. WebSettings mWebSettings = webView.getSettings();   
2. mWebSettings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN);  

LayoutAlgorithm 是一个枚举用来控制页面的布局，其有三个类型：

1.NARROW_COLUMNS：可能的话使所有列的宽度不超过屏幕宽度
2.NORMAL：正常显示不做任何渲染
3.SINGLE_COLUMN：把所有内容放大webview等宽的一列中

用SINGLE_COLUMN类型可以设置页面居中显示，页面可以放大缩小，但这种方法有缺陷，有时候会让你的页面布局扭曲(不推荐使用)。

方式二：

[java]  view plain copy print ?b

1. //设置载入页面自适应手机屏幕，居中显示   
2. WebSettings mWebSettings = webView.getSettings();   
3. mWebSettings.setUseWideViewPort(true);   
4. mWebSettings.setLoadWithOverviewMode(true);   

setUseWideViewPort是设置webview推荐使用的窗口，设置为true。
setLoadWithOverviewMode是设置webview加载的页面的模式，也设置为true。

这方法可以让你的页面适应手机屏幕的分辨率，完整的显示在屏幕上，可以放大缩小(推荐使用)。

WebView缩放问题：


1、webview支持页面缩放
//缩放开关
webView.getSettings().setSupportZoom(true);
设置此属性，仅支持双击缩放，不支持触摸缩放（android4.0）


// 设置是否可缩放
webView.getSettings().setBuiltInZoomControls(true);
如果设置了此属性，那么webView.getSettings().setSupportZoom(true);也默认设置为true


2、无限缩放
无限缩放，就需要使用大视图模式，如下：
webView.getSettings().setUseWideViewPort(true);设置此属性，可任意比例缩放。
注：1、初始缩放值可这样设置：webView.setInitialScale(initalValue);
      2、缩放后，要使内容适配屏幕，不超出屏幕外显示，实现换行。这方面效果应该由html控制。
   如<p style="word-break:break-all">test</p>实现自动换行

[java]  view plain copy print ?

1. public class ResultActivity extends TitleActivity{  
2.   
3.     private WebView mWebView;  
4.     private WebSettings mWebSettings;  
5.   
6.     /* (non-Javadoc) 
7.      * @see app.ui.TitleActivity#onCreate(android.os.Bundle) 
8.      */  
9.     @Override  
10.     protected void onCreate(Bundle savedInstanceState) {  
11.         super.onCreate(savedInstanceState);  
12.         setUpViews();  
13.     }  
14.   
15.     private void setUpViews()  
16.     {  
17.         setContentView(R.layout.activity_result);  
18.         showBackwardView(R.string.button_backward, true);  
19.         mWebView = (WebView)findViewById(R.id.webview);  
20.   
21.         mWebSettings = mWebView.getSettings();  
22.         mWebSettings.setJavaScriptEnabled(true);    //允许加载javascript  
23.         //mWebSettings.setSupportZoom(true);          //允许缩放  
24.         //mWebSettings.setBuiltInZoomControls(true);  
25.         //mWebSettings.setUseWideViewPort(true);      //任意比例缩放  
26.           
27.         mWebSettings.setUseWideViewPort(true);      //设置加载进来的页面自适应手机屏幕（可缩放）  
28.         mWebSettings.setLoadWithOverviewMode(true)；  
29.   
30.         mWebView.setWebViewClient(new WebViewClient(){  
31.             @Override  
32.             public boolean shouldOverrideUrlLoading(WebView view, String url) {  
33.                 view.loadUrl(url);  
34.                 return super.shouldOverrideUrlLoading(view, url);  
35.             }  
36.         });  
37.     }  
38. }