Untuk halaman yang berisi informasi lebih banyak yang melampaui tinggi layar, atau memerlukan perjalanan yang lebih panjang dan imersif, gunakan tampilan scroll.
Komponen tata letak scroll preset
Dialog dengan tumpukan tombol bawah
Dialog dengan tumpukan tombol bawah
Dialog dengan tombol ganda di bagian bawah
Contoh tata letak scrolling kustom
Layar aplikasi yang dapat di-scroll tidak terbatas pada komponen yang ditetapkan, tetapi dapat menggabungkan elemen untuk membuat tata letak yang Anda inginkan. Perhatikan panjang layar yang dapat di-scroll, serta penggunaan padding dan margin responsif (persentase), untuk memverifikasi bahwa komponen beradaptasi dengan ukuran layar yang tersedia.
Konten tambahan di layar yang lebih besar
Daftar tombol: Tombol ikon dengan ukuran ikon 26 dp
Daftar tombol: Tombol aplikasi dengan ukuran ikon 32 dp
Daftar tombol: Tombol aplikasi dengan ukuran ikon 36 dp
Daftar tombol dengan tombol aktif/nonaktif
Daftar campuran dengan elemen satu baris
Daftar campuran dengan elemen multi-baris
Daftar kartu dengan kartu aplikasi
Daftar kartu dengan kartu judul
Daftar kartu dengan kartu kustom
Daftar teks
Perilaku responsif dan adaptif
Semua komponen di library Compose otomatis menyesuaikan dengan ukuran layar yang lebih lebar, serta mendapatkan lebar dan tinggi. Tampilan scroll yang menggunakan praktik desain responsif biasanya disesuaikan dengan berbagai ukuran layar. Namun, dalam beberapa kasus khusus, Anda dapat menggunakan titik henti untuk mengganti dimensi dan menambah tata letak yang memperluas fungsi, meningkatkan keterbacaan, atau membuat konten lebih sesuai di layar.
Untuk memverifikasi bahwa parameter responsif ditentukan dengan benar, gunakan checklist berikut:
- Terapkan margin atas, bawah, dan samping yang direkomendasikan.
- Tentukan margin luar dalam nilai persentase untuk mencegah pemangkasan di awal dan akhir penampung yang dapat di-scroll.
- Terapkan margin dalam nilai DP tetap di antara elemen UI.
- 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.
