Android Pull/Swipe to Refresh RecyclerView

Hai sobat, pada artikel sebelumnya yang berjudul Mengirim JSON Object ke Activity lain Menggunakan Intent, telah ditunjukkan bagaimana cara untuk menngirim json objek ke lain activity menggunakan intent putExtra. Dan untuk artikel kali ini, akan ditunjukkan cara membuat refresh pull down, di mana nantinya akan muncul jika kita menscroll ke bawah dan data akan muncul atau diperbarui.

SwipeRefreshLayout adalah widget yang telah disupport di dalam library android seupport v4. Widget ini mungkin telah menjadi standar untuk membuat fungsi refresh pada Android. Dengan adanya widget ini, opengguna akan dimudahkan unutk merefresh sebuah data dalam aplikasi android dengan menggulir atau menscroll ke bawah tanpa harum menekan tombol refresh.

Penggunaannya dengan memasangnya menjadi parent pada layout android, sehingga nantinya akan merefresh child view yang ada di dalamnya. Unutk tutorial ini saya menggunakan aplikasi pada artikle sebelumnya yang berjudul Tutorial Android dengan Retrofit HTTP Library. Widget SwipeRefreshLayout akan saya pasang pada MainActivity untuk menyegarkan halaman utama aplikasi. Lebih jelasnya bisa sobat ikuti langkah-lnagkah berikut ini

Pertama sobat buka project aplikasi sebelumnya, lalu buka activity_main.xml dan tambahkan widget SwipeRefreshLayout seperti berikut ini

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.blogsetyaaji.retrofithttplibrary.MainActivity">

    <android.support.v4.widget.SwipeRefreshLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/swipeRefresh">

    <android.support.v7.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/movie_recycler"/>

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

Setelah menambahkan widget pada layout, selanjutnya sobat tambahkan kode perintah SwipeResfreshLayout di dalam method onCreate di MainActivity.java seperti berikut ini

/*menambah warna pada SwipeRefreshLayout*/
        final SwipeRefreshLayout dorefresh = (SwipeRefreshLayout)findViewById(R.id.swipeRefresh);
        dorefresh.setColorSchemeResources(android.R.color.holo_blue_bright,
                android.R.color.holo_green_light,
                android.R.color.holo_orange_light,
                android.R.color.holo_red_light);

        /*event ketika widget dijalankan*/
        dorefresh.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener(){
            @Override
            public void onRefresh() {
                refreshItem();
            }

            void refreshItem() {
                tampilData();
                onItemLoad();
            }

            void onItemLoad() {
                dorefresh.setRefreshing(false);
            }

        });

Maka kode lengkap dalam MainActivity.java akan nampak seperti berikut ini

package com.blogsetyaaji.retrofithttplibrary;

import android.content.Context;
import android.content.Intent;
import android.support.v4.widget.SwipeRefreshLayout;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.util.Log;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;

import com.blogsetyaaji.retrofithttplibrary.Adapter.MoviesAdapter;
import com.blogsetyaaji.retrofithttplibrary.Model.Movie;
import com.blogsetyaaji.retrofithttplibrary.Model.MovieResponse;
import com.blogsetyaaji.retrofithttplibrary.Rest.ApiClient;
import com.blogsetyaaji.retrofithttplibrary.Rest.ApiInterface;

import java.util.List;

import retrofit2.Call;
import retrofit2.Callback;
import retrofit2.Response;

public class MainActivity extends AppCompatActivity {

    private static final String TAG = MainActivity.class.getSimpleName();

    // TODO - insert your themoviedb.org API KEY here
    private final static String API_KEY = "e5013e88aad0bad4821bdac93d1d6a30";

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

        if (API_KEY.isEmpty()) {
            Toast.makeText(getApplicationContext(), "Please obtain your API KEY first from themoviedb.org", Toast.LENGTH_LONG).show();
            return;
        }


        tampilData();

