Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Boa tarde gente. To em duvida sobre um projeto que pretendo fazer no flutter a respeito de um mapa interativo so que sem o uso de API, semelhante por exemplo a esse mapa de hollow kight https://mapgenie.io/hollow-knight-silksong/maps/pharloom.
Queria fazer algo semelhante mas estou em duvida sobre como começar, ou se seria recomendavel usar o flutter em um projeto como esse.
Olá Caio, tudo bem?
Que projeto interessante! Um mapa interativo estilo Hollow Knight tem um charme todo especial.
Flutter é uma escolha viável sim, mas vale entender o que você vai precisar. A ideia de mapa sem API geralmente envolve:
No Flutter, você consegue isso combinando algumas coisas. Para a movimentação da imagem com zoom e pan, o widget InteractiveViewer já resolve bastante coisa sem precisar de biblioteca externa:
InteractiveViewer(
boundaryMargin: EdgeInsets.all(80),
minScale: 0.5,
maxScale: 4.0,
child: Stack(
children: [
Image.asset('assets/mapa.png'),
// aqui você sobrepõe os marcadores
],
),
)
Os marcadores interativos você posiciona com Positioned dentro do Stack, calculando as coordenadas proporcionalmente ao tamanho do mapa. Isso exige um pouco de cálculo manual, mas é totalmente factível.
O ponto de atenção maior é o tamanho da imagem do mapa: imagens muito grandes podem travar, então vale trabalhar com tiles (dividir o mapa em pedaços menores) se o mapa for enorme.
Se quiser persistir dados localmente (ex: marcar um local como visitado), o artigo abaixo pode ajudar na escolha da ferramenta certa:
Para saber maisQualquer dúvida que surgir durante o desenvolvimento, traz aqui para o fórum.
Conte com a Alura para evoluir seus estudos. Em caso de dúvidas, fico à disposição.
Bons estudos!
Sucesso ✨
