1 00:00:02,520 --> 00:00:07,110 Portanto, agora trabalhamos bastante com a navegação e podemos avançar e retroceder. 2 00:00:07,110 --> 00:00:13,620 Você aprende como adicionar ícones e botões de ação aqui a este cabeçalho, como estilizar e controlar o cabeçalho em 3 00:00:13,620 --> 00:00:18,630 geral, como transmitir dados e essas são coisas cruciais para aplicativos móveis que você está 4 00:00:18,630 --> 00:00:23,610 construindo com o React Native. faça várias vezes ao trabalhar com o React Native 5 00:00:23,790 --> 00:00:24,980 para criar aplicativos. 6 00:00:25,050 --> 00:00:31,170 Agora, essa não é a única forma de navegação que podemos implementar, mas também podemos tocar na 7 00:00:31,440 --> 00:00:36,330 parte inferior, para que possamos alternar entre diferentes seções do aplicativo, o que 8 00:00:36,330 --> 00:00:42,210 obviamente faz um padrão típico dos aplicativos para dispositivos móveis e também é o padrão. Esboço no 9 00:00:42,210 --> 00:00:49,950 início deste módulo. Quero ter dois toques no aplicativo dele, um para todas as nossas refeições ou, neste caso, todas as nossas 10 00:00:49,950 --> 00:00:55,440 categorias e um para apenas as nossas refeições favoritas, as refeições que marcamos como favoritas. 11 00:00:55,500 --> 00:01:01,640 É claro que isso nos leva a uma pergunta importante: como podemos adicionar toques ao trabalhar com a navegação de reação. 12 00:01:01,800 --> 00:01:05,010 E isso felizmente não é muito difícil. 13 00:01:05,010 --> 00:01:09,840 Vamos ao arquivo James do navegador de refeições, que é onde configuramos a navegação e criamos 14 00:01:09,840 --> 00:01:11,090 um navegador de pilha. 15 00:01:11,190 --> 00:01:17,460 Você precisa de um navegador de pilha sempre que tiver páginas de telas em seu aplicativo que estejam conectadas a um 16 00:01:17,460 --> 00:01:19,020 fluxo reverso para a frente. 17 00:01:19,020 --> 00:01:21,140 Essa é a navegação típica da pilha. 18 00:01:21,140 --> 00:01:26,910 O que estamos usando aqui, é claro, ainda será necessário, mesmo que agora todos os anúncios sejam tocados. 19 00:01:26,970 --> 00:01:32,910 O bom é que você pode simplesmente ter vários navegadores em seu aplicativo e isso é exatamente o 20 00:01:32,940 --> 00:01:39,190 que faz agora com a navegação Rick, além do navegador de pilha que cria a função de navegador de pilha. 21 00:01:39,210 --> 00:01:45,240 Também podemos importar o navegador de criação da guia inferior e isso faz exatamente o que parece, permitindo-nos criar um 22 00:01:45,240 --> 00:01:48,080 navegador que funciona com toques na parte inferior. 23 00:01:49,050 --> 00:01:56,220 Então, crie o navegador da aba inferior e podemos simplesmente criar esse navegador 24 00:01:56,220 --> 00:02:04,230 adicional ao lado do nosso navegador de refeições, digamos que aqui vou nomear refeições. controles 25 00:02:04,230 --> 00:02:10,110 e controles de roda são refeições e favoritos com toques e 26 00:02:10,110 --> 00:02:17,550 eu chamo de criar guia de navegação inferior e armazeno o resultado disso nessa 27 00:02:17,550 --> 00:02:18,290 constante. 28 00:02:18,360 --> 00:02:24,210 O resultado dessa justiça antes para o navegador de pilha não é o fim de um componente de reação. 29 00:02:24,210 --> 00:02:27,730 Assim, podemos armazenar isso aqui e em breve poderemos usar a distância. 30 00:02:28,410 --> 00:02:34,650 Agora, como configuramos esse navegador de guias, assim como o navegador de pilha e o navegador de guias, levam 31 00:02:34,650 --> 00:02:40,590 o objeto para o qual precisamos informá-lo sobre os diferentes toques, para dizer as diferentes seções nas diferentes 32 00:02:40,590 --> 00:02:46,880 telas que você deseja carregar quando clicamos em diferentes torneiras e lá eu tenho duas guias que eu quero 33 00:02:46,880 --> 00:02:49,790 uma guia deve ser o que vemos aqui. 34 00:02:49,830 --> 00:02:55,980 Portanto, nossa pilha no final não é apenas essa tela, mas todas as funcionalidades para ir para outra tela. 35 00:02:56,010 --> 00:03:02,310 Então, eu quero ter a pilha inteira aqui em uma guia e uma tela diferente 36 00:03:02,310 --> 00:03:11,780 ou uma pilha diferente na guia Abbott. O bom é que você pode usar uma pilha ou qualquer outro navegador como uma tela neste navegador. 37 00:03:12,040 --> 00:03:15,130 Então, o que você pode fazer aqui é configurar um identificador. 38 00:03:15,220 --> 00:03:16,570 Vamos nomear refeições. 39 00:03:16,570 --> 00:03:18,140 Isso depende totalmente de você. 40 00:03:18,250 --> 00:03:21,060 E agora você pode apontar para uma tela aqui. 41 00:03:21,100 --> 00:03:27,100 Você também pode usar esse formulário longo com a tela, mas usarei o atalho e apontei diretamente 42 00:03:27,100 --> 00:03:35,070 para uma tela aqui na tela que você aponta aqui pode até ser apenas um componente de reação, como criamos aqui na pasta 43 00:03:35,070 --> 00:03:36,520 de telas ou. 44 00:03:36,540 --> 00:03:40,270 Bem, desde este ano, como mencionei, todos os retornos são componentes reais. 45 00:03:40,290 --> 00:03:42,840 Também pode ser o resultado de criar pilha Navigator. 46 00:03:42,840 --> 00:03:50,350 Então, de fato, usarei o navegador de refeições aqui como minha tela para carregar a guia de refeições. 47 00:03:50,420 --> 00:03:54,320 De fato, é assim que funciona, é como podemos configurar isso. 48 00:03:54,480 --> 00:03:56,420 Então essa é a nossa primeira torneira. 49 00:03:56,430 --> 00:03:59,300 A segunda aba será nossa favorita e lá. 50 00:03:59,340 --> 00:04:01,290 Ainda não tenho pilha. 51 00:04:01,290 --> 00:04:07,940 Mais tarde, podemos adicionar um, mas, por enquanto, aponto para a tela de favoritos, então vamos importar favoritos mortos. 52 00:04:07,950 --> 00:04:16,230 A tela aqui no arquivo do navegador de refeições importa a tela de favoritos da pasta screens e eles são a tela 53 00:04:16,260 --> 00:04:18,000 de favoritos como esta. 54 00:04:18,180 --> 00:04:27,980 E agora basta apontar para a tela favorita aqui para o nosso identificador de favoritos no navegador da guia inferior. 55 00:04:28,080 --> 00:04:30,930 É assim que podemos configurar uma aba Navegador. 56 00:04:30,930 --> 00:04:33,340 A questão agora é como a usamos. 57 00:04:33,420 --> 00:04:39,000 Bem, no final, agora é este Navegador que queremos usar como nosso navegador de rotas no aplicativo, 58 00:04:39,000 --> 00:04:41,510 porque inclui nosso navegador de refeições existente. 59 00:04:41,610 --> 00:04:44,520 E também nos permite ir para a tela favorita. 60 00:04:44,520 --> 00:04:50,010 Portanto, no final, eu apenas uso este ano no contêiner de aplicativos em vez do navegador 61 00:04:50,010 --> 00:04:56,600 de refeições, porque o navegador de refeições agora está aninhado neste navegador de guias e é assim que você pode combinar 62 00:04:56,620 --> 00:05:02,400 vários navegadores em um aplicativo nativo orientado pela navegação em rack, porque você pode simplesmente misture e combine-os. 63 00:05:02,400 --> 00:05:07,740 Você sempre tem um Navegador de rota que está no contêiner do aplicativo e isso faz sentido que 64 00:05:07,740 --> 00:05:14,550 você tenha um ponto de entrada para o aplicativo, mas é claro que esse navegador de rotas pode ter nossos navegadores aninhados, pois 65 00:05:14,550 --> 00:05:20,670 temos aqui para esse toque onde apontamos para o navegador de refeições e se agora salvarmos isso com segurança e nosso 66 00:05:20,670 --> 00:05:25,950 aplicativo reiniciar, você verá agora temos guias na parte inferior aqui e podemos clicar nelas para ir 67 00:05:26,160 --> 00:05:32,550 para a nossa pilha de refeições aqui e podemos usar essa pilha como antes, mas também posso mudar para favoritos volto para 68 00:05:32,550 --> 00:05:37,340 a minha pilha, que ainda mantém a afirmação, e é assim que podemos adicionar tarefas. 69 00:05:37,380 --> 00:05:39,210 O mesmo no Android, é claro. 70 00:05:39,480 --> 00:05:44,540 Agora, é claro, também é digno de nota que esses toques não pareçam corretos, mas seria 71 00:05:44,540 --> 00:05:49,290 bom ouvir isso e não apenas algum texto, e cuidaremos da configuração desses toques. 72 00:05:49,290 --> 00:05:54,660 Só um segundo, mas é assim que podemos começar com torneiras e é assim que você pode 73 00:05:54,660 --> 00:06:00,620 pensar em usar vários navegadores em um aplicativo de navegação de reação ou no aplicativo usando a navegação de reação. 74 00:06:00,630 --> 00:06:05,490 Agora, com isso, vamos ver como podemos adicionar ícones e como podemos configurar nossas torneiras um pouco mais 75 00:06:05,490 --> 00:06:08,160 para usar uma cor diferente desse ano azul padrão.