How to use SwipeRefreshLayout the right way

Public on March 14, 2016
In the latest revision of the android support library came out with an interesting new layout :SwipeRefreshLayout which implements the famous pull-down-to-refresh pattern. In the following i will show you how to implement it with a ListView and avoid some pitfalls.
To use this new layout you will need to have at least the android support library with at least revision 19.1
First we need to import the support library project to our workspace and then add it to your main project as a library.

Then we will start by defining our SwipeToRefresh container
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/swipe_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
     
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <ListView android:id="@id/android:list"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:drawSelectorOnTop="false"/>
    </LinearLayout>
</android.support.v4.widget.SwipeRefreshLayout>
and then in our activity or fragment we load the layout and set it up
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
private SwipeRefreshLayout swipeRefreshLayout;
private Handler handler = new Handler();
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, getCountries());
    ListView listView = (ListView) findViewById(R.id.listView);
    listView.setAdapter(adapter);
    // find the layout
    swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_container);
    // the refresh listner. this would be called when the layout is pulled down
    swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
         
        @Override
        public void onRefresh() {
            // get the new data from you data source
            // TODO : request data here
            // our swipeRefreshLayout needs to be notified when the data is returned in order for it to stop the animation
            handler.post(refreshing);
        }
    });
    // sets the colors used in the refresh animation
    swipeRefreshLayout.setColorSchemeResources(R.color.blue_bright, R.color.green_light,
            R.color.orange_light, R.color.red_light);
}
private final Runnable refreshing = new Runnable(){
    public void run(){
        try {
            // TODO : isRefreshing should be attached to your data request status
            if(isRefreshing()){
                // re run the verification after 1 second
                handler.postDelayed(this, 1000);  
            }else{
                // stop the animation after the data is fully loaded
                swipeRefreshLayout.setRefreshing(false);
                // TODO : update your list with the new data
            }
        }
        catch (Exception e) {
            e.printStackTrace();
        }  
    }
};
For now if you try to swipe down to refresh your will be able to see the animation and your list would be updated. However, if scroll down in your list and try to go up again the swipe to refresh would be triggered again and you won’t be able to go back to the top of your list.
Obviously, this would be very annoying and the trick would be forcing the layout to refresh only when the very first item of the list is fully visible. To do this we assign anOnScrollListener to our ListView after the initialization of our swipe to refresh layout
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
listView.setOnScrollListener(new OnScrollListener() {
     
    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
    }
     
    @Override
    public void onScroll(AbsListView view, int firstVisibleItem,
            int visibleItemCount, int totalItemCount) {
        boolean enable = false;
        if(listView != null && listView.getChildCount() > 0){
            // check if the first item of the list is visible
            boolean firstItemVisible = listView.getFirstVisiblePosition() == 0;
            // check if the top of the first item is visible
            boolean topOfFirstItemVisible = listView.getChildAt(0).getTop() == 0;
            // enabling or disabling the refresh layout
            enable = firstItemVisible && topOfFirstItemVisible;
        }
        swipeRefreshLayout.setEnabled(enable);
    }
});
Now you are good to go!
from : https://yassirh.com




[Advertising]Faster Thinking - Speed up your brain


Faster Thinking Game



sentiment_satisfied Emoticon