CODEWITHSUNDEEP
javaandroidandroid-studiowebviewpull-to-refresh
Hessel
Hessel

Reputation: 445

Adding pull to refresh on webview for refreshing

I will add pull to refresh on my webview so it refresh my webview. i have seen all questions on this page but i can't find the good way to add pull to refresh...

Mainactivity.java

package com.vvhvb.hesselfeenstra.vvheerenveenseboys;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {

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

        String url ="http://heerenveenseboys.nl/";
        WebView view=(WebView) this.findViewById(R.id.webView);
        view.getSettings().setJavaScriptEnabled(true);
        view.getSettings().setBuiltInZoomControls(true);
        view.getSettings().setDisplayZoomControls(false);
        view.setWebViewClient(new WebViewClient());
        view.loadUrl(url);

    }

}

content_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.vvhvb.hesselfeenstra.vvheerenveenseboys.MainActivity"
    tools:showIn="@layout/activity_main">

    <WebView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/webView"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />
</RelativeLayout>

I hope anyone can help me and solve this problem for me.

Upvotes: 31

Views: 61947

Answers (8)

Prajwal Waingankar
Prajwal Waingankar

Reputation: 2710

Here is my part of the code that was useful for me. It handles two issues:

  1. When user has scrolled within the webview and than user again tries to scroll up than the screen was getting refreshed. However, adding the code within onStart() and onStop() handles this where it checks if user has scrolled within the webview than it disables the refresh part.

  2. Calling onPageFinished() using the WebViewClient() disables the refresh icon else it goes under forever refresh loop.

    webView = findViewById(R.id.webview);
mySwipeRefreshLayout = (SwipeRefreshLayout)this.findViewById(R.id.swipeContainer);

webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setDisplayZoomControls(true);
webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        mySwipeRefreshLayout.setRefreshing(false);
    }
});
webView.loadUrl("https://www.enter your url here");

mySwipeRefreshLayout.setOnRefreshListener(
        new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                webView.reload();
            }
        });


      }

  @Override
     protected void onStart() {
      super.onStart();

   mySwipeRefreshLayout.getViewTreeObserver()
      .addOnScrollChangedListener(mOnScrollChangedListener =
        new ViewTreeObserver.OnScrollChangedListener() {
            @Override
            public void onScrollChanged() {
                if (webView.getScrollY() == 0)
                    mySwipeRefreshLayout.setEnabled(true);
                else
                    mySwipeRefreshLayout.setEnabled(false);

            }
        });
         }


    @Override
     protected void onStop() {
       super.onStop();
          mySwipeRefreshLayout.getViewTreeObserver()
    .removeOnScrollChangedListener(mOnScrollChangedListener);
      }

Upvotes: 0

Jimmy Michael
Jimmy Michael

Reputation: 1

During my research, I found out that there are three easy ways that you can implement pull to refresh in your Android application:

  • You can use a third-party library / SDKs OR
  • You can use your custom implementation (like with code snippets mentioned here). This option is more complicated but provides greater flexibility for customization OR
  • In Android WebViewGold, within Config.java, just turn ENABLE__PULL_REFRESH to true

Happy scrolling!

Upvotes: 0

Bhavsar1311
Bhavsar1311

Reputation: 773

activity_main.xml

<android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeContainer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
<WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"
        android:layout_marginTop="0dp"
        android:layout_marginLeft="0dp"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:layout_marginRight="0dp"
        android:layout_marginBottom="0dp"
        app:layout_constraintBottom_toBottomOf="parent"/>
</android.support.v4.widget.SwipeRefreshLayout>

For Kotllin:

MainActivity.kt

var mySwipeRefreshLayout: SwipeRefreshLayout? = null
var myWebView: WebView? = null
mySwipeRefreshLayout = findViewById<SwipeRefreshLayout>(R.id.swipeContainer)

    mySwipeRefreshLayout?.setOnRefreshListener {
        Log.i("on refresh", "onRefresh called from SwipeRefreshLayout")

        // This method performs the actual data-refresh operation.
        // The method calls setRefreshing(false) when it's finished.
        myWebView?.reload();
    }
myWebView!!.webViewClient = object : WebViewClient() {
        override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean {
            view?.loadUrl("http://www.google.com")
            return false;
        }

        override fun onPageFinished(view: WebView?, url: String?) {
            mySwipeRefreshLayout?.isRefreshing = false
        }
    }

Upvotes: 2

Rahul Suresh
Rahul Suresh

Reputation: 184

This should work perfectly! In your layout file, wrap the webview in a SwipeRefreshLayout.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeContainer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
    >
    <WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:id="@+id/webView"
       />
    </android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>

