general patter for custom loader animation

fragment_metric_detail.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:background="@color/white"
    android:layout_height="match_parent"
    android:paddingTop="42dp"
    tools:context="com.samsungaccelerator.maslow.ui.fragments.MetricDetailFragment">

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

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        android:id="@+id/progress_bar"
        android:largeHeap="true"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"/>

</RelativeLayout>

knowl_loader.xml

<?xml version="1.0" encoding="utf-8"?>

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/frame_1" android:duration="45" />
    <item android:drawable="@drawable/frame_2" android:duration="45" />
    <item android:drawable="@drawable/frame_3" android:duration="45" />
    <item android:drawable="@drawable/frame_4" android:duration="45" />
    <item android:drawable="@drawable/frame_5" android:duration="45" />
    <item android:drawable="@drawable/frame_6" android:duration="45" />
    <item android:drawable="@drawable/frame_7" android:duration="45" />
    <item android:drawable="@drawable/frame_8" android:duration="45" />
    <item android:drawable="@drawable/frame_9" android:duration="45" />
    <item android:drawable="@drawable/frame_10" android:duration="45" />
    <item android:drawable="@drawable/frame_11" android:duration="45" />
    <item android:drawable="@drawable/frame_12" android:duration="45" />
    <item android:drawable="@drawable/frame_13" android:duration="45" />
    <item android:drawable="@drawable/frame_14" android:duration="45" />
    <item android:drawable="@drawable/frame_15" android:duration="45" />
    <item android:drawable="@drawable/frame_16" android:duration="45" />
    <item android:drawable="@drawable/frame_17" android:duration="45" />
    <item android:drawable="@drawable/frame_18" android:duration="45" />
    <item android:drawable="@drawable/frame_19" android:duration="45" />
    <item android:drawable="@drawable/frame_20" android:duration="45" />
    <item android:drawable="@drawable/frame_21" android:duration="45" />
    <item android:drawable="@drawable/frame_22" android:duration="45" />
    <item android:drawable="@drawable/frame_23" android:duration="45" />
    <item android:drawable="@drawable/frame_24" android:duration="45" />
    <item android:drawable="@drawable/frame_25" android:duration="45" />
    <item android:drawable="@drawable/frame_26" android:duration="45" />
    <item android:drawable="@drawable/frame_27" android:duration="45" />
    <item android:drawable="@drawable/frame_28" android:duration="45" />
    <item android:drawable="@drawable/frame_29" android:duration="45" />

</animation-list>

MetricDetailFragment.java

    private WebView webView;

    private ImageView loaderImage;

    private AnimationDrawable frameAnimation;
        
        
        ...
        
        
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        
        
        ...
        
        
                               
        loaderImage = (ImageView) v.findViewById(R.id.progress_bar);
        loaderImage.setBackgroundResource(R.drawable.knowl_loader);
        frameAnimation = (AnimationDrawable) loaderImage.getBackground();
        
        
        
        ...
        
        
                               
        //// Configure the client to use when opening URLs
        webView.setWebViewClient(new WebViewClient() {
            @Override public void onPageStarted(WebView view, String url, Bitmap favicon) {
                super.onPageStarted(view, url, favicon);
                loaderImage.setVisibility(View.VISIBLE);
                frameAnimation.start();
            }

            @Override public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                loaderImage.setVisibility(View.INVISIBLE);
                frameAnimation.stop();
                loaderImage.clearAnimation();
            }

            @Override public void onReceivedError(WebView view,
                                                  int errorCode,
                                                  String description,
                                                  String failingUrl) {
                super.onReceivedError(view, errorCode, description, failingUrl);
                Log.e(TAG, "webview request failed");
                Log.e(TAG, String.valueOf(errorCode));
                Log.e(TAG, description);
                Log.e(TAG, failingUrl);
                loaderImage.setVisibility(View.INVISIBLE);
                frameAnimation.stop();
                loaderImage.clearAnimation();
            }
        });    
        
        
        
        ...
        
        
        
        // Important to clean up the animation in onPause() as you'll get "out of memory errors"
        // if the user clicks in and out of a the fragment multiple times. 
        @Override public void onPause() {
            super.onPause();
            frameAnimation.stop();
            loaderImage.clearAnimation();
        }
        
    }