How to Create Transparent Progress Dialog or Loader for WebView in android

Spool-Reel Progress Dialog in WebView

Step-1:

At values -> styles.xml

<style name="TransparentProgressDialogWithPngImage" 
parent="@android:Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">@android:color/transparent</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowTitleStyle">@null</item>
        <item   name="android:windowAnimationStyle">  @android:style/Animation.Dialog</item>
        <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
        <item name="android:backgroundDimEnabled">true</item>
        <item name="android:background">@android:color/transparent</item>
   
 </style>

& colors.xml

<resources>

    <color name="transparent">#00000000</color>

</resources>

Step-2: 

At drawable-hdpi:

load_spool

load_reel

                       

 At Layout:

remove_border_pdialog.xml 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/load_reel"
android:gravity="center"
android:orientation="vertical" >

<ProgressBar
    android:id="@+id/progressBar1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:background="@android:color/transparent"
    android:indeterminateDrawable="@drawable/my_progress_indeterminate" />

</LinearLayout>

At  drawable ->my_progress_indeterminate.xml 

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
  
    android:drawable="@drawable/load_spool"
    android:pivotX="50%"
    android:pivotY="50%"
    android:fromDegrees="0"
    android:toDegrees="2160">
</rotate>

Now At YourWebView.Java

   private Dialog pDialog;
      WebView webView ;

   public void onPageStarted(WebView webView, String url, Bitmap favicon) {
             
              if(pDialog==null)
                {
                    pDialog = new Dialog(ComingSoonActivity.this,
                            R.style.TransparentProgressDialogWithPngImage);
                    View mn = LayoutInflater.from(YourWebView.this)
                            .inflate(R.layout.remove_border_pdialog, null);
                    pDialog.getWindow().setBackgroundDrawableResource(
                            R.color.transparent);
                    pDialog.setContentView(mn);
                    // Custom position Of image Loader
                     WindowManager.LayoutParams wmlp =
                      pDialog.getWindow().getAttributes(); int height =
                      getResources().getDisplayMetrics().heightPixels; wmlp.y =
                      height/4; pDialog.getWindow().setAttributes(wmlp);
                      // End Custom position Of image Loader
                    pDialog.setCancelable(false);
                    pDialog.show();
               
                   
                   
                }
          }


        @Override
        public void onPageFinished(WebView view, String url) {
                       super.onPageFinished(view, url);
            try {

                   if (pDialog.isShowing()) {

                    pDialog.dismiss();

                    pDialog= null;

                                          }
                         } catch (Exception exception) {
                exception.printStackTrace();
            }
           
        } 

//For WebView Page Link Loader

        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
           
           
            if(pDialog==null)
            {
                pDialog= new Dialog(YourWebView.this,
                        R.style.TransparentProgressDialogWithPngImage);
                View mn = LayoutInflater.from(ComingSoonActivity.this)
                        .inflate(R.layout.remove_border_pdialog, null);
                pDialog.getWindow().setBackgroundDrawableResource(
                        R.color.transparent);
                pDialog.setContentView(mn);
               
                pDialog.setCancelable(false);
                pDialog.show();
               
            }
            //eg.Declare Sting url="http://google.com";
            webView.loadUrl(url);
            return true;
           
        }

// In Case Of Fragment instead of Activity

//declare 

Context context ;

and Override the method->

@Override
    public void onActivityCreated(Bundle savedInstanceState) {
      
        super.onActivityCreated(savedInstanceState);
        context=this.getActivity();
    }

//After That, Replace YourWebView.this with context

To Get: