Olá! Eu sou o Ândriu Coelho e te dou boas-vindas a mais um curso de iOS.
Audiodescrição: Ândriu se descreve como um homem branco, de cabelo e barba castanho-escuros, e olhos pretos. Ele veste uma camiseta azul-escura com o logo da Alura em branco, e está sentado em frente a um microfone. Ao fundo, há uma parede clara com iluminação amarela, uma TV à esquerda do instrutor exibindo o mesmo logo branco da Alura sobre um fundo azul-escuro, e dois vasos de planta, um à esquerda e outro à direita.
Neste curso, daremos continuidade ao aplicativo Swift Bank, no qual trabalhamos ao longo de toda a formação de escalabilidade. A partir de agora, a ideia é trabalharmos com a navegação com deeplinks.
No emulador, temos um exemplo de link do nosso aplicativo que redireciona para a tela de empréstimos:
Teste deeplink com parâmetros
- swiftbankapp://loan?amount=2000
Dessa forma, conseguimos abrir a tela de empréstimos através de um link externo. Isso é muito importante tanto para push notification (notificação push), quanto para quando trabalhamos com Server Driven UI (Interface de Usuário Orientada pelo Servidor) e gostaríamos de trocar alguma opção de lugar e redirecionar a pessoa usuária para alguma tela específica.
Nesse caso, não precisamos subir uma alteração para a loja e esperar o deploy. Conseguimos fazer isso através do servidor, apenas mudando o deeplink.
Além disso, aprenderemos a passar parâmetros de uma tela para outra com deeplink. Também vamos aprender a fazer tratamento de erros para obter uma view genérica de erros, e a montar uma estrutura de navegação para dar suporte aos deeplinks.
Para realizar este curso, é interessante que você tenha conhecimentos sobre a linguagem Swift, saiba construir layouts com SwiftUI, e também saiba um pouco sobre modularização e Server Driven UI.
Gostou do conteúdo que iremos abordar? Esperamos você na primeira aula!
Durante o desenvolvimento de um aplicativo, inevitavelmente, em algum momento, será necessário disponibilizar partes dele para que sejam acessadas a partir do mundo externo. Para exemplificar, vamos utilizar o Google Maps.
Ao acessar a aplicação, é aberto um modal para fazer o upgrade da ferramenta. Nesse caso, vamos clicar em "Continuar usando o site".
Geralmente, em empresas que possuem tanto produtos web quanto mobile, é recomendado que, se a pessoa usuária acessar algum serviço web a partir do celular, seja sugerido que ela utilize o aplicativo.
Isso se deve a diversos fatores, como segurança e usabilidade, por exemplo. Portanto, se a pessoa usuária acessar seu produto, aplicativo ou site usando o smartphone, e você possuir um aplicativo também, o ideal é fazer essa sugestão de que a pessoa usuária mude para o aplicativo.
No Google Maps, por exemplo, temos um botão azul "Abrir app" no canto superior direito. Ao clicar nele, seríamos redirecionados para o aplicativo do Google Maps. Com isso, sabemos que esse botão possui o que chamamos de deeplink, tema central do nosso curso.
Nossa ideia é configurar alguns deeplinks no projeto Swift Bank, que permitam o acesso ao nosso projeto sem ser clicando no botão do aplicativo na tela inicial do dispositivo. Isso tem várias vantagens, como trabalhar com push notification, por exemplo, entre outras aplicações.
Após uma reunião com a equipe de negócios e com product managers da Swift Bank, definimos que nós, da área de desenvolvimento, começaremos a aplicar esses deeplinks no projeto.
Com o projeto SwiftBank
aberto no Xcode, podemos dar início à configuração dos deeplinks. Para isso, vamos clicar no target principal do projeto, isto é, em SwiftBank
no menu lateral esquerdo.
Ao fazer isso, temos acesso a uma página aberta na aba "General". Temos outras abas, como "Signing & Capabilities" e "Resource Tags", por exemplo, e entre elas, temos também a aba "Info", exatamente a que precisamos acessar.
Nessa aba, o que nos interessa é a última seção "URL Types", onde conseguimos configurar a abertura do aplicativo através de um deeplink. Para isso, vamos clicar no ícone de +
("Add items") na parte inferior da aba. Dessa forma, será adicionado um formulário para preenchermos.
Nesse formulário, temos os campos "Identifier", "Icon", "URL Schemes" e "Role". O campo "Identifier" deve ser preenchido com o Bundle Identifier da aplicação, que é basicamente o RG do nosso aplicativo, ou seja, algo que irá identificá-lo de forma única.
Para copiá-lo, basta clicar na seta à direita do campo "Bunde Identifier", localizado na seção "Identity". Feito isso, podemos colar em "Identifier" no formulário.
com.afc.SwiftBank
O próximo passo é definir um esquema no campo "URL Schemes". Esse esquema funciona como um nome que vamos adicionar para a URL, através do qual será possível abrir o aplicativo. Nesse caso, vamos definir esse esquema como, por exemplo, swiftbankapp
.
swiftbankapp
Somente com esses dois campos, já conseguimos realizar um teste. Para isso, vamos fazer o build do aplicativo com essas novas alterações, clicando no ícone de play no canto superior direito do menu lateral esquerdo. Com isso, rodamos o projeto e podemos usar o terminal para testar.
No terminal, executaremos o seguinte comando:
xcrun simctl openurl booted swiftbankapp://home
Embora as telas do deeplink ainda não tenham sido configuradas, adicionamos
://home
ao final do comando, pois é o que será lido a partir das configurações que fizemos na aba "Info".
A primeira parte do comando (xcrun simctl openurl booted
) é disponibilizada pelo próprio Xcode quando o instalamos, e a segunda parte (swiftbankapp://home
) é o deeplink que acabamos de configurar.
Ao executar esse comando, o aplicativo será aberto através do link, considerando que, por enquanto, nosso objetivo é abrir apenas a tela inicial, isto é, a tela Home.
Outra forma de testar seria abrir um aplicativo de notas no emulador, como o "Notes" do próprio iOS. Após clicar em "Novo Lembrete" na parte inferior da aplicação, podemos adicionar a mensagem "Teste deeplink" seguida do link do aplicativo, ou seja, swiftbankapp://home
.
Teste deeplink
swiftbankapp://home
Ao fazer isso, swiftbankapp://home
se transformará em um link, e ao clicar nele, também será aberta a tela inicial do aplicativo Swift Bank.
Lembrando que tudo isso acontece porque configuramos na aba "Info" do Xcode o campo "URL Schemes".
Essa era a primeira etapa que queríamos te apresentar. Falamos um pouco sobre o que é um deeplink, para que ele serve, e como fazemos a configuração inicial em um projeto. A seguir, vamos avançar com o uso de deeplinks e entender como ele pode ser útil no nosso projeto!
Com a configuração inicial do deeplink realizada, conseguimos abrir o aplicativo a partir de um link que nos direciona para a tela inicial do aplicativo da Swift Bank. A partir de agora, vamos começar a unir vários conceitos que aprendemos nesta formação de escalabilidade no nosso projeto.
O primeiro passo será instalar a biblioteca de empréstimos que desenvolvemos no curso de modularização com CocoaPods, de modo a começar a integrar todos esses conceitos.
Conforme dito anteriormente, o objetivo deste curso é falarmos de navegação com deeplinks. Como já aprendemos a abrir o aplicativo, a próximo etapa é aprendermos a abrir uma tela específica. Nesse caso, vamos usar a view de empréstimos desenvolvida no curso de modularização.
Com o projeto aberto no Xcode, vamos abrir o terminal, onde devemos estar no diretório do projeto SwiftBank
(ios-server-driven-swift-bank-main
). Começaremos instalando o CocoaPods. Para isso, executaremos os seguintes comandos no terminal:
pod init
pod install
Ao executar o comando pod install
, teremos um novo ícone no diretório do projeto: o workspace SwiftBank.xcworkspace
. A partir de agora, usando bibliotecas do CocoaPods, abriremos o projeto através deste novo ícone.
Com o Xcode aberto, vamos fechar o projeto anterior e abri-lo novamente pelo ícone do CocoaPods (SwiftBank.xcworkspace
). A principal mudança é que, a partir deste momento, teremos uma aba chamada "Pods" no menu lateral esquerdo, onde conseguimos adicionar as dependências do projeto.
Um ponto importante é que, caso já tenha feito o curso de modularização da Alura, você pode usar o projeto que desenvolveu como dependência no arquivo Podfile
.
Podfile
:
# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'
target 'SwiftBank' do
# Comment the next line if you don't want to use dynamic frameworks
use_frameworks!
# Pods for SwiftBank
end
Caso não tenha realizado o curso, vamos disponibilizar o projeto para você. Basta fazer o download para conseguir instalar usando o CocoaPods da mesma forma.
Na documentação do CocoaPods, são descritas várias maneiras de instalar uma biblioteca. No nosso caso, vamos instalar a partir de uma URL, pois já temos o projeto no GitHub. Sendo assim, utilizaremos a seguinte opção de comando:
pod 'Alamofire', :git => 'https://github.com/Alamofire/Alamofire.git'
Caso você realize o download do projeto e queira instalar a biblioteca local, basta utilizar a primeira opção da documentação:
pod 'Alamofire', :path => '~/Documents/Alamofire'
No lugar de
Alamofire
, colocaríamos o nome da bibliotecaSBLoan
, e em:path
, teríamos o caminho do diretório onde armazenamos o projeto. Se você ainda não tem o projeto no GitHub, siga esse caminho.
Com o comando copiado, vamos acessar novamente o projeto no Xcode e colar na linha 9 do arquivo Podfile
, após # Pods for SwiftBank
. Feito isso, basta substituir o nome da biblioteca e o link do repositório: em vez de Alamofire
, teremos SBLoan
; e após :git
, colocaremos a URL do nosso GitHub.
Podfile
:
# Uncomment the next line to define a global platform for your project
# platform :ios, '9.0'
target 'SwiftBank' do
# Comment the next line if you don't want to use dynamic frameworks
use_frameworks!
# Pods for SwiftBank
pod 'SBLoan', :git => 'https://github.com/AndriuCoelho/SBLoan.git'
end
Sempre que adicionamos uma nova dependência, precisamos realizar sua instalação. De volta ao terminal, vamos executar o comando pod install
novamente.
pod install
Primeiramente, será feito o download do projeto, e ao final, teremos instalado o projeto SBLoan
, módulo que desenvolvemos no curso de modularização.
Podemos voltar ao Xcode e abrir o projeto, onde já teremos a view que precisamos no target Pods
. Ao acessar a pasta "Pods", encontraremos o módulo SBLoan
, contendo a view de empréstimos que desenvolvemos anteriormente (SBLoanView
). Na sequência, podemos realizar o build do projeto.
A partir de agora, começaremos a entender o contexto do que precisamos fazer. O projeto roda normalmente, e agora o nosso objetivo é abrir a tela de empréstimos, por exemplo, através de um deeplink. No vídeo anterior, começamos a testar a abertura de telas via deeplink.
Para isso, utilizamos o comando abaixo:
xcrun simctl openurl booted swiftbankapp://home
A primeira parte do comando (xcrun simctl openurl booted
) é responsável por abrir um deeplink, enquanto a segunda parte (swiftbankapp://home
) é o Bundle Identifier que configuramos.
O que nos interessa agora é o que vem após as duas barras do Bundle Identifier. No exemplo acima, adicionamos //home
, mas o objetivo é utilizar, por exemplo, //loan
("empréstimos" em inglês), e ao fazer isso, devemos conseguir abrir a tela de empréstimos.
xcrun simctl openurl booted swiftbankapp://loan
Se tentarmos executar esse comando no momento, será aberta a tela inicial, ou seja, a tela Home, pois ainda não configuramos essa navegação de deeplinks no aplicativo. Faremos isso a seguir!
O curso iOS: trabalhando com navegação por deeplink e tratamento de erros possui 111 minutos de vídeos, em um total de 44 atividades. Gostou? Conheça nossos outros cursos de iOS em Mobile, ou leia nossos artigos de Mobile.
Matricule-se e comece a estudar com a gente hoje! Conheça outros tópicos abordados durante o curso:
Impulsione a sua carreira com os melhores cursos e faça parte da maior comunidade tech.
1 ano de Alura
Assine o PLUS e garanta:
Formações com mais de 1500 cursos atualizados e novos lançamentos semanais, em Programação, Inteligência Artificial, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.
A cada curso ou formação concluído, um novo certificado para turbinar seu currículo e LinkedIn.
No Discord, você tem acesso a eventos exclusivos, grupos de estudos e mentorias com especialistas de diferentes áreas.
Faça parte da maior comunidade Dev do país e crie conexões com mais de 120 mil pessoas no Discord.
Acesso ilimitado ao catálogo de Imersões da Alura para praticar conhecimentos em diferentes áreas.
Explore um universo de possibilidades na palma da sua mão. Baixe as aulas para assistir offline, onde e quando quiser.
Acelere o seu aprendizado com a IA da Alura e prepare-se para o mercado internacional.
1 ano de Alura
Todos os benefícios do PLUS e mais vantagens exclusivas:
Luri é nossa inteligência artificial que tira dúvidas, dá exemplos práticos, corrige exercícios e ajuda a mergulhar ainda mais durante as aulas. Você pode conversar com a Luri até 100 mensagens por semana.
Aprenda um novo idioma e expanda seus horizontes profissionais. Cursos de Inglês, Espanhol e Inglês para Devs, 100% focado em tecnologia.
Transforme a sua jornada com benefícios exclusivos e evolua ainda mais na sua carreira.
1 ano de Alura
Todos os benefícios do PRO e mais vantagens exclusivas:
Mensagens ilimitadas para estudar com a Luri, a IA da Alura, disponível 24hs para tirar suas dúvidas, dar exemplos práticos, corrigir exercícios e impulsionar seus estudos.
Envie imagens para a Luri e ela te ajuda a solucionar problemas, identificar erros, esclarecer gráficos, analisar design e muito mais.
Escolha os ebooks da Casa do Código, a editora da Alura, que apoiarão a sua jornada de aprendizado para sempre.