1
00:00:02,230 --> 00:00:04,920
Namun kadang-kadang, Anda tidak bisa mendapatkan tata

2
00:00:04,930 --> 00:00:10,720
letak yang benar dengan persentase lebar dan piksel hardcode seperti ini, kadang-kadang Anda benar-benar perlu tahu

3
00:00:10,720 --> 00:00:12,210
berapa banyak piksel

4
00:00:12,340 --> 00:00:18,130
yang Anda miliki, misalnya di sini pada tombol di mana kami menetapkan lebar 100, kami menetapkan

5
00:00:18,130 --> 00:00:19,990
100, apa pun ukuran perangkatnya.

6
00:00:19,990 --> 00:00:24,460
Sekarang sebenarnya, kita tahu bahwa kita ingin memiliki dua tombol duduk bersebelahan.

7
00:00:24,550 --> 00:00:31,960
Jadi yang dapat kita lakukan adalah kita cukup memastikan bahwa kita mengambil lebar tombol yang selalu pas di layar tidak peduli seberapa

8
00:00:31,960 --> 00:00:33,830
kecil itu dan untuk itu,

9
00:00:33,850 --> 00:00:39,460
kita perlu mengetahui berapa banyak piksel yang kita miliki dengan lebar dan itu adalah sesuatu yang kita

10
00:00:39,460 --> 00:00:44,170
bisa cari tahu dengan bantuan React Native. Di sana dari Bereaksi Asli,

11
00:00:44,170 --> 00:00:48,880
Anda dapat mengimpor objek dimensi di sini, dimensi adalah nama.

12
00:00:48,940 --> 00:00:55,720
Sekarang ini bukan komponen yang Anda gunakan, melainkan ini adalah objek yang memungkinkan Anda mengetahui

13
00:00:55,810 --> 00:00:58,380
berapa lebar yang Anda miliki.

14
00:00:58,420 --> 00:01:04,270
Sekarang kita dapat menggunakan ini misalnya di sana di mana kita mengatur lebar tombol kita, daripada mengaturnya

15
00:01:04,780 --> 00:01:07,080
seperti ini, kita dapat mengatur lebar

16
00:01:07,210 --> 00:01:12,850
kita ke dimensi dan kemudian ada metode get di mana Anda bisa mendapatkan dimensi jendela.

17
00:01:12,850 --> 00:01:14,440
Anda juga dapat

18
00:01:14,440 --> 00:01:21,700
memperolehnya dari layar, perbedaan antara jendela dan layar hanya penting pada Android di mana dengan jendela, tinggi status bar akan

19
00:01:21,700 --> 00:01:23,640
dikeluarkan dari perhitungan dan oleh

20
00:01:23,740 --> 00:01:26,110
karena itu ini akan menjadi bagian layar

21
00:01:26,260 --> 00:01:28,720
di mana konten Anda akan tinggal di.

22
00:01:28,780 --> 00:01:32,130
Jadi Anda biasanya harus menggunakan jendela di sini karena di

23
00:01:32,130 --> 00:01:38,800
iOS itu tidak masalah, di Android dijamin menjadi bagian dari layar yang benar-benar duduk di UI Anda tanpa bilah status

24
00:01:38,800 --> 00:01:40,110
di bagian atas.

25
00:01:40,180 --> 00:01:46,390
Jadi biasanya, Anda mungkin ingin menggunakan jendela di sini untuk mendapatkan ruang nyata yang tersedia untuk tata letak Anda, dimensi

26
00:01:46,390 --> 00:01:52,600
nyata yang dapat Anda gunakan untuk tata letak Anda. Sekarang ini memberi Anda objek di mana Anda bisa

27
00:01:52,750 --> 00:01:56,470
mendapatkan beberapa properti, empat tepatnya - skala font yang diatur pengguna,

28
00:01:56,470 --> 00:02:01,540
jadi misalnya jika pengguna ingin memiliki font yang lebih besar, maka Anda bisa mendapatkan pengganda

29
00:02:01,540 --> 00:02:03,560
di sini dengan skala font tetapi

30
00:02:03,670 --> 00:02:09,610
yang paling penting, Anda mendapatkan lebar dan tinggi dan jika kami mendapatkan lebar di sini, maka kami

31
00:02:09,610 --> 00:02:11,050
mendapatkan lebar keseluruhan

32
00:02:11,050 --> 00:02:12,580
perangkat aplikasi ini berjalan.

33
00:02:12,580 --> 00:02:19,390
Sekarang kita tahu bahwa kita ingin memeras setidaknya dua tombol ke dalam perangkat ini di sini,

34
00:02:19,390 --> 00:02:25,730
jadi kita bisa membaginya menjadi dua, jadi sekarang setiap tombol setengah selebar perangkat.

35
00:02:25,730 --> 00:02:30,190
Sekarang jika kita menyimpan ini, kita tidak benar-benar mendapatkan tampilan yang kita inginkan karena

36
00:02:30,190 --> 00:02:35,620
tentu saja, itu terlalu besar tetapi jika kita membaginya dengan tiga misalnya, maka ini sudah terlihat lebih

37
00:02:35,620 --> 00:02:37,060
baik di layar kecil,

38
00:02:37,060 --> 00:02:42,520
bukan pada yang besar tetapi bagaimana kalau empat? Jika kami mengambil empat, maka kami memiliki banyak

39
00:02:42,520 --> 00:02:49,690
ruang untuk semua ruang lain yang kami butuhkan seperti jarak di sekitar wadah kami dan kami memastikan bahwa tombol kami selalu menghargai ukuran perangkat.

40
00:02:49,720 --> 00:02:55,510
Sekarang tentu saja di sini, Anda bisa mencapai sesuatu yang serupa dengan menetapkan lebar ke persentase, seperti 40%

41
00:02:55,510 --> 00:03:00,760
di sini tapi saya juga ingin memperkenalkan dimensi API di sini yang akan kami gunakan

42
00:03:00,760 --> 00:03:01,550
nanti juga.

43
00:03:01,570 --> 00:03:07,480
Ini adalah API yang bagus untuk mengetahui berapa banyak piksel yang Anda miliki pada lebar dan

44
00:03:07,870 --> 00:03:09,140
ketinggian pada

45
00:03:09,190 --> 00:03:15,670
perangkat atau berjalan dan itu penting, di mana persentase di sini selalu mengacu pada tampilan induk langsung dan

46
00:03:15,670 --> 00:03:17,560
tidak selalu dengan lebar yang

47
00:03:17,650 --> 00:03:20,880
tersedia dari perangkat , hanya itu yang terjadi pada

48
00:03:20,890 --> 00:03:28,330
orangtua paling atas, jadi pada tampilan teratas yang Anda render. Jendela mendapatkan dimensi selalu memberi Anda dimensi untuk seluruh perangkat,

49
00:03:28,330 --> 00:03:30,750
di mana pun Anda menggunakannya.

50
00:03:30,760 --> 00:03:38,480
Jadi lebar di sini selalu adalah lebar layar kita di perangkat dan tidak pernah dari orang tua atau apa pun.

51
00:03:38,560 --> 00:03:43,390
Jadi ini bisa sangat berguna jika Anda ingin gaya sesuatu dengan cara tertentu atau ukuran sesuatu

52
00:03:43,390 --> 00:03:48,100
dengan cara tertentu karena ini memberi tahu Anda berapa banyak lebar yang Anda miliki.