-->

Intro Slider Keren atau opening Welcome: membuat pada Aplikasi Android

Membuat Intro Slider Keren atau Opening Welcome pada Aplikasi Android. Intro slider atau Intro selamat datang di aplikasi Anda adalah langkah terbaik untuk menampilkan fitur utama dari aplikasi Android. Tampilan sekilas ini sebagai promosi juga agar pengguna tidak merasa bingung menggunakan aplikasi kita.

Intro yang dimaksud disini yakni saat aplikasi pertama kali diluncurkan akan disuguhkan info singkat berupa gambar dan tulisan menarik. Tampilan tersebut dapatdengan mudah digerakan ke kanan dan kiri dengan menekan tombol Lanjut atau Lewati.

Pada artikel ini kita akan belajar menambahkan Intro slider ke aplikasi Android di mana pengguna dapat mengusap beberapa slide sebelum masuk ke dalam aplikasi Android.

Untuk mendemonstrasikan, saya membuat aplikasi sederhana yang berisi beberapa slide intro dengan navigasi Lanjut dan Lewati. Pengguna dapat menavigasi melalui setiap slide menggunakan gerakan mengusap layar HP atau menggunakan tombol Lanjut. Kami juga akan menjelaskan cara menunjukkan intro saat aplikasi diluncurkan untuk pertama kali.


Sebelum kita mulai tutorial membuat intro slider, sebaiknya anda melihat Demo aplikasi dan sekalian unduh file project yang sudah jadi di bawah ini:

Demo Apk

Unduh Project

Bila anda sudah mengunduh file, Mari kita segera mulai dengan membuat proyek baru.


A. Import File Project Intro Slider

1. Run software android studio anda hingga tampilan "Welcome Android Studio" selesai dimuat. Pilih "existing Android Studio project".

2. Silakan cari file project intro slider yang telah anda unduh disini kemudian tunggu hingga proses building selesai.

Apabila telah selesai, sekarang kita akan melihat satu persatu bagian yang harus anda mengerti dalam penerapan intro slider hingga berhasil di build menjadi file apk.

B. Memilih Warna

Pemilihan warna bisa anda sesuaikan dengan warna aplikasi android dan juga anda dapat merancang layar intro untuk mempertimbangkan jenis aplikasi yang sedang anda kembangkan. Dalam contoh project ini, kami menempatkan gambar besar di tengah kemudian beberapa teks di bawahnya. Di bagian dasar, terdapat jumlah titik yang menunjukkan jumlah slide yang akan ditampilkan.

Berikut adalah palet warna yang telah saya pilih untuk mendesain layar. Untuk setiap layar kita membutuhkan tiga warna yaitu warna latar belakang dan dua warna titik saat aktif / tidak aktif.

3 . Buka colors.xml yang berada di bawah nilai res ⇒ values dan tambahkan nilai warna di bawah ini. Anda dapat melihat setelah menambahkan warna, saya menyimpannya ke array array_dot_active dan array_dot_inactive , sehingga kami dapat memuatnya dengan mudah dalam aktivitas kami.

4 . Buka strings.xml yang berada di bawah nilai res ⇒ dan tambahkan nilai string di bawah ini. Disini saya sebutkan judul dan deskripsi untuk setiap slide.

5 . Buka dimens.xml yang berada di bawah nilai res ⇒ dan tambahkan nilai di bawahnya.

6 . Juga pastikan bahwa Anda memiliki gaya ini dalam styles.xml Anda karena aplikasi mogok karena perubahan terbaru pada alat pembuatan.

Slider selamat datang / intro harus ditampilkan hanya sekali saat aplikasi diluncurkan untuk pertama kalinya. Jika pengguna meluncurkan aplikasi untuk kedua kalinya, ia harus langsung masuk ke layar utama. Untuk mencapai hal ini, kami menggunakan SharedPreferences untuk menyimpan nilai boolean yang menunjukkan peluncuran pertama kali.

7 . Buka kelas bernama PrefManager.java dan lakukan perubahan. Ubah nilai isFirstTimeLaunch () menjadi true apabila anda ingin mengubah intro slider hanya ingin diluncurkan untuk pertama kalinya.

Baca juga :

C. Membuat Slides Welcome

Sekarang saatnya membuat tata letak yang diperlukan untuk slider. Secara total saya menyimpan 4 slide untuk layar intro. Jadi kita membutuhkan empat layout terpisah untuk empat slide. Tata letak setiap slide tetap sama kecuali gambar, teks dan warna. Atau Anda dapat membuat Fragmen terpisah untuk setiap slide agar memiliki kontrol lebih besar terhadap elemen UI yang ditampilkan dalam slide.

8 . Jadi cepat membuat empat xml layout bernama welcome_side1.xml , welcome_side2.xml , welcome_side3.xml dan welcome_side4.xml di bawah res ⇒ layout .
  • welcome_slide1.xml
  • welcome_slide2.xml
  • welcome_slide3.xml
  • welcome_slide4.xml

9 . Setelah tata letak sudah siap, buat aktivitas baru bernama WelcomeActivity.java untuk slider welcome. Klik kanan pada paket New ⇒ Activity ⇒ Empty Activity.

10 . Buka activity_welcome.xml dan ubah kode seperti di bawah ini. Di sini kami menambahkan ViewPager untuk slider, LinearLayout untuk titik - titik dasar dan dua tombol untuk navigasi Skip dan Next .

11 . Buka WelcomeActivity.java dan modifikasi kode seperti di bawah ini. Di sini kami telah memberikan beberapa hal:

⇒ Periksa peluncuran aplikasi dengan menggunakan metode prefManager.isFirstTimeLaunch () . Jika kembali benar, MainActivity akan diluncurkan melompati aktivitas intro.

⇒ Buat bilah notifikasi transparan, agar tampilan warna background bisa dilihat.

⇒ Dibuat PagerAdapter untuk ViewPager dan meningkat semua layout kita buat sebelumnya.

⇒ Ditambahkan klik event pendengar ke tombol Skip dan Next . Jika tombol berikutnya diklik, slide berikutnya akan ditampilkan. Jika tombol Skip diklik, aktivitas utama akan diluncurkan secara langsung.

12.Akhirnya buka AndroidManifest.xml dan buat WelcomeActivity sebagai launcher activity. Sehingga akan ditampilkan sebagai layar pertama di app.

 Jalankan aplikasi dan mainkan slider intro.

Demikian tutorial kami mengenai Membuat Intro Slider Keren Pada Aplikasi Android semoga memberi manfaat bagi anda yang sedang mengembangkan aplikasi android.

Share this with short URL:

Anda mungkin suka ini:

Use parse tool to easy get the text style on disqus comments:
Show Parser Hide Parser