Jadi kami memiliki tampilan detail pada dimensi, orientasi, dan render berbagai gaya dan tata letak berdasarkan lebar
dan tinggi yang tersedia dan juga bagaimana bereaksi terhadap perubahan lebar dan tinggi ketika Anda
memutar perangkat, misalnya, hal-hal yang sangat penting.
Mari sekarang kita lihat bagaimana Anda dapat membuat gaya atau tata letak yang berbeda atau apa pun
yang Anda inginkan berdasarkan platform yang Anda jalankan.
Saat ini kami pada dasarnya memiliki aplikasi yang identik di iOS dan Android dengan satu pengecualian dan itulah tombol
kami di sini.
Tombol-tombolnya terlihat berbeda karena komponen tombol yang kami gunakan adalah komponen yang dimasukkan ke React Native dan
itu adalah salah satu yang sangat langka, sebenarnya satu-satunya komponen React Native yang menawarkan penyesuaian secara otomatis berdasarkan platform yang dijalankan oleh
aplikasi Anda, tidak lain komponen benar-benar melakukan itu tetapi
tentu saja, Anda dapat menulis kode untuk menyesuaikan gaya Anda, tata letak logika, apa pun yang Anda inginkan berdasarkan
pada platform yang Anda jalankan. Untuk melihat contoh, mari kita pergi ke
komponen tajuk kami dan di sana, mari kita bekerja pada
cara kami menyajikan tajuk ini. Di Android kita mungkin
memiliki warna latar belakang ini dan kemudian teks di depannya, di iOS
kita mungkin ingin memiliki warna latar belakang putih dan hanya memiliki batas tipis di bagian bawah
dan alih-alih memiliki teks dalam warna
utama kita, yang akan menjadi Terlihat lebih khas iOS.
Sekarang untuk mencari tahu di platform mana Anda menjalankan, React Native telah Anda liput, ia memiliki
objek platform di mana dimensi membantu Anda mengetahui dimensi perangkat yang Anda jalankan,
platform membantu Anda mengetahui platform perangkat Anda sedang berlari.
Jadi sekarang di sini dalam gaya yang Anda buat,
kita bisa membuat warna latar belakang yang berbeda berdasarkan itu.
Kami dapat menggunakan platform dan sekarang di sana, Anda memiliki beberapa properti
yang dapat Anda gunakan dan misalnya Anda memiliki properti OS dan OS pada dasarnya adalah sistem operasi dan itu adalah salah satu
nilai yang
Anda lihat di sini, yang paling penting iOS atau Android.
Jadi di sini kita dapat memeriksa apakah itu sama dengan katakanlah Android dan dalam hal ini, saya mengatur
warna latar belakang saya
ke warna primer tetapi jika itu bukan Android dan karena itu jika iOS, saya mengatur ini untuk katakanlah putih.
Sekarang jika kita melakukan itu dan kita simpan ini, kita melihat tajuk putih di sini di perangkat iOS dan tajuk
berwarna di perangkat Android.
Sekarang tentu saja Anda tidak perlu mengatur pendengar apa pun pada platform dan itu juga tidak menawarkan fungsi
seperti itu karena platform tidak dapat berubah saat aplikasi sedang berjalan, itu adalah sistem operasi yang
sama sepanjang waktu tentu saja.
Sekarang mari kita selesaikan penataan untuk iOS.
Saya katakan saya ingin memiliki batas tipis di bagian bawah, jadi kita bisa menambahkan
warna batas bawah dan memeriksa platform dan jika sistem operasi ada yang sama dengan iOS, maka saya ingin
mengatur warna batas bawah untuk mengatakan ini keabu-abuan warna, kalau tidak saya akan
mengirimnya ke putih atau ke transparan sehingga kita tidak bisa melihatnya di Android dan menambahkan batas bawah dengan
katakanlah dan di sana kami juga melakukan pengecekan untuk iOS katakanlah satu piksel pada iOS dan nol di Android.
Jadi sekarang kita seharusnya tidak melihat apa pun di Android tetapi kita memiliki batasan tipis di sini di iOS.
Last but not least, mari mewarnai teks dengan pergi ke teks judul di sini dan teks judul memang bergabung dalam gaya apa pun yang kita atur
pada prop gaya, jadi di sini pada teks
judul, kita dapat menambahkan prop gaya dan menunjuk pada gaya. beri judul di sini atau apa pun
yang ingin Anda beri nama dan tambahkan objek gaya judul seperti itu di sini dalam stylesheet
kami tempat kami mengatur warna yang merupakan warna teks juga berdasarkan pada platform.
Jika itu iOS, katakanlah kita mengatur ini ke warna. primer dan sebaliknya, mari kita atur menjadi putih, sebelumnya
hitam,
mari kita atur menjadi putih.
Sekarang kami memiliki judul putih di sini di Android tetapi judul berwarna di sini di iOS dan ini adalah betapa mudahnya Anda dapat
mengatur gaya yang berbeda berdasarkan platform yang Anda jalankan seperti yang
Anda lihat.