PERSIAPAN KONFIGURASI & BUILD

Anda tidak perlu menginstal Android Studio, tetapi itu lebih baik. Proyek ini dapat dibangun tanpa Android Studio, menggunakan Gradle dan Android SDK. Gradle adalah sistem build yang digunakan untuk membuat file APK final.
  1. Source Code Aplikasi Android Webview Pro
  2. Instal Java JDK https://www.oracle.com/technetwork/java/javase/downloads/index.html
  3. Instal Android Studio dengan Android SDK https://developer.android.com/studio/
  4. Jalankan Android SDK Manager dan unduh paket SDK yang diperlukan (API Level 32), pastikan Anda telah menginstal Android SDK Tools, Android SDK Platform-Tools, Android SDK Build-Tools, Android Emulator, dan Google USB Driver https://developer.android.com/studio/intro/update#sdk-manager
  5. Sekarang Anda seharusnya dapat membuka/mengedit proyek Android dan membuat APK
Catatan: Panduan ini Disertakan Gambar Lengkap di versi PDF

KONFIGURASI WEBVIEW PRO

Tahap ini menjelaskan cara mengonfigurasi proyek agar siap diterbitkan. Semua langkah ini sangat penting!

1. Import Project

Ekstrak file WebviewPro.zip dan import/buka proyek di Android Studio. Pilih "Import proyek" dan pilih folder "WebviewPro".

Anda dapat beralih ke tampilan Proyek di jendela Proyek di sebelah kiri jika Anda ingin melihat struktur file dari proyek termasuk semua file yang disembunyikan dari tampilan Android.

Jika mau, Anda dapat langsung membangun dan menjalankan aplikasi untuk mengujinya. Hubungkan perangkat atau emulator Anda ke komputer Anda. Pastikan Anda telah menginstal semua driver yang diperlukan untuk perangkat Android Anda dan Anda juga mengaktifkan USB debugging di opsi Pengembang.

Untuk membangun dan menjalankan aplikasi di Android Studio, cukup klik menu Utama -> Run -> Run 'mobile'. Pilih perangkat yang terhubung dan konfirmasi.

2. Atur Purchase Code

Buka file konfigurasi mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java dan tetapkan value dari PURCHASE_CODE dengan kode pembelian Anda sendiri di mycoding.id.

Penting: kode pembelian yang telah digunakan di aplikasi lain atau kode yang tidak valid dapat menyebabkan aplikasi Anda dihentikan. 1 kode pembelian hanya berlaku untuk 1 domain.

3. Ganti Nama ID Aplikasi

Setiap aplikasi Android memiliki ID secara unik. Setelah Anda memublikasikan aplikasi di Play Store, Anda tidak boleh mengubah ID aplikasi. ID aplikasi default adalah "id.mcproject.mcpstore" sehingga Anda harus menggantinya.
  • Buka script build di folder mobile/build.gradle
  • Ganti value dari applicationId. Tulis ID aplikasi Anda sendiri, contoh "com.company.appname"
  • Jika Anda mencoba build proyek sekarang, Anda akan mendapatkan kesalahan "No matching client found for package name". Alasannya karna nama paket yang dideklarasikan di mobile/google-services.json tidak cocok dengan nama paket Anda sendiri (ID aplikasi).
  • Kami akan menyiapkan Firebase dan google-services.json nanti. Sementara itu, jika Anda ingin menghilangkan kesalahan, cukup perbarui nilai semua package_name di google-services.json ke nama paket Anda sendiri (ID aplikasi)
  • Caranya, buka google-services.json, ganti id.mcproject.mcpstore pada baris ke 99 dengan nama paket Anda, misalnya "com.company.appname"
  • Lalu Sinkronkan proyek. Menu utama -> File -> Sync Project with Gradle Files

4. Ganti Nama Aplikasi

  • Buka mobile/src/main/res/values/strings.xml
  • Ubah value dari app_name dan navigation_header_title
  • "WebView Pro" dan "WebView Pro Official" jadi nama aplikasi Anda
  • Strings lainnya abaikan, kita akan atur nanti agar Anda paham setiap bagian dari script.

5. Ikon Launcher, logo splash & gambar header

  • Klik kanan pada direktori mobile/src/main/res -> New -> Image Asset -> Icon Type “Launcher Icons”
  • Nama "ic_launcher", buat ikon sesuai keinginan, Anda dapat mengatur clipart, text, shape, color dll.
  • Next -> Finish
CARA MANUAL: mengganti file ic_launcher.png di direktori mipmap-mdpi, mipmap-hdpi, mipmap-xhdpi, mipmap-xxhdpi, mipmap-xxxhdpi, mipmap-anydpi-v26

