1
00:00:02,190 --> 00:00:07,460
Ahora que aprendió cómo puede agregar fuentes a una aplicación y adjuntará, encontrará un archivo zip con las

2
00:00:07,470 --> 00:00:10,000
fuentes que quiero agregar. Para eso en la carpeta

3
00:00:10,020 --> 00:00:16,290
de activos, agregaré una nueva carpeta de fuentes y luego es OpenSans-Bold y regular. archivo ttf que está en el archivo zip

4
00:00:16,290 --> 00:00:19,350
que encuentra adjunto que quiero agregar aquí.

5
00:00:19,470 --> 00:00:22,670
Ahora, agregar los archivos por sí solo no servirá de mucho, como sabe, en cambio,

6
00:00:22,710 --> 00:00:27,690
tenemos que cargar estas fuentes y lo hacemos en la aplicación. js, que es nuestro archivo de inicio que

7
00:00:27,690 --> 00:00:31,070
inicia toda la aplicación. Allí, tenemos que importar

8
00:00:31,170 --> 00:00:36,660
todo como fuente desde expo-font y es posible que esto no esté disponible

9
00:00:36,660 --> 00:00:43,320
en su proyecto todavía, por lo que es posible que desee ejecutar npm install --save expo-font

10
00:00:43,320 --> 00:00:45,010
para asegurarse de

11
00:00:45,030 --> 00:00:52,530
que esté disponible, para instalarlo paquete y con eso instalado, puede importar la fuente desde allí, así y

12
00:00:52,620 --> 00:00:54,750
también quiero importar el componente

13
00:00:54,750 --> 00:01:02,910
de carga de la aplicación desde la expo, ese es el componente que prolongará la pantalla de inicio cuando la

14
00:01:02,910 --> 00:01:09,000
aplicación se inicie hasta que se carguen nuestras fuentes para que solo ver algo

15
00:01:09,000 --> 00:01:14,670
en la pantalla cuando todos nuestros activos, y en este caso estas son

16
00:01:14,700 --> 00:01:22,950
las fuentes, están realmente disponibles y realmente están ahí. Ahora, con estas importaciones agregadas, podemos agregar una función

17
00:01:23,250 --> 00:01:25,130
aquí fuera de

18
00:01:25,310 --> 00:01:30,180
nuestra función componente que nombraré fuentes de búsqueda y esta es

19
00:01:30,600 --> 00:01:39,190
una función que finalmente usará la fuente, así que lo que estoy importando aquí, carga async y luego pase

20
00:01:39,190 --> 00:01:47,110
un objeto donde describamos los datos que queremos cargar y esa es la fuente abierta sin registro que

21
00:01:47,110 --> 00:01:57,890
registraré bajo abierto, agregamos esto al requerir esto. / assets / fonts / OpenSans, no en negrita sino regular. ttf y luego, además, tenemos open-sans-bold,

22
00:01:57,890 --> 00:02:05,470
esa es la otra fuente que quiero registrar, requiriéndola de assets / fonts

23
00:02:05,470 --> 00:02:08,210
/ OpenSans-Bold. ttf, así.

24
00:02:08,440 --> 00:02:14,320
Ahora tenemos que devolver esto porque load async devuelve una promesa y quiero devolver esto en mi función de búsqueda

25
00:02:14,320 --> 00:02:20,410
de fuentes porque con esto, podemos usarlo junto con el componente de carga de la aplicación y ese es un patrón

26
00:02:20,410 --> 00:02:22,430
que aprendiste anteriormente en el curso.

27
00:02:22,450 --> 00:02:23,970
Entonces, en caso de que

28
00:02:24,010 --> 00:02:28,040
esto sea nuevo para usted, asegúrese de pasar primero por las otras secciones de este curso.

29
00:02:28,060 --> 00:02:34,840
Así que ahora podemos usar fuentes de captación con la carga de la aplicación y lo hacemos dentro de nuestro

30
00:02:34,840 --> 00:02:41,680
componente de la aplicación, allí administraré algunos estados y lo haré con la ayuda del gancho useState que importamos de

31
00:02:42,610 --> 00:02:51,760
React y lo nombraré indique la fuente cargada y configure la fuente cargada y llame a useState e inicialmente, eso es falso porque inicialmente, la fuente no

32
00:02:51,790 --> 00:02:54,260
se ha cargado y luego aquí,

33
00:02:54,400 --> 00:03:00,100
podemos verificar si la fuente no se ha cargado, que inicialmente es el caso, luego quiero volver

34
00:03:00,100 --> 00:03:07,270
el componente de carga de la aplicación en lugar de mi contenido normal de la aplicación porque en el componente de

35
00:03:07,600 --> 00:03:14,600
carga de la aplicación, podemos agregar la propiedad de inicio asíncrono y apuntar a buscar fuentes que inicia esta función de

36
00:03:14,860 --> 00:03:21,430
búsqueda de fuentes y una vez que esto esté hecho, la función que pasamos a onFinish será llamado y

37
00:03:21,430 --> 00:03:29,240
en esta función, simplemente estableceré la fuente cargada en true, así. Por lo tanto, esto asegura que simplemente mantengamos la pantalla de

38
00:03:29,240 --> 00:03:35,600
inicio abierta hasta que se carguen nuestras fuentes y esto se procesará hasta que volvamos a cargar

39
00:03:35,840 --> 00:03:42,590
nuestras fuentes y, en adelante, cargaremos este contenido. Ahora con eso, nos estamos asegurando de que estamos importando nuestras fuentes y

40
00:03:42,590 --> 00:03:45,870
que podemos comenzar a usarlas y las necesitaremos en todo este módulo.

41
00:03:45,980 --> 00:03:52,280
Con eso, ahora es el momento de comenzar a agregar realmente lo que todos buscamos, la navegación.