Estrutura · Ame Mini-app Components
›1 Começando
2.1.2 Bordas
2.1.4 Direções
2.1.5 Gradientes
2.1.6 Opacidade
2.1.7 Espaçamentos
2.1.8 Visibilidade
2.2 De Texto
2.2.2 Tamanho
2.2.3 Altura da linha
2.2.4 Peso
2.2.5 Alinhamento
3 Componentes simples
4.4 Bullet
5.2 Ilustration
5.3 Animator
5.4 AmeIcon
6.2 DropdownButton
6.3 SegmentedControl
6.5 CurrencyInput
6.6 OptIn
6.7 DatePicker
6.8 TimePicker
6.9 CheckItem
6.10 Information
6.11 SecureInput
6.12 PullToRefresh
6.14 Ads
7.1 Divisor
7.2 Skeleton
7.3 SpringLayout
8.1 ListView
8.2 InfiniteScroll
9.2 ProductCard
9.3 FlatCard
9.5 Datasheet
Para realizar a produção de um mini-app, é necessário conhecer alguns componentes para montar as telas. Utilizando o mini-app boilerplate você poderá ver como eles são construídos.
A estrutura de pastas de um projeto é apresentada da seguinte forma:
Pasta assets
A pasta assets é responsável por conter todas as imagens do mini-app. O uso de imagens é irrestrito e os formatos aceitos são: jpg, jpeg, png, gif e svg.
A pasta views contém todos os arquivos que constróem as telas do mini-app. É necessário existir dois arquivos para cada cena do mini-app, um arquivo com extensão js para configurar a lógica da página, outro arquivo com extensão jsx para configurar a apresentação da tela.
Pasta services
Esta pasta deve conter classes javascript que possam auxiliar na obtenção de dados, ou seja, acesso a API's externas, consultas a dados de usuário, etc.
As configurações do seu projeto de mini-app podem ser alteradas através do arquivo ame.conf.js que encontra-se na raiz do projeto, segue o seu conteúdo abaixo:
"name": "Meu minin-app", // Nome do seu mini-app
"title": "Mini-app", // Título apresentado pelo app da AME
"slug": "br.com.meu.miniapp", // Identificador único do mini-app
"name": "Minha empresa", // Nome da sua organização
"email": "seuemail@dominio.com.br" // Email do desenvolvedor
"public-key": "62fe7e43-eaee-4976-839a-f8512f262d09", // Chave pública para pagamento
"ame-super-app-client": "2.2.0", // Versão da API de desenvolvimento
"ame-miniapp-components": "2.0.0", // Versão da biblioteca de componentes
"version": "1.0.0" // Versão do seu mini-app
Utilize um nome bem bacana para seu mini-app, ele não será mostrado dentro do aplicativo da Ame, esse nome serve apenas para distinguir a aplicação.
Este valor define o que será escrito na barra superior do mini-app quando ele está sendo executado dentro do aplicativo principal. Procure utilizar nomes pequenos, geralmente com uma ou duas palavras.
Este valor é um identificador interno e não deve ter colisão com nenhum nome de outro mini-app, caso contrário não será possível publicá-lo. Indicamos o uso de um domínio reverso para evitar colisões com outros nomes.
O valor desta configuração define a versão do mini-app. Este valor será utilizado no momento da publicação do mini-app.
Nesta parte você define valores da sua empresa de desenvolvimento, estes valores são importantes para definirmos acesso e para impedir que pessoas possam publicar mini-apps de outras empresas.
Aqui você adiciona o valor de uma chave cadastrada em nosso sitema, essa chave permite abrir a tela de pagamentos dentro do mini-app e serve para reconhecer o recebedor do pagamento.
Versão dos componentes
Procure manter atualizada a versão da biblioteca de componentes, você pode ver mais informação sobre as versões neste link
O mesmo vale para a versão da API utilizada, quanto mais atual, melhor a confiabilidade e mais métodos auxiliares estarão disponíveis para você, você pode ler informações sobre as versões da API através deste link