CARA CEPAT: membuat ikon launcher menggunakan Android Asset Studio https://romannurik.github.io/AndroidAssetStudio/icons-launcher.html
  • Ubah gambar header yang ditampilkan diatas navigasi, ganti di mobile/src/main/res/drawable-nodpi/navigation_header_logo.png
  • Ubah logo splash. ganti di mobile/src/main/res/drawable-nodpi/splash.png.

6. Pilih Warna Tema

  • Buka mobile/src/main/AndroidManifest.xml
  • Ubah value dari application.android:theme

Ada 10 tema yang bisa Anda gunakan:
  • Theme.WebViewApp.Red
  • Theme.WebViewApp.Teal
  • Theme.WebViewApp.Blue
  • Theme.WebViewApp.Orange
  • Theme.WebViewApp.Purple
  • Theme.WebViewApp.Green
  • Theme.WebViewApp.Brown
  • Theme.WebViewApp.Gray
  • Theme.WebViewApp.Lime
  • Theme.WebViewApp.Violet

7. Atur Navigasi dan Halaman Web

Buka mobile/src/main/res/values/navigation.xml
Ada 4 array string:
  1. Daftar judul di menu panel samping navigasi.
  2. Daftar URL tampilan web. Anda dapat menentukan tautan URL ke halaman web di Internet atau tautan URL ke halaman lokal yang disimpan di folder assets. Halaman lokal tidak memerlukan koneksi internet. URL ke halaman lokal harus dalam format ini: file:///android_asset/contact.html. Gunakan {FCM_REGISTRATION_TOKEN} atau {ONE_SIGNAL_USER_ID} jika Anda ingin memasukkan token pendaftaran FCM atau OneSignal. Jika Anda ingin menambahkan kategori, biarkan link item tersebut kosong. Item menu tanpa URL dianggap sebagai item kategori.
  3. Daftar ikon di menu panel samping navigasi.
  4. Daftar pesan berbagi. Setiap halaman tampilan web dapat dibagikan melalui email, sms, jejaring sosial, dll. Tombol Bagikan ada di bilah tindakan. Anda dapat menentukan pesan yang akan diposting. Gunakan {TITLE} atau {URL} tag jika Anda ingin menyisipkan judul atau tautan URL halaman. Jika Anda tidak ingin membagikan halaman, biarkan item tetap kosong.

Anda dapat menambah/menghapus/memodifikasi item menu sesuai kebutuhan. Jika Anda ingin menggunakan halaman lokal:
  • Salin file HTML ke direktori mobile/src/main/assets
  • Atur jalur yang tepat di array navigation_url_list array

Catatan: Halaman beranda utama adalah halaman pertama dalam daftar URL. Halaman ini dimuat bahkan jika panel samping navigasi dinonaktifkan.

Penting: Masing-masing dari 4 array ini harus berisi jumlah item yang sama. Contoh secara default berisi 9 item.

8. Siapkan Firebase Cloud Messaging dan Analytics

Aplikasi menggunakan Firebase untuk Cloud Messaging, Analytics dan AdMob. Anda perlu membuat akun Firebase baru jika belum memilikinya.
  • Anda harus membuat proyek baru di Firebase Console
  • Ikuti dokumentasi Firebase untuk menyiapkan proyek
  • Setelah Anda menambahkan proyek Firebase baru
  • Pilih Dasbor Analytics dan buka wizard untuk menambahkan Firebase ke aplikasi Android Anda
  • Isi nama paket Anda (ID aplikasi) dan unduh file konfigurasi google-services.json
  • Salin file ini ke direktori mobile. Itu dia. Anda tidak perlu menyiapkan Firebase SDK, itu sudah selesai. Anda dapat membuat dan mengirim pemberitahuan push di Firebase Console.

Saat pengguna mengetuk notifikasi, aplikasi dibuka dan halaman beranda dimuat. Jika Anda ingin memuat halaman tertentu, Anda harus mengirim pemberitahuan dengan data tambahan:
  • Open Firebase -> Cloud Messaging -> New message -> Additional options -> Custom data -> atur "url" sebagai kunci dan tautan Anda sebagai nilai.

Anda dapat mengubah ikon pemberitahuan push dengan mengganti file ic_stat_notification.png di direktori drawable-mdpi, drawable-hdpi, drawable-xhdpi, drawable-xxhdpi, drawable-xxxhdpi

Catatan: Anda dapat menargetkan pesan pemberitahuan push pada pengguna tertentu dengan meneruskan token pendaftaran FCM di URL tampilan web. Lihat bagian Pengaturan Navigasi dan Halaman Web diatas.

9. Pengaturan OneSignal

Ada 2 opsi cara mengirim notifikasi push: melalui Firebase Console atau menggunakan OneSignal. Jika Anda lebih suka menggunakan OneSignal, baca instruksi berikut, jika tidak, Anda dapat melewati langkah ini dan hanya menggunakan Firebase Console yang lebih sederhana.

Aplikasi mendukung OneSignal.com untuk mengirim pemberitahuan push. Anda perlu membuat akun OneSignal baru jika belum memilikinya. Anda harus membuat proyek baru di admin OneSignal. OneSignal sebenarnya menggunakan teknologi FCM Google (Firebase Cloud Messaging) sehingga Anda harus memiliki akun Firebase jika ingin menggunakan OneSignal.

Ikuti dokumentasi OneSignal untuk menyiapkan proyek. Anda perlu mendapatkan “Sender ID” (project number) dan "Server key" di Konsol Firebase. Semuanya dijelaskan langkah demi langkah dalam dokumentasi OneSignal.

Setelah selesai, cukup tempel "Server key" dan "Sender ID" pada OneSignal di wizard konfigurasi. Kemudian buka mobile/src/main/res/values/onesignal.xml dan mengatur nilai string onesignal_app_id. Anda bisa mendapatkan onesignal_app_id dari OneSignal (bagian Keys & IDs). Biarkan string ini kosong jika Anda tidak ingin menggunakan OneSignal. Kosong artinya seperti berikut <string name="onesignal_app_id" translatable="false"></string>.

Saat pengguna mengetuk notifikasi, aplikasi dibuka dan halaman beranda dimuat. Jika Anda ingin memuat halaman tertentu, Anda harus mengirim pemberitahuan dengan data tambahan. Buka admin OneSignal -> New Message -> Launch URL -> atur link nya. Alternatif lain adalah New Message -> Advanced Settings -> Additional Data -> atur "url" sebagai kunci dan tautan sebagai nilai. Kedua varian memiliki hasil yang sama, aplikasi akan dibuka dengan URL yang ditentukan.

Anda dapat mengubah ikon notifikasi push OneSignal dengan mengganti file ic_stat_onesignal_default.png di direktori drawable-mdpi, drawable-hdpi, drawable-xhdpi, drawable-xxhdpi, drawable-xxxhdpi.

10. Pengaturan AdMob

  • Buka mobile/src/main/res/values/admob.xml
  • Tetapkan nilai string admob_publisher_id = ke id penayang AdMob Anda
  • Dan string admob_app_id ke id aplikasi AdMob Anda
  • Nilai default adalah id penayang pengujian dan id aplikasi pengujian
  • Pertahankan nilai default jika Anda tidak ingin menggunakan AdMob
  • Tetapkan nilai string admob_unit_id_banner dan admob_unit_id_interstitial ke id unit Anda (banner id dan interstitial id). Biarkan string ini kosong jika Anda tidak ingin menggunakan AdMob. Kosong artinya seperti berikut <string name="admob_unit_id_banner" translatable="false"></string>.

Iklan interstitial akan ditampilkan setelah setiap x url dimuat atau klik pada menu panel samping navigasi. Frekuensi menampilkan iklan interstitial AdMob dapat diubah.
- Buka file konfigurasi mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
- Atur nilai ADMOB_INTERSTITIAL_FREQUENCY.

Penting: Jangan lupa untuk menautkan aplikasi Anda ke Firebase di setelan AdMob.

Anda juga dapat menentukan id perangkat pengujian Anda dalam string admob_test_device_id dan menggunakan mode pengujian saat Anda men-debug aplikasi. Meminta iklan percobaan disarankan saat Anda menguji aplikasi pada perangkat nyata sehingga Anda tidak meminta tayangan yang tidak valid. 

Anda dapat menemukan id perangkat yang di-hash di keluaran Android Monitor (Logcat) dengan meminta iklan saat melakukan debug di perangkat Anda. Buka Android Monitor (Logcat) di Android Studio dan cari “To get test ads on this device, call adRequest.addTestDevice(“XXXXXX…”);”. Anda dapat menggunakan filter/pencarian untuk menemukan informasi ini di log.

String XXX itu adalah id perangkat yang di-hash. Ini hanya berlaku untuk perangkat nyata, bukan emulator. Emulator dianggap sebagai perangkat uji secara default sehingga Anda tidak perlu mempedulikannya.

Aplikasi ini sesuai dengan GDPR (European Union’s General Data Protection Regulation). Formulir persetujuan GDPR ditampilkan kepada pengguna yang berada di Wilayah Ekonomi Eropa selama peluncuran pertama aplikasi. Pengguna dapat memilih apakah mereka ingin mempersonalisasi iklan atau tidak. Formulir persetujuan GDPR memerlukan tautan URL ke kebijakan privasi Anda. Anda dapat menentukan tautan di GDPR_PRIVACY_POLICY_URL

Biarkan kosong jika Anda tidak ingin menampilkan formulir persetujuan GDPR. Kosong artinya seperti: public static final String GDPR_PRIVACY_POLICY_URL = "";. Tautan kebijakan privasi juga harus disediakan di dalam aplikasi (misalnya di menu navigasi) karena Google Play mengharuskan pengembang untuk memberikan kebijakan privasi yang valid saat aplikasi meminta atau menangani informasi sensitif pengguna atau perangkat (misalnya pengenal iklan). Anda dapat menggunakan pembuat kebijakan privasi di https://app-privacy-policy-generator.firebaseapp.com.

Catatan: Terkadang tidak ada iklan yang ditampilkan di aplikasi. Tidak ada yang salah, itu adalah perilaku yang benar. Jika Anda melihat Failed to load ad: 0 di log, berarti iklan baru saja dibuat. Butuh beberapa waktu untuk mengambil iklan dari server Google. Anda hanya perlu menunggu beberapa jam. Jika Anda melihat Gagal memuat iklan: 3 di log, itu berarti permintaan iklan Anda berhasil tetapi server Google tidak dapat menyediakan iklan apa pun untuk pengguna target.

11. Membuat Penandatanganan Keystore (Signing Keystore)

Anda perlu membuat keystore sendiri untuk menandatangani file APK/AAB sebelum memublikasikan aplikasi di Google Play. Anda dapat membuat keystore di Android Studio atau melalui utilitas keytool. Lebih lengkap bisa ikuti panduan berikut https://mycoding.id/blog/2-cara-membuat-keystore-apk-untuk-rilis-aplikasi-di-playstore


MEMBUAT KEYSTORE WEBVIEW PRO

  1. Buka proyek di Android Studio
  2. Menu utama -> Build -> Generate Signed Bundle / APK -> APK -> Create new
  3. Nama file keystore harus webviewapp.jks dan harus disimpan di direktori extras/keystore
  4. Setelah Anda membuat file keystore, Anda bisa menutup dialog Generate Signed Bundle atau APK
  5. Pastikan webviewapp.jks yang baru dibuat disimpan di direktori extras/keystore
  6. Buka ekstra/keystore/webviewapp.properties
  7. Atur alias keystore dan kata sandi yang Anda atur saat membuat keystore

Penting: Ingat bahwa webviewapp.jks dan webviewapp.properties secara otomatis dibaca oleh script Gradle saat membuat APK rilis melalui perintah assembleRelease atau AAB melalui perintah bundleRelease. Jalur ke file ini ditentukan dalam gradle.properties.

Catatan: Jika Anda ingin membuat keystore melalui utilitas keytool, jalankan perintah berikut: keytool -genkey -v -keystore webviewapp.jks -alias <your_alias> -keyalg RSA -keysize 2048 -validity 36500 di mana <your_alias> nama alias Anda. Misalnya nama perusahaan atau nama aplikasi Anda.

Utilitas keytool adalah bagian dari Java JDK. Di Windows, Anda biasanya dapat menemukannya di C:\Program Files\Java\jdkX.Y.Z\bin. Di Mac Anda biasanya dapat menemukannya di /Library/Java/JavaVirtualMachines/jdkX.Y.Z/Contents/Home/bin. Jika Anda membuat keystore dengan cara ini, jangan lupa langkah 2 sampai 7 diatas.

Penting: Jangan sampai kehilangan file keystore, Anda tidak akan dapat memublikasikan pembaruan baru di Google Play jika hilang. Anda harus menggunakan sertifikat yang sama sepanjang masa di aplikasi Anda agar pengguna dapat menginstal versi baru sebagai pembaruan untuk aplikasi. Secara opsional, Anda dapat menggunakan Penandatanganan Aplikasi Google Play untuk menghindari kehilangan keystore Anda.


KUSTOMISASI WEBVIEW PRO

Bagian ini menjelaskan penyesuaian opsional aplikasi webview Anda.

1. Action Bar

Anda dapat mengaktifkan/menonaktifkan action bar (toolbar) di file konfigurasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari ACTION_BAR ke true/false

Judul di action bar diambil dari file mobile/src/main/res/values/navigation.xml. Jika Anda ingin menampilkan judul HTML otomatis di judul navigasi di action bar, maka atur ACTION_BAR_HTML_TITLE dalam file konfigurasi ke nilai true

2. Menu Navigasi Drawer

Anda dapat mengaktifkan/menonaktifkan menu panel samping navigasi di file konfigurasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari NAVIGATION_DRAWER ke true/false

Anda dapat mengaktifkan/menonaktifkan gambar latar di header menu panel navigasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari NAVIGATION_DRAWER_HEADER_IMAGE ke true/false. Jika dinonaktifkan, warna aksen akan digunakan untuk latar belakang
  • Gambar latar belakang disimpan di mobile/src/main/res/drawable-nodpi/navigation_header_bg.png
  • Logo yang ditampilkan di header disimpan di mobile/src/main/res/drawable-nodpi/navigation_header_logo.png.

Anda juga dapat mengaktifkan/menonaktifkan warna ikon menu.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari NAVIGATION_DRAWER_ICON_TINT ke true/false. Hanya ikon PNG transparan yang dapat diwarnai, jadi jika Anda tidak menggunakan ikon transparan, disarankan untuk menonaktifkan pewarnaan ikon
  • Warna rona ditentukan dalam atribut @color/navigation_icon_tint di file mobile/src/main/res/values/colors.xml

3. Konfirmasi Keluar Aplikasi

Anda dapat mengaktifkan/menonaktifkan dialog konfirmasi keluar (ketika pengguna mencoba keluar dari aplikasi dengan menekan tombol kembali).
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari EXIT_CONFIRMATION ke true/false

4. Pengaturan Geolokasi

Aplikasi mendukung geolokasi. Perlu diingat, bahwa beberapa pengguna mungkin menonaktifkan geolokasi di perangkat mereka. Geolokasi memerlukan izin untuk mengakses GPS. Permintaan izin ditampilkan saat diperlukan. Jika pengguna memutuskan untuk menolak izin, geolokasi tidak akan berfungsi. Jika Anda tidak menggunakan geolokasi di web Anda, lebih baik untuk menonaktifkannya.

Anda dapat mengaktifkan/menonaktifkan geolokasi di file konfigurasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari GEOLOCATION ke true/false

Perlu diingat juga, bahwa geolokasi HTML5 tidak diperbolehkan lagi dengan protokol HTTP yang tidak aman karena alasan keamanan. Disarankan untuk menggunakan protokol HTTPS yang aman. Lebih lanjut https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins

5. Progress Placeholder

Anda dapat mengaktifkan/menonaktifkan Progress Placeholder (ditampilkan saat memuat halaman).
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari PROGRESS_PLACEHOLDER ke true/false

6. API JavaScript

Aplikasi menyediakan API JavaScript yang dapat Anda gunakan untuk berinteraksi dengan aplikasi seluler dari web Anda menggunakan JavaScript. Anda dapat mengaktifkan/menonaktifkan JavaScript API di file konfigurasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari JAVA_SCRIPT_API ke true/false

Disarankan untuk menonaktifkan JavaScript API jika Anda tidak berencana menggunakannya karena alasan keamanan. JavaScript API menyediakan fungsi JavaScript berikut:
  • var applicationId = MCProjectWebViewPro.getApplicationId();
  • var versionCode = MCProjectWebViewPro.getVersionCode();
  • var versionName = MCProjectWebViewPro.getVersionName();
  • var deviceAPILevel = MCProjectWebViewPro.getDeviceAPILevel();
  • var deviceUniqueId = MCProjectWebViewPro.getDeviceUniqueId();
  • var fcmRegistrationToken = MCProjectWebViewPro.getFcmRegistrationToken();
  • var oneSignalUserId = MCProjectWebViewPro.getOneSignalUserId();
  • MCProjectWebViewPro.showToast(message);
  • MCProjectWebViewPro.showSnackbar(message);
  • MCProjectWebViewPro.showSnackbarWithButton(message, button);
  • MCProjectWebViewPro.showDialog(title, message);
  • MCProjectWebViewPro.openBrowser(url);
  • MCProjectWebViewPro.openStore();
  • MCProjectWebViewPro.share(subject, text);
  • MCProjectWebViewPro.closeApp();
  • MCProjectWebViewPro.sendOneSignalTag(key, value);
  • MCProjectWebViewPro.showInterstitialAd();

Penting: Hati-hati dalam menggunakan fungsi showInterstitialAd(). Ikuti aturan AdMob dan jangan terlalu sering menggunakannya.

7. Gerakan Pull-to-Refresh

Anda dapat mengaktifkan/menonaktifkan gerakan pull-to-refresh di file konfigurasi. Ada 3 mode.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur nilai dari PULL_TO_REFRESH ke ENABLED, DISABLED atau PROGRESS.
Setel ENABLED untuk mengaktifkan gerakan, atur DISABLED untuk menonaktifkan gerakan, atur PROGRESS untuk menonaktifkan gerakan dan hanya tampilkan indikator progress/loading.

Tips: Jika web Anda memiliki masalah dengan scrolling, coba nonaktifkan pull-to-refresh untuk menyegarkan. Biasanya menyelesaikan masalah scrolling apapun.

8. Dialog In-app Review

Dialog review dalam aplikasi ditampilkan setelah setiap x url memuat atau mengklik menu panel samping navigasi. Jika Anda ingin mengonfigurasi dialog review dalam aplikasi:
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Frekuensi menampilkan dialog dapat diatur di INAPP_REVIEW_DIALOG_FREQUENCY
  • Setel frekuensi ke 0 jika Anda tidak ingin menampilkan dialog review dalam aplikasi.

Ingatlah bahwa dialog review dalam aplikasi mungkin tidak muncul. Ini tidak dijamin. Google Play memberlakukan kuota terikat waktu tentang seberapa sering dialog review dapat ditampilkan kepada pengguna. Oleh karena itu dialog review dalam aplikasi tidak boleh terlalu sering ditampilkan. Selengkapnya https://developer.android.com/guide/playcore/in-app-review

9. Rate App Prompt

Dialog prompt beri nilai aplikasi ditampilkan setelah setiap x peluncuran aplikasi. Jika Anda ingin mengonfigurasi prompt aplikasi:
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Frekuensi menampilkan prompt dapat diatur secara RATE_APP_PROMPT_FREQUENCY. Setel frekuensi ke 0 jika Anda tidak ingin menampilkannya.
  • Durasi menampilkan prompt (dalam milidetik) dapat diatur di RATE_APP_PROMPT_DURATION.

Disarankan: gunakan salah satu, antara Dialog In-app Review atau Rate App Prompt.

10. User Agent

Anda dapat menyetel string agen pengguna khusus untuk tampilan web. Anda dapat menggunakan fitur ini untuk membedakan apakah halaman web dimuat di browser standar atau di tampilan web. Ini dapat berguna dalam situasi ketika Anda ingin memuat CSS yang berbeda untuk tampilan web, menyembunyikan iklan AdSense, dll. Logika ini harus diterapkan di backend Anda.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Tetapkan nilai string WEBVIEW_USER_AGENT ke agen pengguna Anda sendiri
  • Biarkan kosong jika Anda tidak ingin menyetel string agen pengguna khusus. Kosong artinya seperti berikut public static final String WEBVIEW_USER_AGENT = "";

11. Buka Link Eksternal di Browser Eksternal

Jika Anda mengklik tautan eksternal (bukan url dari domain web), halaman web dibuka langsung di aplikasi secara default. Halaman eksternal dapat dibuka di browser eksternal dengan cara:
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Atur value dari OPEN_LINKS_IN_EXTERNAL_BROWSER = true.

12. Buka Link Tertentu di Browser Eksternal

Anda juga dapat menetapkan aturan tautan mana yang akan dibuka di browser eksternal dan mana yang akan dimuat di dalam aplikasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Tambahkan/hapus aturan di LINKS_OPENED_IN_EXTERNAL_BROWSER atau array LINKS_OPENED_IN_INTERNAL_WEBVIEW
  • Jika tautan URL halaman berisi string dari array, itu akan dibuka di browser eksternal. Aturan-aturan ini memiliki prioritas lebih tinggi daripada opsi OPEN_LINKS_IN_EXTERNAL_BROWSER. Misalnya "http://www.example.com/?target=blank" akan dibuka secara eksternal dan "http://www.example.com/?target=webview" akan dibuka secara internal.

13. Download Manager

Fitur ini memungkinkan untuk mengunduh file dari web ke perangkat didalam aplikasi. Cukup klik pada tautan unduhan dan file akan diunduh secara otomatis ke direktori DOWNLOAD. URL file harus memiliki format tertentu agar pengelola unduhan dapat mengenalinya sebagai file yang dapat diunduh. Anda dapat melihat proses pengunduhan di panel notifikasi.

Dengan konfigurasi default, URL harus diakhiri dengan ekstensi yang didukung (zip, pdf, mp3, avi, dll.), misalnya http://www.example.com/path/mediafile.mp3. Konfigurasi default juga mendukung tautan Google Drive dan Dropbox.

Anda dapat mengubah ekstensi atau ekspresi file yang didukung dalam file konfigurasi.
  • Buka mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Tambahkan/hapus jenis file dalam array DOWNLOAD_FILE_TYPES sesuai kebutuhan
  • Entri dalam array ini adalah ekspresi reguler. Jika URL tampilan web cocok dengan ekspresi reguler, file akan diunduh melalui pengelola unduhan. Biarkan array tetap kosong jika Anda tidak ingin menggunakan pengelola unduhan.

14. Intents dalam HTML

Aplikasi mendukung Android Intents. Anda dapat menambahkan tautan khusus ke file HTML Anda dan Anda akan dapat menjalankan aplikasi eksternal yang sesuai untuk melakukan beberapa tindakan. Misalnya mengirim e-mail atau menelepon seseorang. Intent berikut didukung (contoh URI):
  • Halaman web HTTP: http://google.com
  • Halaman web HTTPS: https://google.com
  • E-mail: mailto:[email protected]?subject=Halo
  • Telepon: telp:+6282377823390
  • SMS: sms:+6282377823390
  • Titik peta: geo:-0.9050169852365122,100.35210712064622
  • Pencarian peta: geo:0,0?q=401XD+Group
Intent ini juga didukung di menu navigasi.

15. Splash Screen

Layar pembuka di aplikasi ini di implementasikan sebagai layar peluncuran sesuai dengan pedoman Desain Material. Logo layar splash disimpan di mobile/src/main/res/drawable-nodpi/splash.png.

16. Warna dan Ikon Kustom

Anda dapat menyesuaikan warna di mobile/src/main/res/values/colors.xml.

Ada 30 ikon yang dapat Anda gunakan untuk menu navigasi. Jika Anda perlu membuat ikon untuk menu panel samping navigasi, disarankan untuk menggunakan Android Asset Studio di https://romannurik.github.io/AndroidAssetStudio/index.html.

17. Dukungan Multi-Bahasa

Buat direktori baru mobile/src/main/res/values-xx dimana xx adalah kode ISO 639-1 dari bahasa yang ingin Anda terjemahkan. Misalnya "values-es" untuk bahasa Spanyol, "values-fr" untuk bahasa Prancis, "values-de" untuk bahasa Jerman dll.

Salin strings.xml dan navigation.xml dari mobile/src/main/res/values ke direktori baru. Sekarang Anda dapat menerjemahkan teks atau menggunakan tautan URL yang berbeda untuk bahasa tertentu. Bahasa secara otomatis ditentukan oleh pengaturan perangkat sistem. Jika tidak ada kecocokan dengan bahasa values-xx, bahasa default di mobile/src/main/res/values dipilih. Selengkapnya https://developer.android.com/guide/topics/resources/localization

18. Deep Links

Aplikasi mendukung tautan dalam sederhana yang ditentukan di mobile/src/main/AndroidManifest.xml sebagai filter. Tautan memiliki format ini: http://host/pathPattern atau https://host/pathPattern.
  • Buka mobile/src/main/res/values/strings.xml
  • Ubah app_deep_link_host dan app_deep_link_path sesuai domain Anda

Atribut pathPattern menentukan jalur lengkap yang cocok dengan jalur lengkap di objek Intent. Ini dapat berisi wildcard asterisk *yang cocok dengan urutan 0 hingga banyak kemunculan karakter sebelumnya. Tanda titik yang diikuti oleh tanda bintang .* cocok dengan urutan 0 hingga banyak karakter.

19. Mengunggah File

Aplikasi mendukung pengunggahan file dari penyimpanan atau kamera. Pemilih file memerlukan izin untuk mengakses penyimpanan. Permintaan izin ditampilkan ketika beberapa file dipilih. Jika pengguna memutuskan untuk menolak izin, unggahan file tidak akan berfungsi.

Ada bug yang diketahui di Android 4.4 sehingga unggahan mungkin tidak berfungsi dengan baik pada versi Android ini. Lihat Pelacak Masalah Android resmi untuk info lanjut https://issuetracker.google.com/issues/36983532

20. Video dalam HTML

Aplikasi mendukung video HTML5, YouTube, Vimeo, JW Player, dll. Dan dalam mode layar penuh.

21. Antivirus False Positive

Beberapa program antivirus mungkin menganggap aplikasi ini berpotensi berbahaya. Salah satu alasannya mungkin menggunakan JavaScript. Jika aplikasi Anda terdeteksi berbahaya, Anda harus menambahkannya ke daftar putih antivirus untuk menghindari masalah ini. Biasanya Anda harus mengunggah file APK. Anda dapat melaporkan disini:

Menambahkan tombol di action bar (sebelah tombol share)

Anda dapat mengubah menu di bilah tindakan dengan mengedit file res/menu/fragment_main.xml. Maka harus menjalankan beberapa tindakan jika tombol menu ditekan. Anda dapat melakukannya dalam metode onOptionsItemSelected() di dalam file MainFragment.java. Lihat artikel ini untuk info lebih lanjut https://developer.android.com/training/basics/actionbar/adding-buttons.html

