Halo semuanya, pada postingan ini saya akan membagikan tutorial sederhana untuk kalian yang baru belajar membuat aplikasi android menggunakan android studio.
Pada tutorial kali ini kita akan belajar membuat Image Slider menggunakan ViewPager di android studio.
Daftar Isi
sembunyikan
Project ImageSlider
- Hal pertama yang harus kita lakukan tentu membuat project baru di android studio. Pada tutorial ini saya memberikan nama projeknya “ImageSlider”.
Menambahkan dependencies di Gradle
- Tambahkan library cardview, ripple effect, dan glide.
Update colors.xml
- Buka colors.xml kemudian tambahkan warna-warna seperti berikut.
Membuat file styles.xml, strings-data.xml, dan dimens.xml
Pada directory res>values, buatlah file-file seperti dibawah ini.
- styles.xml
- strings-data.xml
- dimens.xml
Membuat data class Image
- Data class ini berfungsi untuk menampung data.
Desain User Interface
- Buka activity_main.xml, kemudian ubah kodenya seperti berikut.
- Buat layout baru dengan nama item_image_slider.xml untuk view setiap itemnya.
Membuat PagerAdapter
- Buat PagerAdapter untuk mengatur Image Slider. Disini kita juga bisa memberikan action ketika gambar di klik.
Menyiapkan data
- Disini saya menyiapkan data dummy dalam bentuk ArrayList
Menampilkan data
- Untuk menampilkan datanya, kita hanya perlu mengirim data ke adapter dengan function setItems dan jangan lupa tambahkan notifyDataSetChanged()
Handle ViewPager
- Tambahkan listener untuk ViewPager seperti berikut.
Tambahkan Image Slider Indicator
- Tambahkan indicator untuk image slider dengan kode berikut.
Berikut kode untuk membuat shape circlenya
- shape_circle.xml
- shape_circle_outline.xml
Start Auto Slider
- Gunakan kode di bawah ini untuk menjalankan image slider secara otomatis dengan interval 3 detik.
Kode lengkap MainActivity.kt
- Berikut kode lengkap MainActivity.kt
Download kode lengkapnya disini
Terima kasih
