1
00:00:02,230 --> 00:00:09,790
Jadi saya ingin memulai dengan beberapa penyesuaian font di tab saya di sini, di header dan juga teks

2
00:00:09,970 --> 00:00:15,940
di sini di semua resep saya. Saya ingin memastikan bahwa di mana-mana, saya menggunakan font yang tepat,

3
00:00:15,940 --> 00:00:19,930
font khusus saya sendiri dan terutama di sini, di header, di tab, kami belum benar-benar memastikan ini.

4
00:00:20,050 --> 00:00:22,970
Tentu saja, itu relatif mudah

5
00:00:22,990 --> 00:00:31,040
untuk memastikan itu dan mari kita mulai dengan tajuk. Header umumnya ditata, seperti warna latar belakang, dengan opsi navigasi default

6
00:00:31,040 --> 00:00:34,200
kami yang selalu kami siapkan di stack navigator

7
00:00:34,210 --> 00:00:40,640
tepat, opsi navigasi default di sini memungkinkan kami untuk mendesain header dan misalnya, memberi header secara umum

8
00:00:40,640 --> 00:00:43,390
gaya dan tambahkan warna latar belakang.

9
00:00:43,470 --> 00:00:50,750
Sekarang penting untuk dikenali di sini adalah bahwa gaya tajuk benar-benar hanya menargetkan kotak, latar belakang

10
00:00:50,750 --> 00:00:59,540
untuk mengatakan, sehingga wadah di mana item tindakan, tombol kembali dan judul ini duduk, judul itu sendiri tidak dapat

11
00:00:59,660 --> 00:01:02,390
ditargetkan dengan gaya tajuk tetapi

12
00:01:02,390 --> 00:01:08,420
tentu saja kami mendapatkan alternatif untuk itu. Selain gaya tajuk tempat kami dapat menata wadah

13
00:01:08,420 --> 00:01:14,300
tajuk itu, kami juga mendapat gaya tajuk tajuk dan yang secara tidak terduga menargetkan komponen teks tempat tajuk

14
00:01:14,300 --> 00:01:20,420
tajuk kami disajikan dan di sana kami dapat menatanya seperti kami dapat mendesain elemen teks dalam React Native, misalnya

15
00:01:20,420 --> 00:01:23,960
dengan menambahkan keluarga font sans terbuka, sekali lagi saya menggunakan versi

16
00:01:23,960 --> 00:01:27,280
yang tidak berani sehingga kita dapat dengan cepat melihat perbedaannya.

17
00:01:27,320 --> 00:01:35,560
Ini jelas tidak berani lagi saya kira, cukup jelas untuk dilihat, terutama di sini di iOS dan sekarang jika saya

18
00:01:35,560 --> 00:01:40,240
mengatur ini menjadi tebal, saya memastikan bahwa saya menggunakan gaya yang

19
00:01:40,240 --> 00:01:46,280
tepat ini di iOS dan Android. Sekarang untuk teks belakang di sini, kita juga

20
00:01:46,540 --> 00:01:53,380
dapat menimpa default itu yang merupakan font sistem default dengan mengatur header style title, itu pengaturan terpisah yang dapat

21
00:01:53,380 --> 00:01:53,930
kita

22
00:01:53,950 --> 00:01:59,110
atur di sana-sini, kita juga dapat mengatur keluarga font untuk katakanlah open sans, bukan

23
00:01:59,140 --> 00:02:01,350
versi bold, saya tidak ingin

24
00:02:01,360 --> 00:02:07,600
memilikinya dalam gaya bold tetapi saya ingin memilikinya dalam font saya sendiri dan sekarang ini seharusnya open

25
00:02:07,600 --> 00:02:13,470
sans di sini dan menggunakan font saya sendiri. Di Android tentu saja, ini tidak berpengaruh karena di sana

26
00:02:13,470 --> 00:02:17,170
kami tidak memiliki teks kembali. Jadi itu satu

