Show activity circle before loading webview - Android

Question

I am using webview to show a webpage in my app. The webpage takes about 2-3 seconds to load. Till the webpage loads, I want to show an activity circle progress bar like the one shown here.
This is what an activity circle looks like :

How can I accomplish it?

I searched the web but couldn't find a satisfactory and proper explanation of how it is implemented. Thanks!

WebViewPage.java

public class Webpage extends Activity {

WebView web;
ProgressBar progressBar;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.web_page);

    Intent startwebpage = getIntent();

    web = (WebView) findViewById(R.id.webView);
    web.setWebViewClient(new myWebClient());

    web.getSettings().setJavaScriptEnabled(true);
    web.loadUrl("http://www.google.com");
}

public class myWebClient extends WebViewClient
{
    @Override
    public void onPageStarted(WebView view, String url, Bitmap favicon) {
        // TODO Auto-generated method stub
        super.onPageStarted(view, url, favicon);
    }

    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        // TODO Auto-generated method stub

        view.loadUrl(url);
        return true;

    }

    @Override
    public void onPageFinished(WebView view, String url) {
        // TODO Auto-generated method stub
        super.onPageFinished(view, url);
    }
}
}

don't call view.loadUrl from shouldOverrideUrlLoading. If you do pages like this: http://jsbin.com/gupug/1/quiet will break your app. — marcin.kosiba, Mar 12 '14 at 15:39

Ritesh Gune · Answer 1 · 2014-03-01T15:42:20.247

Display progressBar in onPageStarted method and dismiss it in onPageFinished.

    private ProgressDialog progressBar;

Show progressBar in onPageStarted:

@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
    // TODO Auto-generated method stub
    super.onPageStarted(view, url, favicon);

     // prepare for a progress bar dialog
        progressBar = new ProgressDialog(v.getContext());
        progressBar.setCancelable(true);
        progress.setProgressStyle(ProgressDialog.STYLE_SPINNER);            
        progressBar.show();
}

2.Dismiss it in onPageFinished:

    @Override
    public void onPageFinished(WebView view, String url) {
        // TODO Auto-generated method stub
        super.onPageFinished(view, url);

        progressBar.dismiss();
    }

EDIT : Use ProgressBar instead of ProgressDialog.

Use Following code in your layout. Use drawable of your choice for "@drawable/progress"

 <ProgressBar
    android:id="@+id/progress_bar"
    style="?android:attr/progressBarStyleLarge"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:visibility="gone"
    android:indeterminateDrawable="@drawable/progress" >
</ProgressBar>

Inflate it in your activity. Make it visible in onPageStarted and gone in onPageFinished.

private ProgressBar prgrsBar;

@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
    // TODO Auto-generated method stub
    super.onPageStarted(view, url, favicon);

    prgrsBar.setVisibility(View.VISIBLE);
}

 @Override
public void onPageFinished(WebView view, String url) {
    // TODO Auto-generated method stub
    super.onPageFinished(view, url);

    prgrsBar.setVisibility(View.GONE);
}

I think you got my question wrong! I don't want to show a dialog. I want to show an animating activity circle like the one shown in my question. — Chinmay Dabke, Mar 01 '14 at 15:26
ok, in that case I would suggest you to use Progress bar instead of ProgressDialog. Check edited answer — Ritesh Gune, Mar 01 '14 at 15:42

score 0 · Answer 2 · edited Dec 05 '15 at 19:52

This works for me: ProgressDialog pb = null;

        public void onPageStarted(WebView view, String url, Bitmap favicon) {
            // TODO Auto-generated method stub
            super.onPageStarted(view, url, favicon);

            // prepare for a progress bar dialog
            if (pb == null) {
                pb = new ProgressDialog(Quiz.this);
                pb.setCancelable(true);
                pb.setProgressStyle(ProgressDialog.STYLE_SPINNER);
                pb.show();
            }
        }

        public void onPageFinished(WebView view, String url) {
            // TODO Auto-generated method stub
            super.onPageFinished(view, url);

            pb.dismiss();
        }

Show activity circle before loading webview - Android

2 Answers2

Linked