Introdução
Neste post vamos mostrar como desenvolver um app no React Native para trabalhar com Mapas e Geolocalização.
Já falamos sobre a atualização do SDK 38 do Expo e como ele melhorou a criação de aplicativos com React Native.
Vamos usar o create-react-native-app para criar nossos projetos e obter os benefícios de ter as libs do expo com as unimodules.
Caso de Uso — Funcionamento da aplicação
O objeto initialRegion deixa o mapa centralizado em um ponto fixo ao inicializar a aplicação. Assim que a tela abre, o app tenta acessar a localização do usuário.
Se de tudo der certo na execução da função getCurrentPosition o mapa será centralizado na localização atual do usuário, senão, vai manter a localização inicial — initialRegion. No Android isso se torna possível porque no arquivo AndroidManifest.xml tem a configuração previamente realizada quando criamos o projeto.
Essa configuração permite que o app solicite a permissão para o usuário liberar acesso a sua localização.
Além do mapa, também vai ser exibido um campo para preencher o nome do usuário do GitHub. Quando terminar de digitar e clicar no botão, será disparado a função handleSearchUser que vai buscar o usuário no Github e trazer todos os dados.
No GitHub, o usuário pode adicionar de maneira pública a informação de onde está — location, que pode ser a cidade, país do(a) Dev.
O GitHub disponibiliza na API o nome da cidade ou país atual do usuário. Precisamos de uma outra API para buscar a latitude e longitude baseada nessa localização.
Dada a location do GitHub, pegamos da API do MabBox a longitude e latitude do usuário e adicionamos na variável dev, que vamos armazenar no array de devs.
Integer iaculis felis est
In volutpat volutpat dui eu varius. Donec dictum, velit id lacinia vulputate, orci tortor dictum odio, sit amet vulputate dolor ligula vitae metus. Donec laoreet commodo ex non malesuada. Ut libero ligula, porta vel ornare quis, fringilla quis urna. Aenean vel metus quis ipsum gravida hendrerit non sit amet diam. Donec fermentum felis eget tempor pellentesque. Donec eget sapien ut orci dictum ullamcorper nec in elit.
Phasellus vehicula ac ipsum et luctus. Pellentesque hendrerit in felis et vehicula. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id urna et odio cursus laoreet. Sed congue lorem ac mi posuere, quis cursus libero ultrices. Vivamus sit amet arcu eget felis convallis venenatis. Aliquam tempor mi lorem, sed condimentum lacus dictum nec.