27
00:02:17,190 --> 00:02:24,660
hal, itu tajuk, untuk tab itu sangat mirip. Di sana kita dapat pergi ke navigator tab kita yang

28
00:02:24,660 --> 00:02:25,940
kita buat, seperti

29
00:02:25,950 --> 00:02:26,700
navigator

30
00:02:26,880 --> 00:02:33,390
tab bawah bahan dan ini tentu saja memiliki tabScreenConfig kita dan kemudian objek kedua ini di mana

31
00:02:33,390 --> 00:02:34,440
kita mengkonfigurasi

32
00:02:34,440 --> 00:02:38,880
navigator itu sendiri dan seperti biasa dalam Bereaksi navigasi, itu adalah objek

33
00:02:38,880 --> 00:02:44,270
kedua di mana kita dapat mengontrol tampilan dan nuansa umum dari hal-hal khusus navigator, seperti

34
00:02:44,280 --> 00:02:52,280
dalam kasus navigator tab, warna ikon tab, warna bar, warna warna atau juga gaya label dan memang di sini pada opsi

35
00:02:52,280 --> 00:02:56,330
tab bar untuk navigator tab bawah, kita dapat menambahkan gaya label

36
00:02:56,330 --> 00:02:59,000
dan sekali lagi, ini menargetkan komponen teks

37
00:02:59,000 --> 00:03:03,010
yang memegang label kita, kita dapat menambahkan keluarga font di

38
00:03:03,140 --> 00:03:09,230
sini dari OpenSans-Bold sehingga kita dapat dengan jelas melihat perbedaannya, jika ini dimuat kembali, sekarang ini

39
00:03:09,230 --> 00:03:12,800
jelas adalah beberapa teks tebal. Ini sebenarnya tidak terlihat terlalu buruk, jadi saya

40
00:03:12,800 --> 00:03:14,510
pikir kita bisa menyimpan ini, tetapi tentu

41
00:03:14,720 --> 00:03:18,920
saja Anda juga dapat mengaturnya untuk hanya membuka sans jika Anda ingin versi yang lebih tipis tetapi sekarang

42
00:03:19,010 --> 00:03:22,320
saya akan menggunakan font kita sendiri. Sekarang untuk Android,

43
00:03:22,320 --> 00:03:29,600
di sini navigator tab bawah bahan juga memiliki beberapa opsi konfigurasi tetapi sebenarnya, itu

44
00:03:29,720 --> 00:03:31,910
tidak memiliki gaya label.

45
00:03:31,910 --> 00:03:38,690
Apa yang dapat Anda lakukan di sana adalah pada tab terpisah yang Anda muat, jadi pada opsi navigasi dari tab

46
00:03:38,690 --> 00:03:47,170
yang Anda muat, di mana Anda juga mengatur ikon bilah tab dan seterusnya, di sana kita dapat menambahkan label bilah tab di sini kita dapat mengatur

47
00:03:47,170 --> 00:03:54,160
label seperti makanan, beberapa tanda penjelasan untuk menggantikan apa yang kita gunakan sebagai label sekarang baik di iOS dan juga di

48
00:03:54,160 --> 00:03:54,540
Android

49
00:03:54,550 --> 00:04:00,490
dan itu sebenarnya bisa berupa string seperti ini tetapi Anda juga dapat mengatur ini menjadi komponen Bereaksi, untuk

50
00:04:00,490 --> 00:04:07,450
komponen teks yaitu dan kemudian di sana, Anda dapat mengatur label Anda, makanan tetapi tentu saja sekarang di sini, Anda dapat

51
00:04:07,720 --> 00:04:11,490
menambahkan gaya dan menambahkan gaya apa pun yang Anda inginkan.

52
00:04:11,500 --> 00:04:16,120
Jadi sedikit solusi karena tidak ada cara lain untuk menata ini untuk navigator tab bahan

