Android仿微信公众号文章页面加载进度条

 更新时间:2020年06月19日 11:38:36   作者:七号座先生  
这篇文章主要为大家详细介绍了Android仿微信公众号文章页面加载进度条,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

前言:

微信公众号文章详情页面加载的时候,WebView会在头部显示一个进度条,这样做的好处就是用户可以一边加载网页内容的同时也可浏览网页内容,不需要等完全加载完之后才全部显示出来。如何实现呢? 其实很简单,自定义一个WebView就可以实现了。

详细实现步骤如下 :

1、自定义一个ProgressWebView 继续 Webview

@SuppressWarnings("deprecation")
public class ProgressWebView extends WebView {

 private ProgressBar progressbar;

 public ProgressWebView(Context context) {
 super(context);
 init(context);
 }

 private void init(Context context) {
 progressbar = new ProgressBar(context, null,
  android.R.attr.progressBarStyleHorizontal);
 progressbar.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,
  6, 0, 0));
 progressbar.setProgressDrawable(this.getResources().getDrawable(
  R.drawable.btn_progress_webview));
 addView(progressbar);
 setWebChromeClient(new WebChromeClient());
 }

 public ProgressWebView(Context context, AttributeSet attrs) {
 super(context, attrs);
 init(context);
 }

 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);
 }
}

2、设置R.drawable.btn_progress_webview 进度条的颜色值:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

 <!-- 设置背景色(黑色) -->
 <item android:id="@android:id/background">
 <shape>

  <!-- 进度条的四个棱角大小 0 为都是直角 随着值的增大角越圆滑 -->
  <corners android:radius="0dip" />

  <gradient
  android:endColor="#c0c0c0"
  android:startColor="#c0c0c0" />
 </shape>
 </item>

 <!-- 设置进度条颜色(绿色) -->
 <item android:id="@android:id/progress">
 <clip>
  <shape>
  <corners android:radius="0dip" />

  <gradient
   android:endColor="#a13864"
   android:startColor="#a13864" />
  </shape>
 </clip>
 </item>

</layer-list>

3、在布局文件是如何使用呢?

<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"
 tools:context="com.summer.progresswebview.MainActivity" >

 <com.summer.progresswebview.ProgressWebView

 android:id="@+id/progresswebview"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"/>

</RelativeLayout>

4、在Activity中是如何使用 和显示网页内容的 :

public class MainActivity extends Activity {
 private ProgressWebView progresswebview;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_main);
 initView();
 }

 private void initView() {
 progresswebview = (ProgressWebView) findViewById(R.id.progresswebview);
 progresswebview.getSettings()
  .setCacheMode(WebSettings.LOAD_CACHE_ELSE_NETWORK);
 progresswebview.getSettings().setJavaScriptEnabled(true);
 progresswebview.getSettings().setSupportZoom(true);
 progresswebview.getSettings().setLoadWithOverviewMode(true);
 progresswebview.getSettings().setUseWideViewPort(true);
 progresswebview.setVerticalScrollBarEnabled(false);
 progresswebview.setHorizontalScrollBarEnabled(false);// 水平不显示

 progresswebview.getSettings().setBuiltInZoomControls(true); // 支持页面放大缩小按钮
 progresswebview.setWebViewClient(client);
 progresswebview.loadUrl("https://www.baidu.com/"); // 加载百度首页网址
 }

private WebViewClient client = new WebViewClient() {

 @Override
 public void onPageFinished(WebView view, String url) {
  super.onPageFinished(view, url);
  progresswebview.getSettings().setLoadsImagesAutomatically(true);
 }

 @Override
 public void onPageStarted(WebView view, String url, Bitmap favicon) {
  super.onPageStarted(view, url, favicon);
 }


 public boolean shouldOverrideUrlLoading(WebView view, String url) {

  //调用拨号程序 
  if (url.startsWith("mailto:") || url.startsWith("geo:") ||url.startsWith("tel:")) { 
  Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url)); 
  startActivity(intent); 
  }else
  view.loadUrl(url);


  return true;
 }

 public void onReceivedError(WebView view, int errorCode,
  String description, String failingUrl) {

 }

 };

}

通过这几个步骤,就是实现跟微信公众号文章详情页显示的进度条一致了。

效果图:

源码下载:Android微信页面加载进度条

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • Android中Lifecycle的原理详解

    Android中Lifecycle的原理详解

    大家好,本篇文章主要讲的是Android中Lifecycle的原理详解,感兴趣的同学赶快来看一看吧,对你有帮助的话记得收藏一下
    2022-01-01
  • Android之仿美团加载数据帧动画

    Android之仿美团加载数据帧动画

    本文主要介绍了Android仿美团加载数据帧动画的实例方法。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-04-04
  • Android开发中的重力传感器用法实例详解

    Android开发中的重力传感器用法实例详解

    这篇文章主要介绍了Android开发中的重力传感器用法,简单分析了Android重力传感器的基本功能、使用方法,并结合实例形式分析了Android基于重力传感器实现横竖屏切换的相关操作技巧,需要的朋友可以参考下
    2017-11-11
  • Android开发之在程序中时时获取logcat日志信息的方法(附demo源码下载)

    Android开发之在程序中时时获取logcat日志信息的方法(附demo源码下载)

    这篇文章主要介绍了Android开发之在程序中时时获取logcat日志信息的方法,结合实例形式较为详细的分析了实时获取logcat日志的原理、步骤与相关实现技巧,并附带相应的demo源码供读者下载参考,需要的朋友可以参考下
    2016-02-02
  • Android四种数据存储的应用方式

    Android四种数据存储的应用方式

    这篇文章主要介绍了Android四种数据存储的应用方式的相关资料,希望通过本文能帮助到大家,让大家理解掌握Android存储数据的方法,需要的朋友可以参考下
    2017-10-10
  • 详解Gradle依赖冲突解决方式

    详解Gradle依赖冲突解决方式

    这篇文章主要介绍了Gradle依赖冲突解决方式,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • android使用Socket通信实现多人聊天应用

    android使用Socket通信实现多人聊天应用

    这篇文章主要为大家详细介绍了android使用Socket通信实现多人聊天应用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-03-03
  • 完美解决Android客户端RSA解密部分乱码的问题

    完美解决Android客户端RSA解密部分乱码的问题

    下面小编就为大家分享一篇完美解决Android客户端RSA解密部分乱码的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • Android自定义密码输入框和数字键盘

    Android自定义密码输入框和数字键盘

    这篇文章主要为大家详细介绍了Android自定义密码输入框和数字键盘的相关代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-06-06
  • Flutter Dio 简单封装demo

    Flutter Dio 简单封装demo

    这篇文章主要为大家介绍了Flutter Dio简单封装示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-07-07

最新评论