Android: How can i show progress bar while loading data into WebView?
Asked Answered
G

4

4

How can I show the progress bar while loading data into my webview? My code :

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    this.requestWindowFeature(Window.FEATURE_PROGRESS);
    getWindow().setFeatureInt( Window.FEATURE_PROGRESS, Window.PROGRESS_VISIBILITY_ON); 
    this.setProgressBarVisibility(true);
    setContentView(R.layout.layout_article);
    WebView webview = (WebView) findViewById(R.id.webView);
    final Activity activity = this;
    webview.setWebChromeClient(new WebChromeClient() {
        public void onProgressChanged(WebView view, int progress) {
            activity.setProgress(progress * 100);
        }
    });

    webView.loadUrl("http://google.com");
}
Gyroscope answered 21/2, 2012 at 9:41 Comment(4)
You will need to move the uploading to a separate thread, to free up handle the main UI thread. You will also have to decide whether to show a spinner or a progress bar.Logan
Best way is that is suggested by Paresh, but you have to use WebViewClient , using this techique you don't have to take look on how much of data you have grabbed from server.Funds
I hope following link will help you : #9172010Issy
possible duplicate of Android WebView progress barWestney
G
3
public class MainActivity extends AppCompatActivity {

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

        final ProgressBar progress = (ProgressBar) findViewById(R.id.progress);

        WebView webView = (WebView) findViewById(R.id.webview);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(final WebView view, final String url) {
                return false;
            }

            @Override
            public void onPageStarted(final WebView view, final String url, final Bitmap favicon) {
                progress.setVisibility(View.VISIBLE);
                super.onPageStarted(view, url, favicon);
            }

            @Override
            public void onPageFinished(final WebView view, final String url) {
                progress.setVisibility(View.GONE);
                super.onPageFinished(view, url);
            }
        });

        webView.loadUrl("http://google.com");
    }
}

And R.layout.activity_main:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ProgressBar
        android:id="@+id/progress"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="gone"
        android:layout_centerInParent="true"/>
</RelativeLayout>
Gyroscope answered 12/3, 2016 at 16:10 Comment(0)
U
5

Before calling loadData() function, just try to show ProgressDialog or put ProgressBar inside layout.

And inside the WebViewClient, just dismiss() the progressDialog or make the ProgressBar invisible.

for example:

// when finish loading page
public void onPageFinished(WebView view, String url) {
       if(mProgress.isShowing()) {
             mProgress.dismiss();
       }
}

FYI, call loadData() or loadURL() only after you are done with web client setting.

check this example: Load WebView with ProgressDialog

Unctuous answered 21/2, 2012 at 9:46 Comment(2)
WebChromeClient class has no onPageFinished() method instead it is in WebViewClientFunds
Still YOu have written WebClient it's WebViewClient developer.android.com/reference/android/webkit/…, java.lang.String)Funds
I
3

Please try following code,

ProgressDialog progDailog = ProgressDialog.show( context,"Process ", "Loading Data...",true,true);

new Thread ( new Runnable()
{
     public void run()
     {
      // your data loading code goes here
     }
}).start();

 Handler progressHandler = new Handler() 
 {

     public void handleMessage(Message msg1) 
     {

         progDailog.dismiss();
         }
 }
Imago answered 21/2, 2012 at 9:54 Comment(0)
G
3
public class MainActivity extends AppCompatActivity {

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

        final ProgressBar progress = (ProgressBar) findViewById(R.id.progress);

        WebView webView = (WebView) findViewById(R.id.webview);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(final WebView view, final String url) {
                return false;
            }

            @Override
            public void onPageStarted(final WebView view, final String url, final Bitmap favicon) {
                progress.setVisibility(View.VISIBLE);
                super.onPageStarted(view, url, favicon);
            }

            @Override
            public void onPageFinished(final WebView view, final String url) {
                progress.setVisibility(View.GONE);
                super.onPageFinished(view, url);
            }
        });

        webView.loadUrl("http://google.com");
    }
}

And R.layout.activity_main:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ProgressBar
        android:id="@+id/progress"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="gone"
        android:layout_centerInParent="true"/>
</RelativeLayout>
Gyroscope answered 12/3, 2016 at 16:10 Comment(0)
C
0

First make custom webview class and use it on xml like this,

 <com.app.ui.views.CustomWebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >

    </com.app.ui.views.CustomWebView>

Make sure, the height should not be fixed, it should be "wrap_content"

Now make custom webview class like this,

 public class CustomWebView extends WebView {

    private ProgressBar progressBar;
    private Context context;
    private LinearLayout loaderLayout;

    public CustomWebView(Context context) {
    super(context);

    this.context = context;
    initProgressBar();

    loadUrlWithData();

}

public CustomWebView(Context context, AttributeSet attrs) {
    super(context, attrs);

    this.context = context;
    initProgressBar();

}

public CustomWebView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);

    this.context = context;

    initProgressBar();

}

private void initProgressBar() {
    progressBar = new ProgressBar(context);
    progressBar.setIndeterminate(false);

}

private void setLoading(boolean isLoading) {

  if (isLoading) {

   progressBar.setVisibility(View.VISIBLE);

   loaderLayout = new LinearLayout(context);
   loaderLayout.setGravity(Gravity.CENTER);
   loaderLayout.setOrientation(LinearLayout.HORIZONTAL);

    LinearLayout.LayoutParams parentLayoutParams = new LinearLayout.LayoutParams(
                LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.WRAP_CONTENT);
        loaderLayout.setLayoutParams(parentLayoutParams);

        LinearLayout.LayoutParams progressBarLayoutParams = new 
        LinearLayout.LayoutParams(75, 75);
        progressBar.setLayoutParams(progressBarLayoutParams);

        if (progressBar.getParent() != null) {
            ((ViewGroup) progressBar.getParent()).removeView(progressBar);
        }
        loaderLayout.addView(progressBar);

        // add this loaderLayout to your parent view in which your webview is added

        else {

           progressBar.setVisibility(View.GONE);
        }

  }

  private void loadUrlWithData(){
     setLoading(true);
     //Load your HTML data with url here

  }

 //When the content will be loaded, the webview will change it's height
 @Override
protected void onSizeChanged(int w, int h, int ow, int oh) {
    super.onSizeChanged(w, h, ow, oh);

    if (h > 400) {
        setLoading(false);
    }
}

}
Clydeclydebank answered 20/8, 2018 at 12:52 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.