100%
11.11.2020

Como usamos deep links com flutter modular no Colab

Neste artigo, explicamos como foi o nosso processo de escolha para implantar deep links com flutter modular aqui no Colab :)

A escolha da arquitetura do nosso aplicativo foi pensada em cima da nossa necessidade de modularização do app, porém, ainda havia algum mistério sobre como iríamos usar deep links com as rotas do flutter modular.

O que são Deep Links?

Os deep links são links acessados de fora do app, que direcionam para uma página específica dentro do app.

Para verificação dessa funcionalidade usamos o app de campo.É também importante que eles sejam de fácil manutenção e que tenham um código claro para novos integrantes do time.

Possibilidades

Foi avaliada a possibilidade de usarmos um código diretamente nativo. Porém haveria o problema que apesar da configuração ser igual, o código que ouve esse links não seria flutter e sim nativo.

Havia também a possibilidade de usar uma solução do firebase chamada: "Dynamic Links", e apesar da documentação ser muito legal e coloridinha (rs), a configuração e implementação levava mais tempo. Além de que teríamos que entrar com esse recurso a mais no console do firebase, ao invés de ser algo claro no código.

E também havia a lib uni_links, que foi o que resolveu a parada.

Essa proposta é de simples implementação e só necessita adicionar configurações nas duas plataformas, sem necessidade de codificar nada nativo. Dessa forma, se sobressai sobre a proposta de implementação pura pois só exige flutter, o que devido ao tamanho do time é um ganho muito importante.

Você pode ver as instruções de instalação da solução aqui.

E vamos à implementação!


Aqui no Colab adoramos inovar na gestão pública!

Por isso, disponibilizamos alguns conteúdos mais completos que falam sobre gestão pública. Deixe o seu melhor e-mail para recebê-los!

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Implementação

Android e iOS exigem a declaração de permissão de links em um arquivo de configuração. Para Android basta adicionarmos as linhas intent-filter com as devidas configurações de schema e host em android/app/src/main/AndroidManifest.xml .

 

Para implementação no IOS, acesse ios/Runner/Info.plist e adicione as seguintes linhas:

No startup do app você deve escutar os deeplinks vindo do nativo, como no exemplo abaixo:

E desinstalar e instalar o app novamente.

Está pronto :)

Se você quiser ver a poc implementada no app de campo, você pode ver na branch:

feature/poc-deeplink-unilink

Para fazer acontecer a mágica no Android, role o seguinte comando no terminal:

adb shell 'am start -W -a android.intent.action.VIEW -c android.intent.category.BROWSABLE -d "unilinks://post_detail/102026"'

E para rodar IOS:

/usr/bin/xcrun simctl openurl booted unilinks://post_detail/102026

É isso :)

Ariadni Chioquetta

Sobre o autor

Desenvolvedora mobile no Colab. Acredita na mudança visando o futuro. E o futuro se faz com um presente focado na democracia, empatia e inovação tecnológica.