使用Timer实现网页匀速加载的进度条样式

 更新时间:2017年01月19日 15:40:32   作者:GuoXingWei_ToGo  
这篇文章主要介绍了使用Timer实现网页匀速加载的进度条样式,在使用WebView加载网页时有时候网速等原因加载比较慢时,影响用户的体验度,今天小编给大家分享使用timer实现网页匀速加载的进度条样式,需要的的朋友参考下吧

在使用WebView加载网页时有时候网速等原因加载比较慢时,为了避免在加载网页的时候出现一片空白的区域,给用户很不好的体验感,我们往往在加载的时候添加一个进度条,使用户直观的感受到网页加载的进度,通常我们可以通过WebChromeClient里面的onProgressChanged()方法获取到当前的网页加载进度,但是当我们使用时会发现他的网页加载进度不是一点一点加载的,也许一下就加载到50%下一秒直接加载到80%,如果我们将其设置给progressBar看起来就很快而且很不顺畅,体验感较差,如下图所示加载的网页进度:

这里写图片描述

假如这样将其进度设置到progressBar的体验感就相当的差,如下图所示:

这里写图片描述

现在我们希望想要其在加载网页的时候希望给用户一种匀速加载的感觉,尽管他不是网页真正加载的进度,但我们只需要在网页刚开始加载后和网页加载结束前模拟一个匀速加载的效果,也就是重写WebViewClient的onPageStarted()方法,在其中开启一个定时器,重写onPageFinished(),将定时器关闭掉,达到匀速加载网页的效果,提到定时器,就不得不说一下相关的东西了。

简单来说就分成两个东西,一个Timer,另外一个就是timer的所要执行的计划或者说是任务(Task),将这个任务(task)设置给定时器(timer),告诉定时器(timer)什么时候执行任务(Task),而任务就是我们要要干的事,可以这样说定时器想一个闹钟(Timer),任务相当于我们起床(任务Task),当闹钟执行到我们设置的时间时(schedule),就提醒我们该起床了

Timer执行指定的任务可以有一下几种方法

//在指定的时间执行指定的任务。
 public void schedule(TimerTask task, Date when) {}
 //延迟指定时间后执行指定的任务
 public void schedule(TimerTask task, long delay) {}
 //按设置延迟时间和时间间隔重复执行指定的任务
 public void schedule(TimerTask task, long delay, long period) {}
 //在指定的时间和时间间隔重复执行指定的任务
 public void schedule(TimerTask task, Date when, long period) {}

在onPageStarted()我们通过开启一个定时器,每隔50ms开始progress+1,直到onPageFinished()取消定时器
package com.example.timerdemo;

import java.util.Timer;
import java.util.TimerTask;
import android.app.Activity;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.ProgressBar;
public class MainActivity extends Activity {
 private ProgressBar progressbar;
 private Activity _rootActivity;
 private WebView webView;
 private WebClient webClient;
 private Timer timer = new Timer();
 private int currentProgress = 0;
 String url = "http://appagent.gyfc.net.cn/NewHouse/index";
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  progressbar = (ProgressBar) findViewById(R.id.web_progressbar);
  webView = (WebView) findViewById(R.id.webView);
  webClient = new WebClient();
  webView.setWebViewClient(webClient);
  webView.setWebChromeClient(new WebChromeClient(){
   @Override
   public void onProgressChanged(WebView view, int newProgress) {
    super.onProgressChanged(view, newProgress);
    if (newProgress == 100) {
     stopTimeTask();
     progressbar.setVisibility(View.GONE);
    } else {
     if (newProgress > currentProgress) {
      progressbar.setProgress(newProgress);
      currentProgress = newProgress;
     }
    }
   }
  });
  findViewById(R.id.btn).setOnClickListener(new OnClickListener() {
   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    webView.loadUrl(url);
   }
  });
 }
 class WebClient extends WebViewClient{
  @Override
  public void onPageStarted(WebView view, String url, Bitmap favicon) {   super.onPageStarted(view, url, favicon);
   startTimeTask();
  }
  @Override
  public void onPageFinished(WebView view, String url) {
   // TODO Auto-generated method stub
   super.onPageFinished(view, url);
   stopTimeTask();
  }
 }
 /**
  * 启动定时器
  */
 private void startTimeTask() {
  stopTimeTask();
  timer = new Timer();
  timer.schedule(new TimerTask() {
   @Override
   public void run() {
    runOnUiThread(new Runnable() {
     @Override
     public void run() {
      // TODO Auto-generated method stub
      if (currentProgress < 90) {
       currentProgress += 1;
       progressbar.setProgress(currentProgress);
      } else {
       stopTimeTask();
      }
     }
    });
   }
  }, 0, 50);
 }
 /**
  * 关闭定时器
  */
 private void stopTimeTask() {
  if (timer != null) {
   timer.cancel();
   timer = null;
  }
 }
}
<RelativeLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical" >
  <ProgressBar
   android:id="@+id/web_progressbar"
   style="?android:attr/progressBarStyleHorizontal"
   android:layout_width="match_parent"
   android:layout_height="3dp"
   android:progressDrawable="@drawable/progressbar_bg_style" />
  <WebView
   android:id="@+id/webView"
   android:layout_below="@id/web_progressbar"
   android:layout_width="match_parent"
   android:layout_height="match_parent" />
  <Button 
   android:id="@+id/btn"
   android:layout_width="match_parent"
   android:layout_height="40dp"
   android:text="加载网页"
   android:layout_alignParentBottom="true"
   android:background="#e5e5e5"/>
