Progress bar inside alert dialog containing webview

Question

I have created an activity in which, on clicking a particular button, an alert dialog will open containing a WebView .

Everything is working fine, except when the url of the WebView is getting loaded. While loading the content of the WebView, the alert dialog's tile and button is shown, which looks a bit weird.

This is the screenshot of the alert dialog while loading the webpage for the webview inside it:

After successfully loading the content of the webview, it looks like this :

What I want is while loading the webview's content, a progress bar will be shown or a fixed background image will be show. How to achieve that?

The method which I am using to create this alert is :

//method to zoom images

public void zoomImage(String imageUrl)
{
    AlertDialog.Builder alert = new AlertDialog.Builder(this);
    alert.setTitle("Zoomed Image");
    WebView wv = new WebView(this);
    wv.setBackgroundColor(Color.WHITE);
    wv.getSettings().setBuiltInZoomControls(true);
    wv.setInitialScale(400);
    wv.loadUrl(imageUrl);
    wv.setWebViewClient(new WebViewClient()
    {
    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url)
    {
      view.loadUrl(url);
      return true;
    }
  });
alert.setView(wv);
alert.setNegativeButton("Close", new DialogInterface.OnClickListener()
{
@Override
public void onClick(DialogInterface dialog, int id)
{
}
});
alert.show();
}

Thanks in advance!

Answer 1

You can take a progress bar in your alert dialog custom layout, and make the visibility gone in the OnPageFinishedMethod.

you can create your custom alert dialog like this:

        LayoutInflater inflater = getLayoutInflater();
        View dialoglayout = inflater.inflate(R.layout.big_east, (ViewGroup) getCurrentFocus());
        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setView(dialoglayout);

    builder.setTitle("Zoomed Image");

and you should override two methods just like "shouldOverrideUrlLoading". Methods are "OnPageStart" and "OnPageFinished".

In OnPageStart show the dialog and in OnPageFinish make the progress bar gone. Hope it helps.

Answer 2

You can use a WebView.PictureListener (it is deprecated, but still works. Not sure if there is a usable alternative for it):

wv.setPictureListener(new WebView.PictureListener() {
    @Override
    public void newPicture(WebView view, Picture arg1) {
        alert.show();
    }
}