1
00:00:02,110 --> 00:00:04,450
Como podemos garantir que podemos escolher um lugar?

2
00:00:04,870 --> 00:00:10,900
Bem, na visualização do mapa, na tela do mapa, você pode adicionar um manipulador onPress, e isso dispara sempre que você

3
00:00:10,900 --> 00:00:11,580
toca em

4
00:00:11,680 --> 00:00:16,690
algum lugar do mapa e, com isso, não quero dizer toques quando você rola, mas quando você

5
00:00:16,690 --> 00:00:23,130
toca ali sem rolar, por isso, se realmente quer selecionar algo. Isso será acionado e, portanto, poderá ser vinculado a

6
00:00:23,170 --> 00:00:27,010
uma função que eu defino aqui, que deve armazenar o local selecionado.

7
00:00:27,010 --> 00:00:33,940
Então, aqui vou ter minha função de manipulador de localização de seleção, que obtém um objeto de evento e é a

8
00:00:33,940 --> 00:00:36,260
isso que vinculo o onPress aqui.

9
00:00:36,260 --> 00:00:42,440
Agora podemos analisar esse evento para ter uma ideia do que está lá dentro, que tipo de dados obtemos.

10
00:00:42,440 --> 00:00:44,300
Então, deixe-me salvar

11
00:00:44,330 --> 00:00:52,550
e testá-lo, vamos ao mapa e, depois de carregado, basta tocar em algum lugar no mapa, como aqui.

12
00:00:52,550 --> 00:00:58,450
Se agora voltarmos, essa é a saída que eu recebo e lá você vê que é um objeto muito grande;

13
00:00:58,700 --> 00:01:02,280
no final, temos um monte de dados lá dos quais não precisamos

14
00:01:02,510 --> 00:01:04,700
realmente, é esse evento sintético aqui.

15
00:01:04,850 --> 00:01:10,880
O que temos, o interessante é essa propriedade de evento nativo que é outro objeto, que possui uma

16
00:01:10,880 --> 00:01:15,170
propriedade de coordenadas que é outro objeto, que possui latitude e longitude.

17
00:01:15,170 --> 00:01:17,090
É nisso que estamos interessados no final, certo,

18
00:01:17,090 --> 00:01:18,520
é isso que queremos descobrir, esse

19
00:01:18,530 --> 00:01:19,700
é o par

20
00:01:19,700 --> 00:01:21,000
de coordenadas que queremos obter.

21
00:01:21,020 --> 00:01:24,640
Portanto, este é o local, as coordenadas em que o usuário

22
00:01:24,650 --> 00:01:30,850
digitou, é o que eu quero armazenar aqui e seria bom começar adicionando um marcador nesse local para marcar

23
00:01:30,860 --> 00:01:34,430
o local no mapa. Para isso, é

24
00:01:34,420 --> 00:01:42,260
claro que podemos usar o estado para salvar o local selecionado e o componente, inicialize-o

25
00:01:43,100 --> 00:01:48,170
aqui e tenha nosso local selecionado e defina o local

26
00:01:50,500 --> 00:01:58,870
selecionado com a ajuda do estado de uso. Inicialmente está vazio, não temos um local selecionado inicialmente

27
00:01:58,870 --> 00:02:01,200
e, em seguida, podemos

28
00:02:01,270 --> 00:02:08,170
criar um marcador aqui, se tivermos um. Para isso, podemos importar o componente do marcador de mapas nativos

29
00:02:08,170 --> 00:02:14,590
adicionando algumas importações nomeadas aqui, além da importação padrão que temos e podemos importar o marcador dos mapas do React Native, é

30
00:02:14,590 --> 00:02:20,530
tão simples assim e podemos renderizar esse marcador adicionando-o entre os abrindo e fechando tags da visualização do mapa que

31
00:02:20,530 --> 00:02:21,470
precisamos agora,

32
00:02:21,640 --> 00:02:23,780
para que possamos adicionar um marcador aqui.

33
00:02:23,870 --> 00:02:27,090
Agora, esse marcador precisa de alguma configuração, caso contrário, os

34
00:02:27,170 --> 00:02:32,840
mapas do React Native não sabem onde mostrá-lo. Podemos adicionar um título, por

35
00:02:33,230 --> 00:02:40,560
exemplo, o local escolhido, mas, mais importante, você pode adicionar um suporte de coordenadas

