Integrar mapas em aplicações móveis
Os desenvolvedores podem criar aplicações móveis altamente personalizadas, baseadas na localização, aproveitando a funcionalidade de geolocalização presente nos dispositivos móveis. Agora, o MobileTogether, a ferramenta de desenvolvimento móvel de código baixo e multiplataforma da Altova, suporta a integração profunda de mapas nas aplicações para todas as plataformas móveis populares.
Os desenvolvedores podem integrar mapas em aplicações móveis, adicionar marcadores específicos e definir ações personalizadas com base nos cliques dos utilizadores no mapa. Por exemplo, uma empresa pode querer que uma aplicação inclua um mapa com a localização de todas as suas filiais, e que, ao clicar numa filial, seja exibido o stock atual.
Num artigo anterior, descrevemos uma aplicação móvel concebida para permitir aos utilizadores verificar o estado dos principais aeroportos dos EUA, selecionando um código de aeroporto a partir de uma lista suspensa. Uma alternativa seria substituir as 47 opções da lista suspensa por marcadores num mapa.
Vamos analisar este exemplo.
As capturas de ecrã abaixo mostram a nova aplicação "Estado do Aeroporto" a funcionar num telemóvel Android, num iPhone e como uma aplicação para o ambiente de trabalho Windows.
Em cada dispositivo, o mapa é gerado utilizando a aplicação de mapas nativa e integrada. Os utilizadores finais verão automaticamente o estilo e o formato familiares em cada plataforma.
Se o mapa fizer com que alguma informação de estado saia da parte inferior do ecrã, ela poderá ser visualizada através de uma deslocação vertical
Integre mapas nas aplicações móveis arrastando o controlo do mapa para a aplicação, utilizando a funcionalidade de layout visual do MobileTogether Designer. Pode personalizar as propriedades de cada mapa. A captura de ecrã abaixo mostra uma parte da nossa página principal de "Estado do Aeroporto", com a janela de ajuda das propriedades do mapa visível no lado direito.
Os tipos de mapa disponíveis são: mapa de ruas, satélite ou híbrido. Além dos controlos de zoom opcionais, todos os dispositivos com ecrã tátil suportam a visualização do mapa com um toque e o gesto familiar de pinçar com dois dedos para ampliar ou reduzir a imagem.
A área do mapa a ser exibida é definida com base numa lista de um ou mais marcadores, que são definidos utilizando a expressão "mt-geo-map-marker". Cada marcador inclui um identificador, um título e um campo de texto. Estes valores podem ser acedidos quando o marcador é clicado.
As cores dos marcadores podem ser nomes padrão, como vermelho, verde e azul, ou podem ser especificadas através de códigos de cores personalizados, como utilizamos no exemplo anterior.
A propriedade "Viewport" define a área total a ser mapeada, especificando as coordenadas dos cantos superior esquerdo e inferior direito do mapa. Se deixada em branco, o "Viewport" padrão incluirá todos os marcadores definidos, mais uma pequena margem. Definimos uma expressão para o "Viewport" com valores iniciais para grande parte da América do Norte.
A propriedade "Ação de Controlo" define o que acontece quando o utilizador clica em qualquer um dos marcadores no mapa. A nossa aplicação irá ler o título do marcador, que é um código de aeroporto de três letras, utilizar esse código para obter o estado do aeroporto a partir do serviço web da FAA, e atualizar a visualização.
A nossa aplicação calcula novas coordenadas da área visível para ampliar a localização do aeroporto selecionado
Descubra por si mesmo como é fácil integrar mapas em aplicações móveis. Descarregue o Designer MobileTogether, que é gratuito, e que inclui ajuda online e aplicações de exemplo. Também pode obter a nossa aplicação "Airport Status" no GitHub e executá-la diretamente no Designer ou como um teste no seu próprio dispositivo móvel.
Descubra outras aplicações criadas com o MobileTogether e veja demonstrações em vídeo em: https://www.altova.com/mobiletogether/demos