Tampilan yang tidak dapat di-scroll berfokus pada informasi yang mudah dilihat dan menawarkan nilai kepada pengguna dengan sedikit atau tanpa interaksi. Oleh karena itu, akan sulit untuk membangun perilaku responsif ke dalam tata letak ini.
Komponen tata letak non-scrolling preset
Dialog
Dialog adalah overlay sementara yang menempati seluruh layar. Hal ini memungkinkan pengguna melakukan satu tindakan.
- Dialog memfokuskan perhatian Anda untuk memverifikasi bahwa kontennya telah ditangani.
- Dialog harus langsung dalam menyampaikan informasi dan ditujukan untuk menyelesaikan tugas.
- Dialog harus muncul sebagai respons terhadap tugas atau tindakan pengguna, dengan informasi yang relevan atau kontekstual.
Overlay konfirmasi
Overlay konfirmasi menampilkan pesan konfirmasi kepada pengguna dalam jangka waktu yang singkat. Gunakan komponen ini untuk menarik perhatian pengguna setelah sebuah tindakan dieksekusi.
Buka di ponsel
Overlay buka di ponsel dipicu saat pengguna memilih untuk melanjutkan perjalanan mereka di ponsel. Overlay memiliki indikator progres dan memberi tahu pengguna kapan harus memeriksa ponsel mereka.
Stepper
Stepper memberikan pengalaman kontrol layar penuh yang memungkinkan pengguna membuat pilihan dari rentang nilai. Pengguna dapat mengontrol interaksi menggunakan tombol atau kenop, dan tingkat spesifik ditampilkan menggunakan indikator tingkat melengkung.
Pemilih waktu
Pemilih memungkinkan pengguna memilih di antara sejumlah item terbatas di bagian yang dapat di-scroll. Pemilih Waktu memiliki hingga tiga kolom, bergantung pada apakah detik tersedia atau apakah jam menggunakan format 12 jam atau 24 jam. Pengguna berinteraksi dengan setiap kolom satu per satu, membuat pilihan dengan membiarkan angka tetap fokus sebelum melanjutkan.
Pemilih tanggal
Pemilih memungkinkan pengguna memilih di antara sejumlah item terbatas di bagian yang dapat di-scroll. Pemilih Tanggal memiliki hingga tiga kolom, yang memiliki urutan yang dapat diubah antara tanggal, waktu, dan tahun, bergantung pada kasus penggunaannya. Pemilih Tanggal memerlukan string konten yang lebih panjang, sehingga hanya satu kolom yang terlihat dalam satu waktu, yang memberikan petunjuk tentang apa yang ada di kiri atau kanan. Pengguna berinteraksi dengan setiap kolom satu per satu, membuat pilihan dengan membiarkan angka dalam fokus sebelum melanjutkan.
Contoh tata letak tidak dapat di-scroll kustom
Layar aplikasi yang tidak dapat di-scroll tidak terbatas pada komponen yang ditetapkan. Anda dapat menggabungkan kombinasi elemen untuk membuat tata letak yang Anda inginkan.
Anda harus memperhatikan ruang terbatas pada layar yang tidak dapat di-scroll dan penggunaan padding serta margin responsif (persentase) untuk menggunakan ruang layar yang tersedia. Anda juga dapat mempertimbangkan untuk menerapkan titik henti di 225 dp untuk memperkenalkan konten tambahan atau membuat konten yang ada lebih mudah dilihat saat berada di ukuran layar yang lebih besar.
Maps
Overlay darurat
Peringatan darurat
Perilaku responsif dan adaptif
Semua komponen di library Compose akan otomatis menyesuaikan dengan ukuran layar yang lebih lebar serta mendapatkan lebar dan tinggi. Khusus untuk tampilan ini, penggunaan titik henti sementara dapat memberikan pengalaman yang sangat kaya dan berharga bagi semua pengguna.
Untuk banyak tombol, kartu, dan margin UI Anda, rentangkan dan isi ruang untuk berbagai ukuran layar guna memanfaatkan ruang yang tersedia di UI dan juga membuat tata letak yang seimbang.
Gunakan checklist berikut untuk memverifikasi bahwa parameter responsif telah ditentukan dengan benar:
- Buat tata letak fleksibel yang terlihat wajar di semua ukuran layar.
- Terapkan margin atas, bawah, dan samping yang direkomendasikan.
- Tentukan margin dalam nilai persentase di tempat konten mungkin terpotong.
- Manfaatkan batasan tata letak agar elemen dapat memanfaatkan ruang dalam layar sebaik mungkin dan menjaga keseimbangan di berbagai ukuran perangkat.
- Sesuaikan Teks Waktu jika digunakan, tetapi jangan tumpang-tindih dengan bagian atas halaman.
- Pertimbangkan untuk menggunakan tombol yang menempel di tepi untuk memanfaatkan lebih banyak ruang terbatas.
- Pertimbangkan untuk menerapkan titik henti sementara pada 225dp untuk memperkenalkan konten tambahan atau membuat konten yang ada lebih mudah dilihat saat berada di ukuran layar yang lebih besar.
Beberapa perjalanan halaman yang tidak dapat di-scroll menggunakan penomoran halaman
Dalam skenario saat pengalaman memerlukan lebih banyak konten, tetapi ingin mempertahankan tata letak tanpa scroll, pertimbangkan tata letak multi-halaman dengan penomoran halaman vertikal atau horizontal.
