WebView加载过程进度条显示

原创 2015年11月23日 11:54:17

好久没写了,一看都11月份了,最近一直在忙项目开发,经常遇到webview,很不满意之前的加载过程,经同事指点,会了以下这一招,加载过程顶部显示进度条,以下是实现代码:

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
WebSettings webSettings = wvOther.getSettings();

webSettings.setRenderPriority(RenderPriority.HIGH);
if (HttpUtils.isNetworkConnected(this))
{
webSettings.setCacheMode(WebSettings.LOAD_DEFAULT);// 根据cache-control决定是否从网络上取数据。
}
else
{
webSettings.setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);// 只要本地有,无论是否过期,或者no-cache,都使用缓存中的数据
}
wvOther.setWebChromeClient(new MyChromeClient());
// 开启 DOM storage API 功能
webSettings.setDomStorageEnabled(true);
// 开启 database storage API 功能
webSettings.setDatabaseEnabled(true);
String cacheDirPath = getFilesDir().getAbsolutePath() + "/ba/webcache";
// String cacheDirPath =
// getCacheDir().getAbsolutePath()+Constant.APP_DB_DIRNAME;
// 设置数据库缓存路径
webSettings.setDatabasePath(cacheDirPath);
// 设置 Application Caches 缓存目录
webSettings.setAppCachePath(cacheDirPath);
// 开启 Application Caches 功能
webSettings.setAppCacheEnabled(true);

webSettings.setBuiltInZoomControls(false); // 放大缩放按钮
// 如果访问的页面中有JavaScript,则WebView必须设置支持JavaScript
webSettings.setJavaScriptEnabled(true);
// 设置可以支持缩放
webSettings.setSupportZoom(true);
// 扩大比例的缩放
webSettings.setUseWideViewPort(true);
// 自适应屏幕
webSettings.setLayoutAlgorithm(LayoutAlgorithm.NARROW_COLUMNS);
webSettings.setLoadWithOverviewMode(true);
wvOther.loadUrl(slideUrl);
wvOther.setWebViewClient(new WebViewClient()
{
public boolean shouldOverrideUrlLoading(WebView view, String url)
{ // 重写此方法表明点击网页里面的链接还是在当前的webview里跳转,不跳到浏览器那边
view.loadUrl(url);
return true;
}

@Override
public void onPageStarted(WebView view, String url, Bitmap favicon)
{

super.onPageStarted(view, url, favicon);
mCustomView.showLoadStateView(CustomView.STATE_NONE);
}

@Override
public void onPageFinished(WebView view, String url)
{
super.onPageFinished(view, url);
mCustomView.showLoadStateView(CustomView.STATE_NONE);
}

@Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl)
{
super.onReceivedError(view, errorCode, description, failingUrl);
mCustomView.showLoadStateView(CustomView.STATE_EMPTY);
}

});

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
// 设置加载进度
public class MyChromeClient extends android.webkit.WebChromeClient
{
@Override
public void onProgressChanged(WebView view, int newProgress)
{
mProgressBar.setProgress(newProgress);
if (newProgress == 100)
{
mProgressBar.setVisibility(View.GONE);
}
else
{
mProgressBar.setVisibility(View.VISIBLE);

}
super.onProgressChanged(view, newProgress);
}

@Override
public void onReceivedTitle(WebView view, String title)
{
super.onReceivedTitle(view, title);
// mTv_title.setText(title);
}

}

布局中需添加:

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
<ProgressBar
android:id="@+id/mProgressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="fill_parent"
android:layout_height="3dp"
android:layout_below="@+id/otherTitle"
android:background="@null"
android:indeterminateOnly="false"
android:max="100"
android:progressDrawable="@drawable/progress_bar_horizontal" />

progress_bar_horizontal.xml:

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

<item
android:id="@android:id/background"
android:drawable="@color/transparent"/>
<item android:id="@android:id/progress">
<clip>
<shape>
<gradient
android:angle="270"
android:centerColor="@color/progress2"
android:centerY="0.75"
android:endColor="@color/progress3"
android:startColor="@color/progress1" />
</shape>
</clip>
</item>

</layer-list>

color.xml:

 1
 2
 3
 4
<!-- 网页加载进度条颜色变化 -->
<color name="progress1">#B9DEF5</color>
<color name="progress2">#CDE7F8</color>
<color name="progress3">#E7F3FC</color>

实现效果如下:


不难,就是配置多了点,因为觉得经常会用到,所以做了下记录~~~

版权声明:本文为博主原创文章,未经博主允许不得转载。

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

我们平时在进行安卓开发使用到webview加载网页时,我们不能准确了解网页的加载进度,因此为了提高用户体验,我们在webview中加入进度条显示加载进度。 程序预览界面: 一、主界面xml布局文...

android - WebView加载网页带进度条

先上图: java代码:带沉浸式显示package com.baofoo.mobile.wallet.common.activity; import android.app.Activi...

仿微信中加载网页时带线行进度条的WebView的实现

为了仿微信中加载网页时带进度条的WebView的实现,首先我们来看一下微信中的效果是什么样的: 明确需求之后,我们来开始动手做,首先我们来自定义一个带进度条的WebView,名字为Progre...

Delphi7高级应用开发随书源码

  • 2003年04月30日 00:00
  • 676KB
  • 下载

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

一、主界面xml布局文件 二、ProgressBar样式布局文件(pg.xml放在drawable下面) 三、逻辑代码:...

WebView加载网页及进度条

import android.content.Intent; import android.os.Bundle; import android.support.v7.app.AppCompatActi...

WebView加载进度Progress的显示

最近项目中用到WebView来显示网页,  一般浏览器加载网页都会显示进度,所以想在使用WebView时也能显示加载进度,现在尝试几种实现方法 ~~ 一。利用Window的进度条     ...

WebView流程分析(上)

断断续续调试好几天,才把X5WebView的整体流程大概了解清除。本篇是上篇,侧重于讲java层的逻辑。   整个WebKit主要分为2个线程,一个是Ui线程,也就是应用程序使用WebView所在...
  • weolar
  • weolar
  • 2015年05月20日 19:38
  • 1896

Android中如何判别WebView加载完毕并使用ProgressDialog进行提示

最近在搞广告平台的一些东西,看了一下别的广告平台的jar包,基本上都会有一个Activity用来显示web网页,用到了一个用来显示网页的组件--WebView。但是其网页的加载进度就不受我们控制了,所...
  • agods
  • agods
  • 2012年04月10日 09:30
  • 35145

webView加载进度条

webview 加载进度条满足个性化需求。。
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:WebView加载过程进度条显示
举报原因:
原因补充:

(最多只允许输入30个字)