android中WebView加载网页设置进度条

我们平时在进行安卓开发使用到webview加载网页时，我们不能准确了解网页的加载进度，因此为了提高用户体验，我们在webview中加入进度条显示加载进度。

程序预览界面：

一、主界面xml布局文件

[html]  view plain  copy

1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.     xmlns:tools="http://schemas.android.com/tools"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     tools:context=".MainActivity"  
6.     android:orientation="vertical"  
7.    >  
8.     <RelativeLayout  
9.     android:layout_width="match_parent"  
10.     android:layout_height="40dp"  
11.     android:background="#1B9A16"  
12.           
13.         />  
14.           
15.   
16.     <ProgressBar  
17.         android:id="@+id/progressBar1"  
18.         style="?android:attr/progressBarStyleHorizontal"  
19.         android:layout_width="match_parent"  
20.         android:layout_height="3dip"  
21.         android:progressDrawable="@drawable/pg"  
22.         android:visibility="gone"  
23.      
24.         />  
25.   
26.     <WebView  
27.         android:id="@+id/webview1"  
28.         android:layout_below="@id/progressBar1"  
29.         android:layout_width="match_parent"  
30.         android:layout_height="match_parent" />  
31.   
32.      
33. </LinearLayout>  

二、ProgressBar样式布局文件（pg.xml放在drawable下面)

[html]  view plain  copy

1. <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >  
2.   
3.     <item android:id="@android:id/background">  
4.         <shape>  
5.             <corners android:radius="2dp" />  
6.             <gradient  
7.                 android:angle="270"  
8.                 android:centerColor="#E3E3E3"  
9.                 android:endColor="#E6E6E6"  
10.                 android:startColor="#C8C8C8" />  
11.         </shape>  
12.     </item>  
13.     <item android:id="@android:id/progress">  
14.         <clip>  
15.             <shape>  
16.                 <corners android:radius="2dp" />  
17.                 <gradient  
18.                     android:centerColor="#4AEA2F"  
19.                     android:endColor="#31CE15"  
20.                     android:startColor="#5FEC46" />  
21.                   
22.             </shape>  
23.         </clip>  
24.     </item>  
25.   
26. </layer-list>  

三、逻辑代码：

[java]  view plain  copy

1. package com.example.webview;  
2.   
3. import android.os.Bundle;  
4. import android.app.Activity;  
5. import android.transition.Visibility;  
6. import android.view.KeyEvent;  
7. import android.view.Menu;  
8. import android.view.View;  
9. import android.view.Window;  
10. import android.webkit.WebChromeClient;  
11. import android.webkit.WebSettings;  
12. import android.webkit.WebView;  
13. import android.webkit.WebViewClient;  
14. import android.widget.ProgressBar;  
15.   
16. public class MainActivity extends Activity {  
17.       
18.     private WebView webView;  
19.     private ProgressBar pg1;  
20.     @Override  
21.     protected void onCreate(Bundle savedInstanceState) {  
22.         super.onCreate(savedInstanceState);  
23.         requestWindowFeature(Window.FEATURE_NO_TITLE);  
24.         setContentView(R.layout.activity_main);  
25.         init();  
26.         webView.loadUrl("http://www.baidu.com");  
27.     }  
28.   
29.     private void init() {  
30.         // TODO 自动生成的方法存根  
31.         webView=(WebView) findViewById(R.id.webview1);  
32.         pg1=(ProgressBar) findViewById(R.id.progressBar1);  
33.           
34.         webView.setWebViewClient(new WebViewClient(){  
35.             //覆写shouldOverrideUrlLoading实现内部显示网页  
36.             @Override  
37.             public boolean shouldOverrideUrlLoading(WebView view, String url) {  
38.                 // TODO 自动生成的方法存根  
39.                 view.loadUrl(url);  
40.                 return true;  
41.             }  
42.         });  
43.         WebSettings seting=webView.getSettings();  
44.         seting.setJavaScriptEnabled(true);//设置webview支持javascript脚本  
45.         webView.setWebChromeClient(new WebChromeClient(){  
46.             @Override  
47.             public void onProgressChanged(WebView view, int newProgress) {  
48.                 // TODO 自动生成的方法存根  
49.                   
50.                 if(newProgress==100){  
51.                     pg1.setVisibility(View.GONE);//加载完网页进度条消失  
52.                 }  
53.                 else{  
54.                     pg1.setVisibility(View.VISIBLE);//开始加载网页时显示进度条  
55.                     pg1.setProgress(newProgress);//设置进度值  
56.                 }  
57.                   
58.             }  
59.         });  
60.           
61.     }  
62.   
63.       
64.     //设置返回键动作（防止按返回键直接退出程序)  
65.     @Override  
66.     public boolean onKeyDown(int keyCode, KeyEvent event) {  
67.         // TODO 自动生成的方法存根  
68.         if(keyCode==KeyEvent.KEYCODE_BACK) {  
69.             if(webView.canGoBack()) {//当webview不是处于第一页面时，返回上一个页面  
70.                 webView.goBack();  
71.                 return true;  
72.             }  
73.             else {//当webview处于第一页面时,直接退出程序  
74.                 System.exit(0);  
75.             }  
76.               
77.           
78.         }  
79.         return super.onKeyDown(keyCode, event);  
80.     }  
81.       
82.       
83.       
84.   
85.   
86.   
87. }  

整体流程就这样。

代码下载