53
00:04:16,120 --> 00:04:19,060
bawah tapi lebih baik daripada tidak sama sekali.

54
00:04:19,060 --> 00:04:25,060
Jadi di sini, kita sekarang dapat mengatur keluarga font ke OpenSans-Bold dan jika kita melakukannya, kita tentu juga harus memastikan

55
00:04:25,060 --> 00:04:30,240
kita sekarang mengimpor komponen teks dari React Native karena kalau tidak kita tidak dapat menggunakannya di sana

56
00:04:35,760 --> 00:04:40,980
dan sekarang dengan itu , kami juga mendapatkan ini di iOS kami tentu saja karena kami berbagi

57
00:04:40,980 --> 00:04:45,780
konfigurasi, kami akan memperbaikinya dalam satu detik tapi sekarang, ini adalah bagaimana kami dapat mengatur

58
00:04:45,810 --> 00:04:52,820
gaya kami sendiri di sana juga, tapi tentu saja kami sekarang kehilangan warna yang merupakan kelemahan dari pengaturan ini secara manual di sini

59
00:04:52,820 --> 00:04:59,930
dan karena kita hanya perlu solusi ini di sini, untuk Android, untuk tab bawah materi, perbaikan termudah adalah dengan menggunakan platform API dan hanya

60
00:04:59,930 --> 00:05:04,760
mengatur label bar tab ini untuk komponen teks ini jika kita kembali di Android karena hanya

61
00:05:04,760 --> 00:05:11,330
saat itu, kita perlu solusi ini untuk mengatur keluarga font. Jadi saya akan memeriksa apakah kita menggunakan Android dan

62
00:05:11,330 --> 00:05:18,650
jika itu masalahnya, saya akan mengembalikan komponen teks di sini, kalau tidak saya hanya akan mengembalikan makan teks dan kemudian keuntungan dari

63
00:05:18,650 --> 00:05:24,710
hanya mengembalikan teks di sini hanya bahwa kita yang lain pengaturan yang mengatur warna warna dan gaya label

64
00:05:24,710 --> 00:05:30,920
dan seterusnya akan masuk dan tidak akan diganti. Jika kita mengatur komponen teks kita sendiri, kita akan menonaktifkan

65
00:05:30,920 --> 00:05:34,700
semua fitur default itu, semua fitur default yang ada di navigator tab bawah.

66
00:05:34,700 --> 00:05:39,200
Masalah dengan navigator tab bawah bahan adalah ia tidak memiliki semua fitur bawaan bawaan ini,

67
00:05:39,200 --> 00:05:39,800
jadi

68
00:05:39,860 --> 00:05:44,690
di sana kita perlu menimpanya, tetapi kita hanya perlu melakukan ini untuk Android di sisi lain.

69
00:05:44,780 --> 00:05:48,290
Sekarang kita dapat menyalinnya dan melakukan hal yang sama tentu

70
00:05:48,290 --> 00:05:57,530
saja di sini untuk favorit, render favorit sebagai teks di iOS dan tentu saja juga dalam komponen teks untuk Android dan dengan itu, kita sekarang harus memiliki

71
00:05:57,590 --> 00:06:03,860
gaya yang berfungsi dan ini terlihat bagus . Di iOS di sana, kami pada dasarnya tidak

72
00:06:03,920 --> 00:06:09,740
mengubah apa pun dan di Android, di sana kami sekarang juga memiliki font khusus kami sendiri.

73
00:06:09,740 --> 00:06:12,520
Jadi ini sedikit solusi yang diperlukan di sini

74
00:06:12,520 --> 00:06:19,130
sayangnya ketika bekerja dengan navigator tab bawah tetapi juga tidak terlalu sulit untuk diterapkan dan dengan itu, kami memastikan

75
00:06:19,130 --> 00:06:24,290
bahwa kami menggunakan font khusus kami sendiri di mana saja di navigasi terkait fitur

76
00:06:24,800 --> 00:06:25,850
aplikasi kami.