Android adds a page load progress bar example detail

  • 2021-01-06 00:43:25
  • OfStack

Recommended reading: Android WebView Linear progress bar example details

Recently, in the android project, we used webview to nested a raffle campaign page, and the campaign went live and worked well (changed N secondary requirements and sudden bug). Fortunately, the campaign in this mode only needs to modify the page, and does not need to repackage the release market, which is also one of the advantages of this mode development. Later, according to the feedback of the product brother, there was no progress prompt when loading the web page. Well, I really didn't consider so much at that time. This one should be added. Take it for granted that it is easy to get.... It's actually a little more complicated than easy...

1. First, a custom WebView control

*  With a progress bar Webivew
* @author
public class ProgressWebView extends WebView {
private final static String TAG = ProgressWebView.class.getSimpleName();
private ProgressBar progressBar;
private Context context;
public ProgressWebView(Context context, AttributeSet attrs) {
super(context, attrs);
this.context = context;
progressBar = new ProgressBar(context, null, android.R.attr.progressBarStyleHorizontal);
progressBar.setLayoutParams(new AbsoluteLayout.LayoutParams(AbsoluteLayout.LayoutParams.MATCH_PARENT, , , ));
setWebChromeClient(new WebChromeClient());
public class WebChromeClient extends android.webkit.WebChromeClient {
public void onProgressChanged(WebView view, int newProgress) {
Log.d(TAG, "newProgress" + newProgress);
if (newProgress == ) {
} else {
if (progressBar.getVisibility() == GONE)
super.onProgressChanged(view, newProgress);
//  To deal with javascript In the console.log
public boolean onConsoleMessage(ConsoleMessage cm){
android.util.Log.d(TAG, "webview console " + cm.lineNumber() + " of " + cm.sourceId() + " : " + cm.message());
return true;
//  To deal with javascript In the alert()
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
ToastUtil.showMessage(context, message, Toast.LENGTH_SHORT, Gravity.CENTER);
return true;
protected void onScrollChanged(int l, int t, int oldl, int oldt) {
LayoutParams lp = (LayoutParams) progressBar.getLayoutParams();
lp.x = l;
lp.y = t;
super.onScrollChanged(l, t, oldl, oldt);

2. Introduce this control in layout files where webview is required

android:layout_height="match_parent" /> 

3. Add an drawable file and modify the style of the progress bar controlled by progress

<?xml version="." encoding="utf-"?>
<layer-list xmlns:android="" >
<!--  background  -->
<item android:id="@android:id/background">
<solid android:color="@color/default_bg" />
<!--  The progress bar  -->
<item android:id="@android:id/progress">
<solid android:color="#EAE" />

4. Code for using this control in activity or fragment

ProgressWebView webView = (ProgressWebView)findViewById(;
webView.setDownloadListener(new DownloadListener() {
public void onDownloadStart(String url, String userAgent, String contentDisposition, String mimetype, long contentLength) {
if (url != null && url.startsWith("http://"))
startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse(url)));
webView.loadUrl(" Web page url");

Through the above code to achieve Webview to add the relevant functions of the page loading progress bar, I hope to help you.

Related articles: