Halaman ini menjelaskan cara membuat alur untuk Panduan Pengaturan (Supply Wizard/SUW), membuat narasi, dan menyertakan langkah-langkah yang wajib dan opsional.
Anda dapat menyesuaikan layar-layar berikut:
| Kustomisasi terbatas: Modal konten | Kustomisasi yang diperlukan: Templat yang disediakan oleh Google |
|---|---|
| Persyaratan Layanan Google Masuk Google Google Gemini Google Play | Layar selamat datang Pemilihan bahasa Pengaturan konektivitas dan Wi-Fi Pembuatan profil (nama profil) Layar ringkasan Pengaturan perangkat Bluetooth Perlindungan profil (pengaturan penguncian profil) Layar pemuatan |
Sesuaikan model konten
Modal konten, atau komponen UI AppStyledView , berisi layar milik Google, termasuk modul masuk Google dan persetujuan layanan Google. Untuk membantu pengguna memahami bahwa mereka berinteraksi dengan Google, dan bukan produsen mobil, komponen modal hanya mendukung kustomisasi terbatas.
Untuk mencapai integrasi yang kohesif, Anda dapat menyesuaikan hal-hal berikut:
Bilah navigasi: Anda dapat memilih untuk menempatkan bilah navigasi di bagian atas modal atau di samping. Selain itu, Anda dapat menyesuaikan ikon navigasi (gambar, ukuran, warna, penempatan), latar belakang (gambar, opasitas, warna), lebar atau tinggi (tergantung pada penempatan).
Pengaturan modal: Lebar area konten harus lebih besar dari 1224 dp agar layar Google dapat ditampilkan dalam tata letak lanskap. Selain itu, Anda dapat menyesuaikan lebar, tinggi, penempatan di layar, sudut membulat, dan gaya batas modal. Overlay layar penuh disarankan jika margin yang cukup di sekitar modal tidak dapat dijamin.
Latar belakang modal: Gambar atau warna, transparansi.
Contoh kustomisasi modal konten
Anda dapat memilih untuk menggunakan templat yang disediakan Google sebagai bagian dari alur pengaturan. Jika Anda memutuskan untuk menggunakan opsi ini, Anda harus menyesuaikan layar-layar ini untuk menghindari perpaduan gaya UI.
Berikut adalah contoh kustomisasi modal konten pada Gambar 3 dan Gambar 4.
Sesuaikan layar yang disediakan Google
Anda dapat memilih untuk menggunakan templat yang disediakan Google sebagai bagian dari alur pengaturan. Jika Anda memutuskan untuk menggunakan opsi ini, Anda harus menyesuaikan layar-layar ini untuk menghindari perpaduan gaya UI.
Tampilan imersif versus tampilan non-imersif
Anda memiliki dua pilihan untuk menampilkan SuW:
Tampilan imersif: Tampilan ini menyembunyikan fitur-fitur yang tidak penting seperti bilah status dan antarmuka pengguna sistem. Gunakan tampilan imersif untuk meminimalkan gangguan.
Tampilan non-imersif: Tampilan ini memungkinkan pengguna untuk melihat fitur sistem seperti bilah status. Gunakan tampilan non-imersif hanya jika penting untuk menampilkan UI sistem. Jika Anda memilih untuk menggunakan tampilan ini, hindari tindakan yang dapat mengalihkan pengguna dari pengalaman pengaturan.
Sesuaikan tata letak lanskap
Elemen yang dapat disesuaikan dalam mode lanskap adalah sebagai berikut:
Tata letak dan latar belakang
- Bilah navigasi: Bilah navigasi berisi tombol kembali. Anda dapat menyesuaikan tata letak dan latar belakang bilah, serta ikon navigasi (gambar, ukuran, warna, dan penempatan), latar belakang (gambar, opasitas, warna), dan lebar.
- Action bar: Action bar adalah wadah yang terletak di bagian bawah halaman yang berisi tombol ajakan bertindak (call-to-action), yang secara default transparan. Anda dapat menyesuaikan tinggi dan padding bar, serta gambar, opasitas, dan warna latar belakang.
- Tata letak halaman: Rasio kolom dan margin halaman.
- Latar belakang halaman: Warna atau gambar latar belakang.
Komponen
- Gambar hero: Gambar, ukuran, dan penempatan.
- Menu tarik-turun: Font (jenis, ukuran, warna), ikon (gambar, ukuran, warna), dan garis pemisah.
- Tombol: Font (jenis, ukuran, warna), latar belakang (gambar, opasitas, warna), ukuran tombol (lebar, tinggi), penempatan, padding, sudut membulat (penataan gaya untuk tindakan utama dan sekunder, serta status tombol yang berbeda).
- Header halaman: Font (jenis, ukuran, dan warna), penempatan judul dan subjudul, teks, dan ikon halaman (apakah akan menyertakan ikon, serta gambar, ukuran, dan warna ikon).
- Daftar: Font (jenis, ukuran, dan warna), ikon (gambar, ukuran, dan warna, ikon Google tidak dapat disesuaikan), penempatan, padding, tinggi item daftar, dan garis pemisah. Untuk mengubah string, Anda harus meninjau dengan Google.
Layar pemuatan
- Animasi: (Tidak ditentukan) atau gambar, ukuran, penempatan.
- Teks: Font (jenis, ukuran, dan warna), penempatan, dan teks.
Contoh tata letak lanskap yang disesuaikan
Salah satu cara untuk menyesuaikan layar selamat datang atau ringkasan adalah dengan menggunakan templat yang disediakan oleh Google.
Sesuaikan mode potret
Berikut adalah elemen-elemen yang dapat disesuaikan dalam mode potret.
Tata letak dan latar belakang
- Bilah navigasi: Bilah navigasi berisi tombol kembali. Anda dapat menyesuaikan tata letak dan latar belakang bilah, serta ikon navigasi (gambar, ukuran, warna, dan penempatan), latar belakang (gambar, opasitas, warna), dan lebar.
- Action bar: Action bar adalah wadah yang terletak di bagian bawah halaman yang berisi tombol ajakan bertindak (call-to-action), yang secara default transparan. Anda dapat menyesuaikan tinggi dan padding bar, serta gambar, opasitas, dan warna latar belakang.
- Tata letak halaman: Margin halaman.
- Latar Belakang Halaman: Warna atau gambar latar belakang.
Komponen
- Gambar hero: Gambar, ukuran, penempatan.
- Menu tarik-turun: Font (jenis, ukuran, warna), ikon (gambar, ukuran, warna), garis pemisah.
- Tombol: Font (jenis, ukuran, warna), latar belakang (gambar, opasitas, warna), ukuran tombol (lebar, tinggi), penempatan, padding, sudut membulat. Anda harus membedakan gaya untuk tindakan utama dan sekunder, serta status tombol yang berbeda.
- Header halaman: Font (jenis, ukuran, warna), penempatan judul dan subjudul, teks, ikon halaman (apakah akan menyertakan ikon, dan gambar ikon, ukuran, dan warna).
- Daftar: Font (jenis, ukuran, dan warna), ikon (gambar, ukuran, dan warna, ikon Google tidak dapat disesuaikan), penempatan, padding, tinggi item daftar, dan garis pemisah. Untuk mengubah string, Anda harus meninjau dengan Google.
Layar pemuatan
- Animasi: Animasi (tidak tentu) atau gambar, ukuran, penempatan.
- Teks: Font (jenis, ukuran, warna), penempatan, teks.
Contoh tata letak potret yang disesuaikan