36
00:02:40,590 --> 00:02:53,260
aqui e que espera obter um objeto com latitude e longitude lá. Então, aqui, adicionarei uma nova variável, coordenadas do marcador, digamos, e se eu tiver um local selecionado

37
00:02:53,320 --> 00:03:00,190
e esse for o estado que estou gerenciando, se o tiver, quero definir as coordenadas do marcador iguais

38
00:03:00,190 --> 00:03:05,050
a um objeto em que você precisa ter uma latitude denominada latitude; portanto,

39
00:03:05,080 --> 00:03:06,070
não é

40
00:03:06,070 --> 00:03:10,890
lat, ela precisa ser latitude, porque o componente marcador procurará uma propriedade

41
00:03:12,100 --> 00:03:15,390
denominada latitude e que pode ser o local

42
00:03:16,710 --> 00:03:17,860
selecionado. lat,

43
00:03:17,970 --> 00:03:22,970
digamos, depende de nós como salvamos isso, não estamos fazendo agora, mas mais tarde salvarei

44
00:03:22,970 --> 00:03:28,100
para que tenhamos um suporte lat e longitude que precise ser nomeado assim, que possa conter

45
00:03:28,100 --> 00:03:31,150
o valor armazenado em selectedLocation. lng.

46
00:03:31,370 --> 00:03:36,560
Agora, as coordenadas do marcador estão definidas condicionalmente e agora podemos verificar se as condições do marcador existem

47
00:03:36,890 --> 00:03:44,100
e, se existir, usamos esse atalho para também gerar um marcador aqui. Agora, as coordenadas dos marcadores também são o que

48
00:03:44,100 --> 00:03:45,900
podemos alimentar aqui e

49
00:03:45,900 --> 00:03:49,890
observe que isso é coordenada, não coordenadas, é apenas coordenada.

50
00:03:49,890 --> 00:03:56,260
Neste ponto, são nossas coordenadas de marcador e agora precisamos garantir que definimos o local selecionado e, é claro, eu

51
00:03:56,250 --> 00:03:57,420
quero fazer isso

52
00:03:57,620 --> 00:04:01,740
aqui no meu manipulador de local selecionado. Lá, eu quero chamar definir

53
00:04:01,820 --> 00:04:08,330
local selecionado para definir meu estado, passar um objeto para lá e definir meu estado para um objeto com

54
00:04:08,330 --> 00:04:16,450
uma chave lat, porque estou tentando extrair lat lá do evento. nativeEvent como você viu, e havia uma propriedade de coordenada que

55
00:04:16,490 --> 00:04:22,580
tem uma propriedade de latitude e, em seguida, lng que eu também estou extraindo lá embaixo deve

56
00:04:22,580 --> 00:04:31,520
ser definido como event. nativeEvent. coordenadas. longitude. E com esse código,

57
00:04:31,520 --> 00:04:35,480
poderemos visualizar um marcador no mapa. Então, vamos tentar, vamos para o

58
00:04:35,480 --> 00:04:36,900
iOS, carregar o mapa lá

59
00:04:36,950 --> 00:04:38,240
e escolher algum

60
00:04:41,190 --> 00:04:47,640
lugar e vemos um marcador no local em que clico. O mesmo no Android, espero, vamos tentar

61
00:04:47,640 --> 00:04:53,480
lá, abrir o mapa e, de fato, lá se eu tocar em

62
00:04:53,520 --> 00:04:54,720
algum lugar,

63
00:04:58,440 --> 00:05:01,380
também coloco meu marcador lá.

64
00:05:01,410 --> 00:05:05,290
É assim que podemos trabalhar com marcadores e como podemos selecionar

65
00:05:05,340 --> 00:05:06,820
locais, tudo é legal.

66
00:05:06,810 --> 00:05:12,090
Agora, finalmente, eu quero poder clicar em um botão salvar lá em cima que ainda

67
00:05:12,090 --> 00:05:19,750
não existe, que fecha o mapa e passa o local selecionado de volta à minha nova tela de local no final, certo,

68
00:05:19,750 --> 00:05:24,940
o que eu tenho aqui também. Quero voltar para a tela e, é claro, salvar meu

69
00:05:24,950 --> 00:05:25,500
local selecionado.