Advertisement
  1. Code
  2. Android SDK

Code Widget untuk Aplikasi Android Kamu: Memperbarui Widget

by
Difficulty:BeginnerLength:LongLanguages:

Indonesian (Bahasa Indonesia) translation by Ilham Saputra (you can also view the original English article)

Widget aplikasi memberi pengguna Anda akses mudah ke fitur aplikasi Anda yang paling sering digunakan, sekaligus memberi aplikasi Anda kehadiran di homescreen pengguna. Dengan menambahkan widget ke proyek Anda, Anda dapat memberikan experience pengguna yang lebih baik, sekaligus mendorong pengguna untuk tetap terlibat dengan aplikasi Anda, karena setiap saat mereka melirik homescreen mereka, mereka akan melihat widget Anda, menampilkan beberapa aplikasi Anda yang paling berguna dan konten menarik.

Dalam seri ketiga bagian ini, kami membangun widget aplikasi yang memiliki semua fungsi yang akan Anda temukan di hampir semua widget aplikasi Android.

Di postingan pertama, kami membuat widget yang mengambil dan menampilkan data dan melakukan tindakan unik dalam menanggapi event onClick. Namun, widget kami masih kehilangan satu fungsionalitas penting: tidak pernah diperbarui dengan informasi baru. Widget yang tidak pernah memiliki sesuatu yang baru untuk ditawarkan tidak semudah itu, jadi kami akan memberi widget dua cara update yang berbeda.

Pada akhir seri ini, kami akan memperluas widget kami untuk mengambil dan menampilkan data baru secara otomatis berdasarkan jadwal, dan sebagai respons terhadap interaksi pengguna.

Kami mengambil tepat di tempat yang kami tinggalkan, jadi jika Anda tidak memiliki salinan widget yang kami buat di posting pertama, Anda dapat mendownloadnya dari GitHub.

Memperbarui Layout Anda

Langkah pertama adalah mengupdate layout kita untuk menampilkan beberapa data yang berubah dari waktu ke waktu. Untuk membantu kami melihat dengan tepat kapan widget kami menerima setiap pembaruan, saya akan menginstruksikan widget untuk mengambil dan menampilkan waktu sekarang, kapan pun dia melakukan pembaruan.

Saya akan menambahkan berikut ke layout widget:

  • sebuah TextView yang menampilkan label Update Terakhir
  • sebuah TextView yang akan menampilkan waktu update terakhir

Saat kami mengerjakan file new_app_widget.xml, saya juga akan menambahkan TextView yang pada akhirnya akan memungkinkan pengguna untuk memicu pembaruan secara manual:

Selanjutnya, tentukan resources string baru yang kami rujuk dalam tata letak kami:

@string/time terlihat berbeda dari string khas Anda, karena hanya placeholder yang akan diganti saat runtime.

Ini memberi kita layout yang telah selesai:

Preview the complete Android application widget layout

Memperbarui Widget Anda Berdasarkan Jadwal

Karena ini adalah metode termudah untuk diterapkan, saya akan memulai dengan memperbarui widget secara otomatis, setelah jangka waktu tertentu telah berlalu.

Saat membuat jadwal pembaruan otomatis semacam ini, 1.800.000 miliseconds (30 menit) adalah interval terkecil yang dapat Anda gunakan. Bahkan jika Anda mengatur updatePeriodMillis proyek Anda kurang dari 30 menit, widget Anda tetap akan diperbarui setiap setengah jam sekali.

Memutuskan seberapa sering widget Anda harus diupdate tidak pernah mudah. Pembaruan yang sering terjadi adalah pengosongan yang lebih besar pada baterai perangkat, namun setel pembaruan ini terlalu jauh dan widget Anda mungkin berakhir dengan menampilkan informasi yang jauh berbeda dari pengguna.

Untuk menemukan keseimbangan yang sesuai dengan proyek Anda, Anda harus menguji widget Anda di berbagai frekuensi update dan mengukur dampak setiap frekuensi pada masa pakai baterai, sambil memantau apakah konten widget tersebut menjadi terasa ketinggalan zaman.

Sejak how-frequent-is-too-frequent adalah salah satu frustasi, pertanyaan subjektif di mana tidak ada jawaban 'benar', ini dapat membantu mendapatkan opini kedua dengan mengatur beberapa pengujian pengguna. Anda bahkan bisa menyiapkan beberapa pengujian A/B untuk memeriksa apakah frekuensi pembaruan tertentu diterima lebih positif daripada yang lain.

