Skip to main content

Command Palette

Search for a command to run...

Publicando um aplicativo Flutter na Apple Store em 7 passos

Um guia passo a passo para levar seu app Flutter ao público iOS

Updated
8 min read
Publicando um aplicativo Flutter na Apple Store em 7 passos

Fala, Flutter devs! Tudo bem? Hoje vamos aprender como publicar o seu aplicativo Flutter na loja de aplicativos da Apple!

Um pouco de contexto: Eu desenvolvi um aplicativo de adoção de animais para o meu TCC da pós-graduação e agora estou prestes a publicá-lo na loja de aplicativos. Achei que seria interessante documentar todo o processo de submissão para ajudar vocês quando forem passar por isso também! Vamos juntos nessa jornada! 🚀

A maravilha do Flutter é que ele é multiplataforma, ou seja, está disponível para várias plataformas, como Android, iOS, sistemas desktop e também web, tudo com apenas um único código.

Ao longo do artigo vou mostrar em algumas etapas como enviar o aplicativo que desenvolvi para a loja!

Então vem comigo. 🤏🏻 👨🏻‍💻

Requisitos Básicos para Publicar seu Aplicativo na App Store

  1. Um Macbook com o Xcode instalado: O Xcode é necessário para construir e lançar seu aplicativo, pois algumas configurações importantes do app são feitas através dele.

  2. Uma conta de desenvolvedor Apple: Você precisa adquirir uma licença do Apple Developer Program para acessar o painel e as ferramentas de publicação da Apple. Essa licença custa $100 dólares, o que, dependendo da cotação do dólar, pode ficar em torno de R$550 reais.

    Quando eu comprei a minha, após fazer o pedido e enviar os dados, levou em torno de uma semana para aprovação e liberação da licença.

    Dica Importante:

    Use um cartão de crédito físico ao invés de virtual. Ouvi relatos de que com o cartão virtual estava dando problemas. Para garantir, usei o cartão físico e deu tudo certo. 😎

1 - Registre seu Bundle ID no portal do desenvolvedor

Bundle ID é um identificador exclusivo associado a aplicativos iOS. Os proprietários de aplicativos definem esse ID. A Apple recomenda que os proprietários de aplicativos nomeiem o ID usando uma notação reversa de nome de domínio. Como por exemplo:

Domain: mycompany.com

Reverse domain: com.mycompany.appname.

Bundle ID: com.mycompany.myapp