In your Java file, declare SwipeRefreshLayout mySwipeRefreshLayout; outside the class. Then, add this to the onCreate() method

    mySwipeRefreshLayout = (SwipeRefreshLayout)this.findViewById(R.id.swipeContainer);

        mySwipeRefreshLayout.setOnRefreshListener(
                        new SwipeRefreshLayout.OnRefreshListener() {
                            @Override
                            public void onRefresh() {
                                    mWebview.reload();
        mWebview.getSettings().setCacheMode(WebSettings.LOAD_DEFAULT);
// This is important as it forces webview to load from the instead of reloading from cache

        mWebview .loadUrl(getString(R.string.app_link));

                            }
                        }
                );

Upvotes: 1

Mihuilk
Mihuilk

Reputation: 2011

I think the best solution is to use SwipeRefreshLayout but without NestedScrollView inside it as jitinsharma described, beacause this possible problem : webview height grows indefinitely inside a nestedScrollView.But there is another solution for scrolling problem as described by vizZ,to implement ViewTreeObserver.OnScrollChangedListener.So working solution shold be something like this:

<android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeContainer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <RelativeLayout
            android:id="@+id/nonVideoLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:windowSoftInputMode="adjustResize">

            <WebView
                android:id="@+id/main_web_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginTop="5dp"
                android:windowSoftInputMode="adjustResize"
                app:layout_constraintDimensionRatio="1" />

        </RelativeLayout>


    </android.support.v4.widget.SwipeRefreshLayout>

Activity parameters:

private WebView mWebView;
private SwipeRefreshLayout mySwipeRefreshLayout;
private ViewTreeObserver.OnScrollChangedListener mOnScrollChangedListener;

on Activity onCreate:

mWebView = (WebView) findViewById(R.id.main_web_view);
mySwipeRefreshLayout = (SwipeRefreshLayout)this.findViewById(R.id.swipeContainer);

        mySwipeRefreshLayout.setOnRefreshListener(
                new SwipeRefreshLayout.OnRefreshListener() {
                    @Override
                    public void onRefresh() {
                        mWebView.reload();
                    }
                }
        );

and implements of activity:implements AdvancedWebView.Listener

on Activity onStop : 

mySwipeRefreshLayout.getViewTreeObserver().removeOnScrollChangedListener(mOnScrollChangedListener);

and Activity onStart:

 mySwipeRefreshLayout.getViewTreeObserver().addOnScrollChangedListener(mOnScrollChangedListener =
                new ViewTreeObserver.OnScrollChangedListener() {
                    @Override
                    public void onScrollChanged() {
                        if (mWebView.getScrollY() == 0)
                            mySwipeRefreshLayout.setEnabled(true);
                        else
                            mySwipeRefreshLayout.setEnabled(false);

                    }
                });

Upvotes: 21

jitinsharma
jitinsharma

Reputation: 1466

You could wrap webview in Swipe refesh layout like this

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="com.vvhvb.hesselfeenstra.vvheerenveenseboys.MainActivity"
tools:showIn="@layout/activity_main">

<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/swipeContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <WebView
        android:id="@+id/webView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true" />

</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
</RelativeLayout>

In java

package com.vvhvb.hesselfeenstra.vvheerenveenseboys;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends AppCompatActivity {
WebView view;
SwipeRefreshLayout mySwipeRefreshLayout;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    mySwipeRefreshLayout = (SwipeRefreshLayout)this.findViewById(R.id.swipeContainer);
    String url ="http://heerenveenseboys.nl/";
    view=(WebView) this.findViewById(R.id.webView);
    view.getSettings().setJavaScriptEnabled(true);
    view.getSettings().setBuiltInZoomControls(true);
    view.getSettings().setDisplayZoomControls(false);
    view.setWebViewClient(new WebViewClient());
    view.loadUrl(url);

    mySwipeRefreshLayout.setOnRefreshListener(
    new SwipeRefreshLayout.OnRefreshListener() {
    @Override
    public void onRefresh() {
        view.reload();
    }
    }
    );

}

}

Upvotes: 45

Vaibhav
Vaibhav

Reputation: 991

https://developer.android.com/training/swipe/add-swipe-interface.html

You can use the Swipe-to-Refresh Layout, it is easy to use and takes care of the refresh animation for you.

You can add an OnRefreshListener to refresh your webview

Upvotes: 0

Yash Jain
Yash Jain

Reputation: 374

Try This if you want to just pull to refresh

    ll = (LinearLayout)findViewById(R.id.CategorySelect_lLayout_noID);
ll.setOnTouchListener(new OnTouchListener() {

    public boolean onTouch(View v, MotionEvent event) {

        if(event.getAction() == MotionEvent.ACTION_DOWN){
            Toast.makeText(CategorySelect.this, "action DOWN called", Toast.LENGTH_SHORT).show();
            return true;
        } 

        return false;
    }
});
    return true;
}

Or if you want an icon or something like chrome

https://github.com/liaohuqiu/android-Ultra-Pull-To-Refresh

Upvotes: 0

Related Questions