BUILD DAN MENERBITKAN APLIKASI WEBVIEW PRO

Bagian ini menjelaskan cara membuat file APK/AAB (Android App Bundle) menggunakan Gradle dan menyiapkan aplikasi untuk dipublikasikan. Android Studio menggunakan Gradle untuk membangun aplikasi Android.

Menerbitkan aplikasi dalam format APK lebih sederhana. AAB (Android App Bundle) adalah format baru yang mendukung pengiriman dinamis, tetapi menunda pembuatan dan penandatanganan APK ke Google Play. Ini membutuhkan penyiapan tambahan penandatanganan keystore di Google Play.

Anda tidak perlu menginstal Gradle di sistem Anda, karena ada Gradle Wrapper. Wrapper adalah script batch di Windows, dan skrip shell untuk sistem operasi lain. Saat Anda memulai build Gradle melalui Wrapper, Gradle akan otomatis diunduh dan digunakan untuk menjalankan build.

Build dan Rilis di Terminal

  1. Buka proyek di Android Studio.
  2. Buka file konfigurasi mobile/src/main/java/id/mcproject/webviewpro/WebViewAppConfig.java
  • Periksa apakah semuanya sudah diatur dengan benar.
  • Buka script build utama di mobile/build.gradle dan periksa value dari versi nya.
  • Jalankan gradlew assemble untuk APK atau gradlew bundle untuk AAB di terminal Android Studio. Pastikan Anda menjalankan perintah dari direktori root proyek.
Setelah build selesai, file APK/AAB harus tersedia di direktori mobile/build/outputs/apk/release atau mobile/build/outputs/bundle/release.

Build dan Rilis tanpa Terminal

Anda juga dapat membuat file APK/AAB melalui:
  1. Buka proyek di Android Studio.
  2. Menu Utama -> Build -> Generate Signed Bundle / APK
  3. Jika Anda ingin melakukannya dengan cara ini, cukup pilih keystore Anda, masukkan alias Anda, kata sandi dan generate file
  4. Setelah build selesai, file APK/AAB harus tersedia di direktori mobile/release

Catatan: Anda juga memerlukan file “local.properties” untuk menyetel lokasi SDK dengan cara yang sama seperti yang diperlukan SDK yang ada, menggunakan properti “sdk.dir”. Contoh "local.properties" di Windows: sdk.dir=C:\\adt-bundle-windows\\sdk. Atau, Anda dapat mengatur variabel environment yang disebut "ANDROID_HOME". Android Studio akan menanganinya.

Catatan: Command gradlew assemble membangun keduanya, debug dan rilis APK.
  • Anda dapat menggunakan gradlew assembleDebug untuk membangun APK debug.
  • Anda dapat menggunakan gradlew assembleRelease untuk membangun APK rilis.
  • Debug APK ditandatangani oleh keystore debug.
  • Rilis APK ditandatangani oleh keystore Anda sendiri, disimpan di direktori /extras/keystore.
Hal yang sama berlaku untuk perintah gradlew bundle yang menghasilkan AAB.

Proses Penandatanganan atau Apk Signing

Kata sandi Keystore dimuat secara otomatis dari file properti selama membuat file APK/AAB rilis. Jalur ke file ini ditentukan di properti "keystore.properties" di file "gradle.properties".

Upload Apk/Abb Aplikasi ke Playstore

Video tutorial daftar akun google developer dan cara upload apk/abb ke playstore silakan simak disini:

PENGATURAN VERSI DAN UPDATE WEBVIEW PRO

Buka script build utama di folder mobile/build.gradle. Ada 4 konstanta penting untuk mendefinisikan kode versi dan nama versi.
  • VERSION_MAJOR
  • VERSION_MINOR
  • VERSION_PATCH
  • VERSION_BUILD
Catatan: perlu diingat bahwa versi harus inkremental. Selengkapnya di https://developer.android.com/studio/publish/versioning.

Setelah mengatur versi atau mengupdate versi, Anda bisa lakukan hal yang sama pada panduan-panduan sebelumnya, yaitu build ulang dengan keystore dan dapatkan file APK/AAB untuk mengupdate rilis di Playstore.


INFO PROJECT WEBVIEW

  • Nama: Aplikasi Webview Android
  • Dikembangkan dengan: Android Studio & Gradle
  • Dukungan untuk: Android 4.4 keatas
  • Basis Webview: Chromium
  • Iklan: Google AdMob
  • Notifikasi: Firebase & OneSignal
  • Source Code: Android Webview Pro
Diposting 07 Feb 2022, 14:01 PM. Ditulis oleh MC Project. Kategori Dokumentasi.