Jadi, kembali ke kode kita, di sini di layar mulai permainan yang merupakan layar pertama yang
kita lihat, kita sudah bisa melihat bahwa dua tombol kita - reset dan konfirmasi juga tidak diposisikan begitu
hebat di wadah tombol kita.
Jadi mari kita lihat styling yang kita atur di sana dan apa yang bisa kita lihat
di sini adalah bahwa kita menetapkan lebar
100% pada wadah tombol tapi apa ukuran ini merujuk?
Nah ukuran ini pada tampilan ini di sini, tentu saja jika kita mengatakan 100%, pada akhirnya merujuk pada
induk di sekitarnya yang dalam hal ini adalah kartu
ini, wadah input ini dan pada wadah input ini, kita benar-benar menetapkan lebar 300 dan bahwa hanya terlalu kecil, dikombinasikan dengan tombol kami
yang kami memiliki lebar tetap 100, kami mendapatkan tampilan ini yang tidak kita inginkan, yang dengan cara
kita dapat melihat apakah kita mengubah sesuatu sehingga aplikasi kita membangun kembali dan karena itu restart,
maka kita melihat layar mulai lagi, ini
tampilan yang tidak kita inginkan.
Jadi apa yang kita inginkan di sini?
Mungkin kita tidak menginginkan lebar 300 di sini tetapi lebar lebih fleksibel. Kami menetapkan lebar maks 80%, yang bisa kami lakukan
di sini adalah kami selalu bisa mengatur lebar katakanlah 80 atau 90% dan cukup pastikan bahwa ini harus selalu memiliki lebar
minimum 300, sehingga kami selalu memiliki setidaknya ini banyak piksel jika kita memiliki perangkat kecil di mana 80%
akan kurang dari itu dan bahwa kita memiliki setidaknya ini dan sekarang
ini akan terlihat lebih baik di sini.
Mengapa?
Karena sekarang kami memiliki 80% sebagai default dan
sebelumnya, kami memilikinya sebagai lebar maks.
Jadi sekarang dengan mengaturnya ke default, ini memastikan bahwa ini bukan batas kami, melainkan
ukuran standar kami, tetapi kami
juga mengatur bahwa kami ingin memiliki min minimum 300. Pada perangkat kecil ini, lebar minimum
ini mengabaikan lebar default kami karena 80% sebenarnya akan kurang dari 300 pada
perangkat kecil ini.
Sekarang tentu saja, Anda dapat memiliki perangkat yang lebih kecil di mana aturan ini namun mengarah
ke masalah di mana min lebar 300 pada dasarnya berarti bahwa perangkat Anda lebih kecil dari itu, itu tidak cukup lebar
dan oleh karena itu, wadah Anda akan melampaui batas kami. layar.
Jadi ini mungkin masih bukan aturan yang sempurna tetapi tentu saja lebih baik seperti yang bisa kita lihat di sini karena pada
layar yang lebih besar, ini masih terlihat bagus di sini di iPhone, di layar yang lebih kecil, ini sekarang
juga terlihat bagus.
Sekarang untuk memastikan bahwa kami tidak pernah meninggalkan batas kami, kami juga dapat mengatur lebar maks dan menetapkan ini untuk
katakanlah 95% sehingga kami memiliki setidaknya sedikit jarak di sekitarnya.
Sekarang kami memastikan bahwa wadah kami tidak akan pernah keluar dari layar kami tetapi ia mencoba mengambil 80% tetapi jika kami memiliki
layar yang sangat kecil, itu akan membutuhkan 300
tetapi sekali lagi, tidak pernah lebih dari 95% dari lebar yang tersedia.
Jadi sekarang kita cukup membuat aturan yang lebih fleksibel di sini yang bekerja pada berbagai perangkat yang lebih luas yang seperti yang Anda
tahu sedikit lebih baik di sini.