Mata Kuliah pemrograman mobile materi tentang fragment

mata kuliah pemrograman mobile materi tentang fragment

1. fragment Pemrograman mobile 6

2. Pendahuluan

3. Fragment adalah sebuah komponen dasar pada Android yang dapat digunakan untuk membangun antarmuka pengguna (UI) yang modular dan reusable. Fragment adalah bagian dari sebuah Activity, dan setiap Activity dapat memiliki satu atau lebih Fragment yang saling berhubungan . Activity vs Fragment Activity adalah komponen utama yang menangani tampilan UI dan logika aplikasi utama . Setiap Activity dapat memiliki satu atau beberapa Fragment yang ditambahkan untuk memperluas fungsionalitas Activity. Penggunaan fragment lebih kepada pemecahan komponen tampilan untuk menjadi fleksibel dan dapat digunakan Kembali (reusable)

4. Siklus hidup fragment Pada skema disamping menunjukkan bahwa perubahan state activity akan mempengaruhi lifecycle dari sebuah fragment. Ini dipastikan bahwa fragment merupakan komponen view yang bisa ditambahkan ke dalam activity. Activity State Fragment Callbacks

5. Karakteristik fragment Modular: Fragment memungkinkan pembuatan antarmuka pengguna menjadi lebih modular, sehingga dapat lebih mudah diorganisir , dipelihara , dan diubah . Reusable: Fragment dapat digunakan kembali pada Activity lain, sehingga dapat menghemat waktu dan usaha dalam pengembangan aplikasi . Hidup bersama Activity: Fragment hidup bersama dengan Activity yang memilikinya , sehingga memiliki siklus hidup yang mirip dengan Activity. Memiliki tampilan sendiri : Fragment memiliki tampilan sendiri seperti halnya Activity, sehingga dapat menampilkan informasi dan kontrol input/output yang diperlukan . Komunikasi antar Fragment: Fragment dalam satu Activity dapat berkomunikasi satu sama lain melalui Activity, sehingga dapat memudahkan pertukaran data antar Fragment.

6. Code lab Membuat tampilan android menggunakan fragment

7. Buatlah sebuah project baru dan beri nama Fragment Tutorial dengan konfigurasi seperti dibawah ini : Project Name : Fragment tutorial Min Level API : 15 Default activity : Empty Activity Activity name : Main activity 2. Buka activity_main.xml . Ubah parent layout menjadi Frame layout dan tambahkan id

8. 3. Buatlah sebuah fragment baru dengan cara , klik kanan pada folder java > new > Fragment > Fragment (Blank) simpan dengan nama Home Fragment 4. Pada fragment_home.xml tambahlan sebuah button untuk menampilkan sebuah dialog, jangan lupa tambahkan attribute id pada button.

9. 5. Selanjutnya buatlah 1 fragment lagi yang digunakan untuk menampilkan sebuah dialog, beri nama category fragment, lalu tambahkan kode dibawah ini pada fragment_category.xml

10. Sehingga menampilkan tampilan seperti berikut ini untuk fragment_category yang selanjutnya digunakan untuk tampilan dialog. 6. Selanjutnya buka MainActivity.java dan tambahkan kode dibawah ini didalam method onCreate :

11. 7. Selanjutnya buka file HomeFragment.java dan tambahkan kode dibawah ini Pada method onCreateView , tambahkan kode dibawah ini : Ingat !! jangan lupa untuk mengimplementasikan method onclick Ketika menggunakan interface OnclickListener

12. 8. Lalu pada method OnClick tambahkan kode dibawah ini :

13. 9. Next, buka file categoryfragment.java lalu tambahkan kode dibawah ini : Jika terjadi eror biarkan saja !!

14. 10. Pada method OnCreateView tambahkan kode dibawah ini :

15. 11. Last, tambahkan kode dibawah ini pada method onClick : 12. Silahkan jalankan program pada device atau emulator masing - masing

16. Code Break Dengan kode di atas , kita dapat menambahkan sebuah Fragment ke dalam layout dengan cara menginisialisasi FragmentManager dan memulai transaksi Fragment. Selanjutnya , kita membuat sebuah instance dari Fragment yang ingin ditambahkan ke dalam layout, dan menambahkannya ke dalam container yang telah ditentukan . Id frame layout yang digunakan untuk menampilkan fragment pada activity yang disebut juga dengan container

17. Code Break method onCreateView () berguna untuk melakukan inisialisasi komponen tampilan (UI), seperti menemukan dan mengambil referensi view dari layout tampilan Inflate merupakan proses untuk mengubah layout XML menjadi objek view.

18. Code Break getChildFragmentManager () digunakan untuk mengambil FragmentManager dari child fragment yang terkait dengan HomeFragment . Dalam kasus ini , CategoryFragment dianggap sebagai child fragment dari HomeFragment karena CategoryFragment dipanggil dan ditampilkan melalui HomeFragment . Oleh karena itu , metode getChildFragmentManager () digunakan untuk menampilkan CategoryFragment di dalam tampilan HomeFragment .

