Loading [MathJax]/jax/input/TeX/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >一款Android WebView进度条显示控件,使其加载进度平滑过渡。

一款Android WebView进度条显示控件,使其加载进度平滑过渡。

原创
作者头像
Jingbin
修改于 2019-09-24 03:09:06
修改于 2019-09-24 03:09:06
2.6K0
举报
文章被收录于专栏:Android 技术栈Android 技术栈

WebProgress

一款Android WebView进度条显示控件,使其加载进度平滑过渡。

GitHub地址:WebProgress

Gif Preview

演示图
演示图

gif可能有点卡,可下载使用此控件的WebView项目查看:网页浏览器

Use

  • 建议直接将类拷贝到项目中:WebProgress
  • xml文件引入:
代码语言:txt
AI代码解释
复制
 <me.jingbin.library.WebProgress
         android:id="@+id/progress"
         android:layout_width="match_parent"
         android:layout_height="2dp" />
  • 显示处理:
代码语言:txt
AI代码解释
复制
 mProgress.show(); // 显示
 mProgress.setWebProgress(50);              // 设置进度
 mProgress.setColor("#D81B60");             // 设置颜色
 mProgress.setColor("#00D81B60","#D81B60"); // 设置渐变色
 mProgress.hide(); // 隐藏

in WebView

  • 显示进度条:
代码语言:txt
AI代码解释
复制
mWebView.loadUrl(mUrl);
mProgress.show();
  • 处理返回进度:
代码语言:txt
AI代码解释
复制
@Override
public void onProgressChanged(WebView view, int newProgress) {
    super.onProgressChanged(view, newProgress);
    mProgress.setWebProgress(newProgress);
}
  • 页面加载结束时:
代码语言:txt
AI代码解释
复制
 @Override
 public void onPageFinished(WebView view, String url) {
    // html加载完成之后,无网隐藏进度条
    if (!CheckNetwork.isNetworkConnected(this)) {
        mProgress.hide();
    }
    super.onPageFinished(view, url);
}

Thanks

此类是从项目Justson/AgentWeb-WebIndicator中将处理WebView进度条剥离出来的,在此基础上进行优化后合并为一个类,便于导入到自己的项目中。其中大部分代码出自原作者,感谢作者的开源精神。

优化处:

  • 1.增加能显示进度渐变色
  • 2.修复progress同时返回两次100时进度条出现两次
  • 3.当一条进度没跑完,又点击其他链接开始第二次进度时,第二次进度不出现
  • 4.修改消失动画时长,使其消失时可以看到进度跑完

End

  • 有问题或更好的建议,欢迎提Issues,我会及时处理,谢谢。
  • 最后附一遍GitHub地址😁:WebProgress

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
史上最全webview详解
WebView在现在的项目中使用的频率应该还是非常高的。 我个人总觉得HTML5是一种趋势。找了一些东西,在此总结。 本篇最后有一个非常不错 的 Html5Activity 加载类,不想看的可以直接跳下载。 WebSettings WebSettings webSettings = mWebView .getSettings(); //支持获取手势焦点,输入用户名、密码或其他 webview.requestFocusFromTouch(); setJavaScriptEnabled(true);
xiangzhihong
2018/02/01
7K0
Android:最全面的 Webview 详解
注意: 每个 Application 只调用一次 WebSettings.setAppCachePath(),WebSettings.setAppCacheMaxSize()
Carson.Ho
2019/02/22
4.8K0
Android 关于WebView全方面的使用(项目应用篇)
WebView的使用已经是老生常谈了,看到很多文章说了用法,但我很少看到全的或者是项目中可以直接使用的,都是看了很多后,自己把功能都集合在一起。这里是一份比较全面的WebView项目应用篇,其中已经解决了应用时出现的很多bug,希望能对大家有帮助。
Jingbin
2018/09/10
1.6K0
项目需求讨论-WebView进度加载条
又到了每次的实际项目开发中的需求讨论了。这次是因为做的项目是原生内嵌WebView,所以当我们的WebView在加载网页的时候,需要有个加载进度条,当然这时候有很多种选择,但是因为普通的对话框类型的加载框太丑,我们就舍弃掉了,而是模仿微信里面的进度加载条,也就是在WebView 的顶部会有一条线来显示加载进度。(也就是下方GIF图中的那个紫红色的进度条,别问我为啥用紫红色。我就觉得用这个颜色更加明显点。O(∩_∩)O~)
青蛙要fly
2018/08/29
1.1K0
项目需求讨论-WebView进度加载条
Android -- 真正的 高仿微信 打开网页的进度条效果
林冠宏-指尖下的幽灵
2018/01/03
1.3K0
Android -- 真正的 高仿微信 打开网页的进度条效果
android的WebView进度条
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/110181.html原文链接:https://javaforall.cn
全栈程序员站长
2022/07/05
8160
带进度条的webview
     如果不使用系统自带的TitleBar(即Activity被设置@android:style/Theme.NoTitleBar),那就需要自己来写进度条了,这里封装了一个自定义控件和加载网页的公共Activity,方便使用。 正文 一、截图 二、自定义控件 复制代码 /**  * 带进度条的WebView  * @author 农民伯伯  * @see http://www.cnblogs.com/over140/archive/2013/03/07/2947721.html  *
xiangzhihong
2018/01/29
7650
仅需四步它就属于你!—WebView最详解
新的一天,新的文章,各位花粉肯定已经准备好学习新的知识了,那么今天依旧为大家带来一个实际项目中也非常实用的控件。现在市面上的 App里几乎都内置了 Web网页,比如说很多电商平台,某东、某宝等等,网页具有更新及时、部署方便等特点,移动端往往会搭配 WebView去加载 H5等页面。那么 WebView究竟是何方神圣呢?Android的 Webview在低版本和高版本采用了不同的 webkit版本内核,4.4后使用了 Chrome内核,而 WebView可以对 url请求、页面加载、渲染、页面交互进行处理。
下码看花
2019/09/10
1.4K0
仅需四步它就属于你!—WebView最详解
WebView开源库终极方案
目录介绍 01.前沿说明 1.1 案例展示效果 1.2 该库功能和优势 1.3 相关类介绍说明 1.4 WebView知识点 02.如何使用 2.1 如何引入 2.2 最简单使用 2.3 常用api 2.4 使用建议 2.5 异常状态类型区分 2.6 该库流程图 03.js调用 3.1 Java调用js方法 3.2 js调用java方法 3.3 js的调用时机分析 3.4 js交互原理分析 04.问题反馈 05.webView优化 06.关于参考 07.其他说明介绍 01.前沿说明 基于腾讯x5开源库,提高
杨充
2019/11/26
3.4K0
11.webview、shareSDK
布局: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <RelativeLayout android:layout_width="match_parent"
六月的雨
2018/05/14
1K0
Android基于JsBridge封装的高效带加载进度的WebView
从去年4月项目就一直用起了JsBridge,前面也针对jsBridge使用姿势介绍过一篇入门篇,《Android JsBridge实战 打造专属你的Hybrid APP》,本篇接着继续深入,通过再次优化封装,大大优化了部分代码,简化上层调用流程,快速部署你的Hybridge APP。
开发者技术前线
2020/11/23
1.8K0
Android基于JsBridge封装的高效带加载进度的WebView
相关推荐
史上最全webview详解
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档