</RelativeLayout>

执行效果如下所示:

这里写图片描述

以上所述是小编给大家介绍的使用Timer实现网页匀速加载的进度条样式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • Android 中cookie的处理详解

    Android 中cookie的处理详解

    这篇文章主要介绍了Android 中cookie的处理详解的相关资料,主要介绍Android 中Cookie 的操作,希望通过本文能帮助到大家,需要的朋友可以参考下
    2017-08-08
  • 详解Flutter Widget

    详解Flutter Widget

    本文主要讲解了Flutter Widget,它是是描述 Flutter UI 的基本单元,需要进一步了解的小伙伴可以参考一下这篇文章
    2021-08-08
  • Android实现同频共帧动画效果

    Android实现同频共帧动画效果

    我们听过“同频共振”,其原理是多个物体物体以同样的频率振动,但是本篇实现的效果是“同频共帧”,含义是:动画以同样的频率和同样的帧展示在多个不同View上,文中通过代码示例介绍的非常详细,感兴趣的同学可以自己动手尝试一下
    2024-01-01
  • 快速解决设置Android 23.0以上版本对SD卡的读写权限无效的问题

    快速解决设置Android 23.0以上版本对SD卡的读写权限无效的问题

    今天小编就为大家分享一篇快速解决设置Android 23.0以上版本对SD卡的读写权限无效的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • Android自定义控件之刻度尺控件

    Android自定义控件之刻度尺控件

    这篇文章主要介绍了Android自定义控件之刻度尺控件,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-06-06
  • Android开发之软键盘用法实例分析

    Android开发之软键盘用法实例分析

    这篇文章主要介绍了Android开发之软键盘用法,实例分析了Android软键盘的实现技巧,需要的朋友可以参考下
    2015-05-05
  • Android自定义PopWindow带动画向下弹出效果

    Android自定义PopWindow带动画向下弹出效果

    这篇文章主要为大家详细介绍了Android自定义PopWindow带动画向下弹出效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • Android Studio+MAT实战内存泄漏

    Android Studio+MAT实战内存泄漏

    这篇文章主要介绍了Android Studio+MAT实战内存泄漏的相关技术内容,并在需要注意的地方做了提示,需要参考学习下吧。
    2017-12-12
  • Android实现判断某个服务是否正在运行的方法

    Android实现判断某个服务是否正在运行的方法

    这篇文章主要介绍了Android实现判断某个服务是否正在运行的方法,涉及Android针对系统服务运行状态的判断技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-10-10
  • ListView实现聊天列表之处理不同数据项

    ListView实现聊天列表之处理不同数据项

    这篇文章主要为大家详细介绍了ListView实现聊天列表之处理不同数据项,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-11-11

最新评论