19. Code Break Pada kasus kali ini , yaitu menampilkan sebuah pesan dialog pada fragment, sebuah fragment dapat menggunakan interface OnOptionDialogListener ini untuk memberikan suatu respons ketika sebuah opsi dipilih pada dialog yang muncul . Fragment tersebut akan mengimplementasikan interface OnOptionDialogListener dan kemudian akan memasukkan objek yang mengimplementasikan interface tersebut ke dalam setOnOptionDialogListener . Dengan begitu , saat opsi dipilih pada dialog, fragment tersebut dapat mengambil nilai dari opsi tersebut dan memberikan respons sesuai dengan logikanya .

20. Code lab RecyclerView with Fragment

21. Ringkasan Materi RecyclerView adalah sebuah komponen antarmuka pengguna (UI) dalam pengembangan aplikasi Android yang digunakan untuk menampilkan daftar atau grid item yang dapat di-scroll. Ini merupakan pengganti yang lebih canggih dan fleksibel untuk komponen-komponen seperti ListView dan GridView . RecyclerView dirancang untuk meningkatkan kinerja dan memberikan lebih banyak fleksibilitas dalam menangani set data yang besar . Contoh penggunaan RecyclerView seperti aplikasi contact atapun email di google.

22. Komponen utama yang dibutuhkan Adapter, bertanggung jawab untuk membuat dan mengaitkan tampilan dengan data. Ini berperan sebagai penghubung antara sumber data dan RecyclerView ViewHolder : ViewHolder adalah pola desain yang digunakan bersamaan dengan Adapter . Ini mewakili setiap item individual dalam RecyclerView dan menyimpan referensi ke tampilan-tampilan di dalam tata letak item tersebut . Ini membantu dalam daur ulang tampilan secara efisien saat Anda menggulir melalui daftar LayoutManager : LayoutManager bertanggung jawab untuk menempatkan dan mengukur item-item individual dalam RecyclerView Listener: Anda dapat menetapkan antarmuka untuk menangani klik item, klik panjang , dan interaksi lain dalam RecyclerView .

23. 2. Selanjutnya , buka Activity_main.xml , tambahkan kode berikut ini : Frame layout digunakan untuk container yang menampung layout berbentuk fragment Buatlah sebuah project baru dan beri nama MyRecyclerView dengan konfigurasi seperti dibawah ini : Project Name : MyRecyclerView Min Level API : 15 Default activity : Empty Activity Activity name : Main activity Code Lab

24. 3. Selanjutnya , buatlah sebuah resource file baru didalam folder layout, yang digunakan untuk membuat desain tampilan cardview , caranya klik kanan pada folder layout -> new -> Layout Resource File Lalu simpan dengan nama item_cardview_lokasi lalu tekan OK Secara otomatis terdapat file xml baru Bernama item_cardview_lokasi didalam folder layout

25. Pada layout item_cardview_lokasi tambahkan kode berikut ini :

26. 4. Buatlah sebuah fragment baru , dan beri nama DetailFragment , dan buka fragment_detail.xml dan tambahkan script dibawah ini :

27. Oke urusan per-layout-an selesai , sekarang mari kita ngoding 5. Buatlah sebuah kelas POJO baru , beri nama Lokasi, dan tambahkan beberapa variable dibawah ini : Jangan lupa kelas ini mengimpelementasi interface Parcelable , setelah nya tambahkan generate method getter and setter untuk setiap variable yang didefinisikan . Hasil akhir kelas Lokasi akan seperti ini :

28. Oke urusan per-layout-an selesai , sekarang mari kita ngoding 5. Buatlah sebuah kelas POJO baru , beri nama Lokasi, dan tambahkan beberapa variable dibawah ini : Jangan lupa kelas ini mengimpelementasi interface Parcelable , setelah nya tambahkan generate method getter and setter untuk setiap variable yang didefinisikan . Hasil akhir kelas Lokasi akan seperti ini :

29. 6. Selanjutnya buatlah kelas dan simpan dengan nama DataLokasi , kelas ini difungsikan untuk menampung data lokasi berupa Array yang selanjutnya akan digunakan sebagai data pada Cardview . Data ini bisa dicopy dari link dibawah ini , https://codebeautify.org/javaviewer/y23ff8aff Paste didalam array multidimensi yang telah dibuat , setelahnya tambahkan script kode dibawah ini Next

30. Tambahkan dibawah array dataLokasi , tambahkan method getListData yang digunakan untuk mengembalikan sebuah Arraylist dari objek Lokasi.

31. 7. Buatlah sebuah class baru yang fungsikan sebagai Adapter, simpan dengan nama CardLokasiAdapter , dan tambahkan kode dibawah ini : Tekan shortcut alt+enter untuk implementasi beberapa method dibawah ini

32. 7. Sesuaikan script di beberapa method menjadi seperti dibawah ini : Method onCreateViewHolder

33. 7. Sesuaikan script di beberapa method menjadi seperti dibawah ini : Method getItemCount Dan kelas CardViewHolder

34. 8. Selanjutnya , buka kelas MainActivity.java , dan tambahkan kode dibawah ini :

35. 9. Last but not least, buka DetailFragment.java , dan sesuaikan kodenya menjadi seperti bawah ini :

36. Silahkan running aplikasi yang telah dibuat pada device masing – masing.