自定义带进度条webView

由于最近项目部分需求要访问网页查阅信息，如：学历查询，学位查询，英语四六级查询等。

在这里总结下完成的方式，难度也不算大。

自定义带进度条的WebView控件：

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

package app.ui.widget;

import android.content.Context;
import android.util.AttributeSet;
import android.webkit.WebView;
import android.widget.ProgressBar;
/**
 * 自定义WebView带进度条
 * @author gaochun
 *
 */
@SuppressWarnings("deprecation")
public class ProgressWebView extends WebView {

    private ProgressBar progressbar; /** 进度条 */

    public ProgressWebView(Context context, AttributeSet attrs) {
        super(context, attrs);
        // 初始化进度条
        progressbar = new ProgressBar(context, null, android.R.attr.progressBarStyleHorizontal);
        // 设置进度条风格
        progressbar.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, 5, 0, 0));
        addView(progressbar);
        setWebChromeClient(new WebChromeClient());

    }

    public class WebChromeClient extends android.webkit.WebChromeClient {
        @Override
        public void onProgressChanged(WebView view, int newProgress) {
            if (newProgress == 100) {
                progressbar.setVisibility(GONE);    // 加载完成隐藏进度条
            } else {
                if (progressbar.getVisibility() == GONE)
                    progressbar.setVisibility(VISIBLE);
                progressbar.setProgress(newProgress);
            }
            super.onProgressChanged(view, newProgress);
        }
    }

    @Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        LayoutParams lp = (LayoutParams) progressbar.getLayoutParams();
        lp.x = l;
        lp.y = t;
        progressbar.setLayoutParams(lp);
        super.onScrollChanged(l, t, oldl, oldt);
    }
}

在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>  

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="@dimen/content_padding" >

    <app.ui.widget.ProgressWebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/tv_error"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center|center_vertical"
        android:text="查询失败"
        android:visibility="gone" />

</FrameLayout>

在Activity中使用：

[java] view plain copy

print ?

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

/*******************************************************************************
 *
 * Copyright (c) Weaver Info Tech Co. Ltd
 *
 * SelectActivity
 *
 * app.ui.activity.service.SelectActivity.java
 * TODO: File description or class description.
 *
 * @author: Administrator
 * @since:  2014-5-16
 * @version: 1.0.0
 *
 * @changeLogs:
 *     1.0.0: First created this class.
 *
 ******************************************************************************/
package app.ui.activity.service;

import mobi.kuaidian.qunakao.R;
import android.content.Intent;
import android.os.Bundle;
import android.view.KeyEvent;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import app.ui.widget.ProgressWebView;
/**
 * @author Administrator
 *
 */
public class ResultActivity extends Activity{

    public static final String SELECT_XUELI = "http://www.chsi.com.cn/xlcx/lscx.jsp";   //学历查询地址

    private ProgressWebView mWebView;
    private WebSettings mWebSettings;

    /* (non-Javadoc)
     * @see app.ui.TitleActivity#onCreate(android.os.Bundle)
     */
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setUpViews();
    }


    private void setUpViews()
    {
        setContentView(R.layout.activity_result);
        showBackwardView(R.string.button_backward, true);
        mWebView = (ProgressWebView)findViewById(R.id.webview);
        mWebView.loadUrl(BaseActivity.SELECT_XUELI);


        mWebSettings = mWebView.getSettings();
        mWebSettings.setJavaScriptEnabled(true);    //允许加载javascript
        mWebSettings.setSupportZoom(true);          //允许缩放
        mWebSettings.setBuiltInZoomControls(true);  //原网页基础上缩放
        mWebSettings.setUseWideViewPort(true);      //任意比例缩放

        /*****************************************************************
         * 在点击请求的是链接时才会调用，重写此方法返回true表明点击网页里
         * 面的链接还是在当前的WebView里跳转，不会跳到浏览器上运行。
         *****************************************************************/
        mWebView.setWebViewClient(new WebViewClient(){
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return super.shouldOverrideUrlLoading(view, url);
            }
        });
    }

    /***********************************************************
     * 监听返回键
     * 注：这里的返回键是指在加载的网页中进入了另一个连接，点击返回
     ***********************************************************/
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack()) {
            mWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}

AndroidManifest.xml添加权限：

[html] view plain copy

print ?

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

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

效果图显示：

Android 中Webview 自适应屏幕

webview中右下角的缩放按钮能不能去掉

settings.setDisplayZoomControls(false); //隐藏webview缩放按钮

 

让Webview加载的页面居中显示有我知道的几种方法

第一种方法：

WebSettings settings = webView.getSettings(); 
settings.setLayoutAlgorithm(LayoutAlgorithm.SINGLE_COLUMN); 
LayoutAlgorithm是一个枚举用来控制页面的布局，有三个类型：

1.NARROW_COLUMNS：可能的话使所有列的宽度不超过屏幕宽度

2.NORMAL：正常显示不做任何渲染

3.SINGLE_COLUMN：把所有内容放大webview等宽的一列中

用SINGLE_COLUMN类型可以设置页面居中显示，页面可以放大缩小，但这种方法不怎么好，有时候会让你的页面布局走样而且我测了一下，只能显示中间那一块，超出屏幕的部分都不能显示。

 

第二种方法：

//设置加载进来的页面自适应手机屏幕 
        settings.setUseWideViewPort(true); 
        settings.setLoadWithOverviewMode(true); 
第一个方法设置webview推荐使用的窗口，设置为true。第二个方法是设置webview加载的页面的模式，也设置为true。

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

两种方法都试过，推荐使用第二种方法

 

第三种方法：（主要用于平板，针对特定屏幕代码调整分辨率）
    DisplayMetrics metrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(metrics);
    int mDensity = metrics.densityDpi;

    if (mDensity == 120) {
              settings.setDefaultZoom(ZoomDensity.CLOSE);
          }else if (mDensity == 160) {
              settings.setDefaultZoom(ZoomDensity.MEDIUM);
          }else if (mDensity == 240) {
              settings.setDefaultZoom(ZoomDensity.FAR);
          }

好文要顶 关注我

1

0

« 上一篇： Eclipse下加载Android SDK源码
» 下一篇： 网页图片缩放(js)

</div><!--end: forFlow -->