Buka file AppWidgetProviderInfo proyek Anda (res/xml/new_app_widget_info.xml) dan Anda akan melihat bahwa itu sudah mendefinisikan interval pembaruan default 86.400.000 miliseconds (24 jam).

Ada banyak widget yang hanya update setiap 24 jam sekali; Misalnya, widget yang menampilkan ramalan cuaca mungkin hanya perlu mengambil informasi baru satu kali per hari. Namun, meskipun widget Anda hanya perlu diperbarui sekali per hari, ini tidak ideal saat menguji aplikasi Anda. Tidak ada yang mau menunggu 24 jam hanya untuk melihat apakah method onUpdate() mereka dipicu dengan benar, jadi Anda biasanya akan menggunakan interval sesingkat mungkin saat melakukan pengujian awal, dan kemudian mengubah nilai ini nanti, jika diperlukan.

Agar lebih mudah menguji aplikasi kami, saya akan menggunakan interval sekecil mungkin:

Mengambil dan Menampilkan Waktu Sekarang

Method onUpdate() bertanggung jawab untuk memperbarui View widget Anda dengan informasi baru. Jika Anda membuka penyedia widget proyek Anda (java/values​​/NewAppWidget.java), maka Anda akan melihat bahwa itu sudah berisi garis besar method onUpdate():

Terlepas dari apakah widget Anda diperbarui secara otomatis atau sebagai respons terhadap interaksi pengguna, proses pembaruannya persis sama: manajer widget mengirim broadcast intent dengan tindakan ACTION_APPWIDGET_UPDATE, dan kelas penyedia widget merespons dengan memanggil method onUpdate(), yang pada gilirannya memanggil method helper updateAppWidget().

Setelah kami memperbarui kelas NewAppWidget.java kami untuk mengambil dan menampilkan waktu sekarang, proyek kami akan menggunakan bagian kode yang sama ini, terlepas dari bagaimana method onUpdate() dipicu:

Ada satu masalah dengan kode di atas: jika pengguna mengetuk TextView beberapa kali selama rentang waktu satu menit, tidak akan ada indikasi visual bahwa widget telah diperbarui, hanya karena tidak ada waktu baru untuk ditampilkan. Ini mungkin tidak akan menimbulkan masalah bagi end-user Anda, yang tidak mungkin duduk di sana, mengetuk TextView beberapa kali per menit dan bertanya-tanya mengapa waktu tidak berubah. Namun, ini mungkin menjadi masalah saat menguji aplikasi Anda, karena ini berarti Anda harus menunggu setidaknya 60 detik di antara memicu method onUpdate().

Untuk memastikan selalu ada semacam konfirmasi visual bahwa metode onUpdate() telah berjalan dengan sukses, saya akan menampilkan toast setiap kali onUpdate() disebut:

Test that the widget is updating correctly by including a toast

Memperbarui Widget Anda dalam Respon untuk User Action

Widget kami sekarang akan diperbarui secara otomatis setiap setengah jam sekali, tapi bagaimana dengan memperbarui dalam menanggapi interaksi pengguna?

Kami telah meletakkan banyak dasar dengan menambahkan Tap to Update TextView ke layout kami dan memperluas kelas NewAppWidget.java untuk mengambil dan menampilkan waktu sekarang kapan saja onUpdate() dipanggil.

Satu-satunya yang tersisa untuk dilakukan adalah membuat Intent dengan AppWidgetManager.ACTION_APPWIDGET_UPDATE, yang merupakan tindakan yang memberi tahu widget bahwa inilah saatnya untuk memperbarui, dan kemudian memanggil Intent ini sebagai tanggapan terhadap pengguna yang berinteraksi dengan Tap to Update TextView.

Berikut adalah kelas NewAppWidget.java yang telah selesai:

Mampu memperbarui widget sesuai permintaan dapat sangat berharga saat menguji proyek Anda, karena ini berarti Anda tidak perlu menunggu selang waktu update berlalu. Meskipun Anda tidak menyertakan fungsi ini dalam aplikasi Anda yang telah selesai, Anda mungkin ingin menambahkan tombol Tap to Update sementara, hanya untuk membuat hidup Anda lebih mudah saat menguji proyek Anda.

Membuat Gambar Pratinjau

Widget kami sekarang terlihat sangat berbeda dengan widget yang dibuat oleh Android Studio untuk kami secara otomatis, namun saat ini masih menggunakan gambar pratinjau yang dibuat secara otomatis.

Create a unique Android app widget preview image