        /*menambah warna pada SwipeRefreshLayout*/
        final SwipeRefreshLayout dorefresh = (SwipeRefreshLayout)findViewById(R.id.swipeRefresh);
        dorefresh.setColorSchemeResources(android.R.color.holo_blue_bright,
                android.R.color.holo_green_light,
                android.R.color.holo_orange_light,
                android.R.color.holo_red_light);

        /*event ketika widget dijalankan*/
        dorefresh.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener(){
            @Override
            public void onRefresh() {
                refreshItem();
            }

            void refreshItem() {
                tampilData();
                onItemLoad();
            }

            void onItemLoad() {
                dorefresh.setRefreshing(false);
            }

        });

    }

    private void tampilData() {
        final RecyclerView recyclerView = (RecyclerView) findViewById(R.id.movie_recycler);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));

        ApiInterface apiService =
                ApiClient.getClient().create(ApiInterface.class);

        Call<MovieResponse> call = apiService.getTopRatedMovies(API_KEY);
        call.enqueue(new Callback<MovieResponse>() {
            @Override
            public void onResponse(Call<MovieResponse>call, Response<MovieResponse> response) {
                final List<Movie> movies = response.body().getResults();
                Log.d(TAG, "Number of movies received: " + movies.size());
                Toast.makeText(MainActivity.this, "Number of movies received: " + movies.size(), Toast.LENGTH_LONG).show();
                recyclerView.setAdapter(new MoviesAdapter(movies, R.layout.list_item_movie, getApplicationContext()));

                /*perintah klik recyclerview*/
                recyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
                    GestureDetector gestureDetector = new GestureDetector(getApplicationContext(), new GestureDetector.SimpleOnGestureListener() {

                        public boolean onSingleTapUp(MotionEvent e){
                            return true;
                        }
                    });

                    @Override
                    public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {
                        View child = rv.findChildViewUnder(e.getX(), e.getY());
                        if (child != null && gestureDetector.onTouchEvent(e)){
                            int position = rv.getChildAdapterPosition(child);
                            Toast.makeText(getApplicationContext(), "Id : " + movies.get(position).getId() + " selected", Toast.LENGTH_SHORT).show();

                            Intent i = new Intent(MainActivity.this, DetailActivity.class);
                            i.putExtra("title", movies.get(position).getTitle());
                            i.putExtra("date", movies.get(position).getReleaseDate());
                            i.putExtra("vote", movies.get(position).getVoteAverage().toString());
                            i.putExtra("overview", movies.get(position).getOverview());
                            i.putExtra("bg", movies.get(position).getPosterPath());
                            MainActivity.this.startActivity(i);

                        }
                        return false;
                    }

                    @Override
                    public void onTouchEvent(RecyclerView rv, MotionEvent e) {

                    }

                    @Override
                    public void onRequestDisallowInterceptTouchEvent(boolean disallowIntercept) {

                    }
                });
            }

            @Override
            public void onFailure(Call<MovieResponse>call, Throwable t) {
                // Log error here since request failed
                Log.e(TAG, t.toString());
            }
        });
    }
}

Dalam kode tersebut, widget SwipeRefreshLayot dapat diberi lebih dari satu warna sesuai keinginan kita agar tampilnaya lebih menarik atau warnanya akan berubah-ubah ketika refresh berjalan. Setelah itu di dalam kode tersebut, fungsi untuk menampilkan data dimasukkan di dalam event SwipeRefreshLayout setOnRefreshListener, sehingga jika widget di jalankan, fungsi menampilkan data akan dijalankan. Untuk tampilanya akan jadi seperti gembar di bawah ini

SIlahkan jika sobat ingin melihat hasil projectnya di github saya

Follow @AjiSetya Watch Star
Sangat mudah sekali menambahkan widget SwipeRefreshLayout di dalma aplikasi android. Dan sekian artikle dari saya tentang menambahkan widget SwipeRefreshLayout di android, semoga bermanfaat dan membantu.