Tuesday, 1 August 2017

Android Tutorial Membuat Swipe Untuk Refresh

Di design UI (User Interface) saat ini banyak dijumpai cara untuk merefresh suatu page dengan cara swipe dibawah atau geser kebawah.

Dengan kita menggeser atau mengusap layar kebawah maka akan ada sebuah view loading yang muncul untuk melakukan refresh data.


Biasanya proses ini diperlukan di suatu page untuk proses pembaharuan data atau reload ulang page atau bisa juga sebagai pertanda loading ketika data masih di panggila dari API.

Baca juga : Menampilkan Data Di Android (Retrofit 2.0 GET) Dari Server PHP + MySQL 

Pada android view ini dinamakan SwipeRefreshLayout. Sebuah view yang tersedia dari material design Goole. Jika sudah di implement di aplikasi, kira-kira tampilannya seperti gambar dibawah ini :

Swipe Refresh

Untuk memunculkan tampilan seperti gambar diatas, ikuti langkah-langkah dibawah ini :

Compile library


Compile library support untuk mendapatkan material design yang terbaru. ( Kalian bisa gunakan versi terbarunya)

Jika saat membuat project di Android studio library support sudah ada, maka tidak perlu lagi ditambahkan di gradlenya.

Layout


Pada bagian layout kita tempatkan kontent/view yang ingin berubah datanya ketika proses refresh berhasil. Seperti pada contoh activity_main.xml dibawah ini

Dapat kita lihat TextView untuk men-set nama ada didalam SwipeRefreshLayout. Kalian bisa sesuai view didalam SwipeRefreshLayout sesuai dengan kebutuhan kalian.

File Java


Pada class java dibuat proses bagaimana cara melakukan refresh layout dan apa yang harus dilakukan ketika sudah berhasil melakukan refresh. Proses tersebut akan di contohkan pada class MainActivity.java dibawah ini

Seperti yang dapat kita lihat, pada saat membuat class di java yang didalamnya akan mengimplementasikan SwipeRefreshLayout, kalian harus melakukan implements SwipeRefreshLayout.OnRefreshListener. Setelah itu override method bawaannya yaitu onRefresh()

Baca juga : Membuat Desain Form Register, Validasi dan Re-type Password di Android  

Lakukan dan susuaikan method/view seperti yang kalian inginkan di project kalian, artikel diatas hanya contoh bagaimana cara membuat Swipe Refresh Layout.

Sekian tutorial kali ini, terima kasih.

Please post a polite comment and do not post a spam
EmoticonEmoticon