webview的两种progressbar

<p>我上一个项目在需要加载webview , 而webview加载网页的方法我们都是知道的loadURL方法和loaddata方法,这里就不说这些。</p><p>现在我要说的是,在webview加载网页如果没有进度条也就是progressbar是一个很别扭的事情,而现在最常见的两种进度条:一种为线条形状的进度条,一种是圆形旋转的进度条,我现在就详细说下这两个进度条:</p><p>线条形状的进度条:</p><p><span style="white-space: pre;">	</span>我的方法是重写一个webview,在webview上直接的增加progressbar,</p><p>直接上代码:</p>


package com.example.integral.utils;

import android.content.Context;
import android.graphics.Color;
import android.util.AttributeSet;
import android.view.WindowManager.LayoutParams;
import android.webkit.WebView;
import android.widget.ProgressBar;

/**
 * 带进度条的WebView
 * 
 */
@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 = new ProgressBar(context, attrs, defStyle) 
		progressbar.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, 3, 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);
	}
}
其中
setWebChromeClient(new WebChromeClient());
<pre name="code" class="java">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);
		}

	}


可以直接在Activity中设置。

他的布局很简单,就是

    <com.example.integral.utils.ProgressWebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:focusable="false"
        />

这样我们在Activity中直接事例化这个就可以了。 

图形旋转:

我用的是一个图片旋转实现的progressbar效果,所以,我首先做的是给这个图片增加旋转事件:

首先我们定义一个Imageview/Imagebutton , 

代码是:

 

 <ImageView
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:id="@+id/floatbtn"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginBottom="16dp"
        android:layout_marginRight="16dp"
        android:tint="@android:color/white"
        android:src="@drawable/ic_refresh"
        />

中间有一个floatview.xml文件,是动画的anim,其代码为:

<?xml version="1.0" encoding="utf-8"?>  
<set xmlns:android="http://schemas.android.com/apk/res/android">  
    <rotate  
        android:fromDegrees="0"  
        android:toDegrees="359"  
        android:duration="500"  
        android:repeatCount="-1"  
        android:pivotX="50%"  
        android:pivotY="50%" />  
</set>


然后给这个Imageview或者Imagebutton添加动画,动画代码是:

final Animation operatingAnim = AnimationUtils.loadAnimation(this, R.anim.floatview);
		LinearInterpolator lin = new LinearInterpolator();
		operatingAnim.setInterpolator(lin);

好了 ,图片的旋转效果已经完成,我们这个时候就要这些动画效果和我们的webview 关联起来,这个时候使用的是WebViewClient类中的方法,

其中,onPageStarted是webview开始加载网页的方法重写,onPageFinished是webview加载网页结束的方法重写,所以我们只要在开始加载网页的时候开始动画,加载结束的时候关闭动画就可以了,代码如下:

	if (webview != null) {
			webview.setWebViewClient(new WebViewClient() {
				@Override
				public void onPageStarted(WebView view, String url, Bitmap favicon) {
					// TODO 自动生成的方法存根
					super.onPageStarted(view, url, favicon);
					floatbtn.startAnimation(operatingAnim);//图片开始旋转
				}

				@Override
				public void onPageFinished(WebView view, String url) {
					floatbtn.clearAnimation(); //图片结束旋转
				}
			});
		}

That's all ...




你可能感兴趣的:(webview的两种progressbar)