Agora que vc já sabe o que é o Bundle ID, vamos prosseguir acessando o site (https://developer.apple.com) clique em Identifiers (Identificadores).

Veja a imagem abaixo:

Depois na próxima página clique no icone de + para criar um novo Bundle ID.

Agora prosseguindo vamos selecionar Apps IDS como na imagem abaixo:

Selecione o tipo App que aparecerá logo em seguida após a aba anterior. Veja a imagem abaixo:

O Bundle ID deve ser exclusivo para a app store. Se você selecionar um existente, um pop-up de aviso solicitará que você o altere.

Selecione os recursos e serviços que correspondem aos do seu aplicativo.

Insira o seu Bundle ID e a descrição sem caracteres especiais.

Mais embaixo selecione tambem quais Capabilities o seu app usa no meu caso selecionei push notifications pois o meu aplicativo recebe notificacões do Firebase.

Prossiga e clique em registrar! ✅

2 - Criando o aplicativo na Loja

Agora vamos criar o nosso aplicativo no portal, vá na página inicial do portal do apple developer e clique em Apps, vai aparecer um botão para adicionar um novo aplicativo.

Preencha os dados do seu aplicativo. Veja o print abaixo:

Clicando em criar podemos ver que o aplicativo foi criado com sucesso e registrado no portal do desenvolvedor da Apple.

3 - Revise as configurações do seu projeto no Xcode

Verifique as configurações mais importantes. Como Nome do aplicativo, Bundle Identifier e o Team que é a equipe associada à sua conta Apple Developer registrada. Se necessário, selecione Adicionar conta e atualize esta configuração.

Em iOS Deployment Target a versão mínima do iOS que seu aplicativo suporta. O Flutter suporta iOS 12 e versões posteriores. A guia Geral das configurações do seu projeto deve ser semelhante à seguinte:

Agora vamos em Signing e Capabilities

Confira o Team e o Bundle Identifier se esta correto. Deixe marcado a opção (Automatically manage signing) para o Xcode criar o perfil de provisionamento automaticamente, que é um arquivo que contém informações necessárias para que um aplicativo iOS possa ser instalado e executado em dispositivos Apple.

Ele vincula seu dispositivo a seu aplicativo, permitindo que você teste e distribua seu aplicativo em dispositivos físicos.

No meu caso deu um erro, veja o print abaixo:

Ele diz que não temos um device (iPhone) registrado na nossa conta, para resolver esse erro devemos adicionar um dispositivo iPhone no portal do desenvolvedor apple.

Voce pode plugar seu iPhone no macbook e tentar novamente e irá aparecer um botão para registrar automaticamente, veja o print abaixo:

Quando eu cliquei em registrar deu tudo certo. Foi automático!

Outra forma seria acessando o site do portal do desenvolvedor e registrar manualmente, acesse e clique em dispositivos (devices).

Agora clique para adicionar um novo:

Preecha os dados requeridos e principalmente com o seu Device ID (UDID) e pronto.

Encontrando seu UDID com Finder (macOS)

Plugue seu iPhone no seu mac e navegue até o Finder e selecione-o, você verá algumas informações sobre o celular conectado. Para mim tive que clicar algumas vezes nos dados abaixo do nome do iPhone para mostrar o UDID com sucesso!

Finder

Maneira alternativa de encontrar UDID com o Xcode

  • Conecte seu dispositivo iOS ao Xcode

  • Abra o menu Janela > Dispositivos e Simuladores

  • Encontre o seu dispositivo exibido nesta lista e visualize-o no Identifier “identificador” que é o mesmo UDID.

Depois de inserir com sucesso o UUID e o nome, continue o processo. Em seguida, aceite e registre o dispositivo.

4 - Adicionando o Ícone ao Seu Aplicativo

Existem várias formas de adicionar o ícone ao seu aplicativo, mas hoje vou mostrar uma maneira bem prática utilizando um site chamado Appicon. Este site permite que você cole sua imagem e ele gera os arquivos de ícone tanto para Android quanto para iOS.

Passos para gerar ícones com o Appicon:

  1. Acesse o site Appicon.

  2. Faça o upload da sua imagem.

  3. O site gerará automaticamente os arquivos necessários para ambas as plataformas.

  4. Baixe os arquivos e adicione-os ao seu projeto.

Dica Importante 💡

Se tiver dúvidas sobre as diretrizes de ícones, é sempre bom revisar as guidelines específicas da Apple para garantir que seu ícone esteja em conformidade com os padrões. Você pode encontrar as diretrizes da Apple aqui.

Depois de gerado baixe os arquivos e cole na pasta Assets.xcassets dentro da Runner substituindo os icones do Flutter gerados na criação do projeto pelos novos.

Feito isso, verifique se o ícone foi substituído executando seu aplicativo usando flutter run ⚡️

5 - Atualize os números de compilação e versão do aplicativo

O número da versão padrão do aplicativo é 1.0.0. Para atualizá-lo, navegue até o arquivo pubspec.yaml e atualize a seguinte linha:

version: 1.0.0+1

O número da versão é composto por três números separados por pontos, como 1.0.0 no exemplo acima, seguidos por um número de build opcional, como 1 no exemplo acima, separados por +.

6 - Gerando o arquivo (archive) de build e enviando a loja

Bom, aqui existe duas formas de fazer isso, uma pelo Vscode em combinação com um outro programa e outra pelo Xcode!

Com o Vs code

Execute flutter build ipa para produzir um arquivo de compilação do Xcode ( .xcarchive) no diretório do seu projeto build/ios/archive/ e um pacote de aplicativos da App Store (.ipa) em build/ios/ipa.

Pronto, Archive gerado com sucesso no caminho build/ios/ipa observe que ele pede que usemos um app chamado Apple Transporter para enviar para o portal do desenvolvedor apple o nosso aplicativo em formato IPA.

Faça a instalação dele via AppStore, veja o print abaixo:

Depois de instalado, faça login e abra-o 🛠️

Agora vamos transportar nosso IPA para o TestFlight, uma ferramenta no portal do desenvolvedor Apple que possibilita aos testadores usarem seus aplicativos e concederem feedbacks antes de lançá-los na App Store.

Clique em ADD APP vá no caminho mostrado anteriormente e selecione o seu aplicativo.

Veja que obtivemos sucesso ao fazer o upload para o transporter, agora é so enviar para o portal da Apple, clique em DELIVER. 😎

Depois de carregado podemos ver que as nossas compilações aparecem no Test Flight com sucesso ✈️

7 - Finalizando a configuração e enviando para a revisão

Quando estiver pronto para lançar seu aplicativo para o mundo, siga estas etapas para enviá-lo para análise e lançamento na App Store:

Selecione a compilação desejada.

Em seguida preencha os demais dados como descrição do aplicativo, texto promocional, classificação, categoria, local de disponibilidade, preço, palavras chave e screenshots etc.

E depois clique em submeter para a revisão.

Dica importante 💡

Para os screenshots devemos emular o nosso aplicativo nos simuladores corretos e assim tirar os screenshots no tamanho ideal. 📲

Para iPhone telas 6,5 e 6,7 pol, pode usar o simulador do iPhone 15 Plus.

Para iPhone tela 5,5 pol, pode usar o simulador do iPhone 8 Plus.

Para mais detalhes sobre os diversos tamanhos de screenshots confira e acesse o link da documentação oficial.

A Apple notifica você quando o processo de revisão do aplicativo é concluído.

Outra dica importante 💡

Instale o aplicativo do apple store connect e assim ficar por dentro da revisão do seu aplicativo pois a apple também notifica tudo por lá.

Bom é isso, agora é aguardar 😉.

Seu aplicativo será lançado de acordo com as instruções que você especificou na seção Lançamento da Lançamento da versão na App Store.

Referências 🔗

Release an iOS app with Flutterin 7 steps

Build and release an iOS app

Conclusão

Bom é isso 😎.

Neste artigo, você aprendeu como fazer o deploy da sua aplicação Flutter na loja da Apple 🍏

Em artigos futuros da série, veremos como fazer o processo para a loja do Android.

Espero que você tenha gostado! Compartilhe-o com seus amigos e colegas!

Juntos, vamos construir apps incríveis que transformam o mundo!

Se tiver alguma dúvida ou contribuição, deixe nos comentários!

Me siga para estar sempre por dentro dos próximos artigos 📲 🚀

🌐 Minhas redes sociais 🌐

GitHub | LinkedIn | Instagram | X (Twitter) | Medium