Idealnya, gambar pratinjau Anda harus mendorong pengguna untuk memilih widget Anda dari Pemilih Widget, namun paling tidak, ini merupakan representasi akurat tentang tampilan widget Anda! Saat ini, gambar pratinjau kami tidak menandai kotak-kotak itu, jadi kami perlu membuat yang baru.

Cara termudah adalah dengan menggunakan aplikasi Widget Preview yang disertakan dalam emulator Android.

Membuat Widget Preview

Pertama, instal proyek Anda di Virtual Android Device (AVD). Kemudian buka drawer app AVD dan luncurkan aplikasi Widget Preview. AVD akan menampilkan daftar setiap aplikasi yang diinstal pada perangkat-pilih aplikasi Anda dari daftar.

Widget Anda akan ditampilkan di latar belakang kosong. Luangkan waktu untuk mengubah ukuran dan tweaking widget Anda agar terlihat bagus, dan setelah Anda puas dengan hasilnya, pilih Take Snapshot. Tangkapan layar akan disimpan sebagai PNG di folder Download AVD. Untuk mengambil file ini, kembali ke Android Studio dan buka Device File Explorer, dengan memilih View > Tool Windows > Device File Explorer dari toolbar. Pada tampilan Device File Explorer, navigasikan ke folder sdcard/Download, di mana Anda akan menemukan gambar pratinjau yang disimpan sebagai [app_name]_ori_ [orientation].png.

Create a preview image using the Android Virtual Devices built-in Widget Preview app

Seret gambar ini dari Android Studio dan letakkan di tempat yang mudah dijangkau, seperti desktop Anda. Berikan gambar nama yang lebih deskriptif, lalu seret dan lepaskan gambar itu ke dalam folder drawable dari proyek Anda. Sekarang Anda dapat membuka file AppWidgetProviderInfo (dalam contoh ini, itu new_app_widget_info.xml) dan ubah baris berikut untuk referensi gambar pratinjau Anda yang baru:

Akhirnya, Anda bisa menghapus drawable yang tidak perlu dari example_appwidget_preview dari proyek Anda.

Menguji Widget Anda

Saatnya untuk memasang widget yang telah selesai untuk di tes!

Pertama, instal proyek yang diperbarui di perangkat Android fisik atau AVD Anda. Hapus semua contoh yang ada dari widget ini dari homescreen Anda, jadi Anda tahu Anda bekerja dengan versi terbaru.

Untuk menambahkan widget Anda, tekan sembarang ruang kosong di homescreen, ketuk Widget, lalu pilih widget Anda. Anda akan mendapatkan kesempatan untuk mengubah ukuran dan memposisikan ulang widget, jika perlu.

Nilai Update Terakhir akan menampilkan waktu Anda membuat widget ini. Tekan Tap to Update dan widget harus menampilkan toast dan waktu baru. Jika Anda menempatkan contoh widget kedua di homescreen Anda, sebaiknya menampilkan waktu yang berbeda dengan yang pertama.

Create multiple instances of the same application widget

Anda dapat memperbarui salah satu contoh widget ini dengan memberi Tab to Update TextView ketuk. Jika Anda memicu update manual untuk widget pertama, maka widget kedua tidak akan diperbarui, dan sebaliknya.

Selain update manual, App Widget Manager akan memperbarui semua contoh widget Anda setiap 30 menit sekali, berdasarkan waktu ketika Anda membuat instance pertama. Meskipun update manual dapat menghasilkan contoh yang menampilkan waktu yang berbeda, sekali setiap setengah jam semua kejadian akan diperbarui secara bersamaan, pada saat tiitk mereka akan menampilkan waktu yang sama.

Anda mungkin ingin menyimpan beberapa contoh widget ini di homescreen Anda, sehingga Anda dapat memantau bagaimana konten mereka berubah dari waktu ke waktu sebagai tanggapan atas kombinasi pembaruan otomatis dan manual.

Kesimpulan

Dalam seri ini, kami telah membuat widget aplikasi Android yang menunjukkan bagaimana menerapkan semua fitur paling umum yang ditemukan di widget aplikasi. Jika Anda telah mengikuti sejak awal, maka pada titik ini Anda telah membuat widget yang update secara otomatis dan sebagai tanggapan atas masukan pengguna, dan itu bisa bereaksi terhadap event onClick (Anda juga dapat mendownload proyek lengkap dari GitHub).

Di postingan berikutnya, kita akan melihat beberapa praktik terbaik untuk memastikan widget Anda memberikan pengalaman pengguna yang baik, dan bagaimana meningkatkan widget Anda dengan aktivitas konfigurasi.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.