O menu Estilo do App permite-lhe gerenciar o design geral do seu aplicativo em um único menu.
Todas as opções escolhidos neste menu são aplicadas globalmente a todas as seções do seu aplicativo.

⚠️ Importante

Se modificar uma opção no menu Estilo do App, todas as definições de design previamente configuradas ao nível da seção serão substituídas.
As novas definições de Estilo do app irão substituir os designs específicos para cada seção e serão aplicadas a todas as seções do aplicativo.

Para configurar o design essencial do Estilo do App:
1. Vá para o menu esquerdo "Meu App"
2. Clique em "Estilo do app " na coluna da direita.

Para uma modificação a fundo do design de uma seção específica, por favor leia esta ajuda online  sobre as configurações de design a nível da seção.


1

Cores

1. Defina o seu tema de cores
Um tema de cores é um conjunto de cores complementares que são aplicadas globamente no seu aplicativo. 
A Goodbarber fornece várias opções: pode escolher de esquemas de cores pré-definidos, usar a Paleta Mágica para gerar um tema automaticamente, ou criar o seu próprio tema do zero ou ao editar uma paleta existente.

2. Personalize as cores em mais detalhe
Uma vez que o seu tema esteja definido, pode agora afinar como as cores são usadas para cada elemento do seu aplicativo. Por exemplo: 
- Cabeçalho: cor do título, cor do ícone e cor de fundo
- Cores primárias usadas pelo aplicativo
- Cor de fundo do aplicativo
- Cores dos botões
- E mais

Isto permite-lhe controlar com precisão a identidade visual do seu aplicativo.

3. Aplicar o tema ao seu app
Depois de configurar e personalizar a suas cores, aplique o tema no seu aplicativo.
Estas configurações serão automaticamente aplicadas pelas suas seções, ajudando-o a poupar tempo e a manter um design consistente pelo app.


2

Tipografia

O texto na sua app segue uma hierarquia clara de modo a garantir uma leitura fácil e uma consistência visual.
São usados oito níveis de texto para exibir títulos, subtítulos, e conteúdos de parágrafo.

1. Selecione um tema de fontes
O menu Estilo do App permite-lhe escolher um tema de fontes composto por três fontes complementares.
Esta combinação de fontes é aplicada globalmente pela sua app para manter uma visual harmonioso.

2. Defina o tamanho do texto usando o cursor
O Estilo do App calcula automaticamente o tamanho da fonte para cada nave lee texto para respirar a hierarquia do mesmo.
Ajustar o cursor faz escalar todos os níveis proporcionalmente enquanto preserva uma leitura fácil.

3. Personalize fontes por cada nível
Pode personalizar as fontes por cada nível de texto individualmente.
Todas as fontes da biblioteca Google Fonts library estão disponíveis, assim como as fontes nativas instaladas por defeito nos dispositivos dos seus usuários.

Para uma melhor consistência visual, recomendamos que não use mais do que três fontes no seu aplicativo.

Pode também adicionar fontes personalizadas * ao clicar no ícone + no menu de lista. Esta fonte será então adicionada à lista mãe de fontes.
*Importante: As fontes podem estar ligadas a direitos de autor e restrições de licenciamento, seja para fins pessoais ou comerciais.
Por favor verifique que tem o direito de usar e distribuir qualquer fonte no contexto do seu aplicativo ao revisar os seus termos de uso.


4. Ajustar propriedades de fontes
Por cada fonte, pode definir a sua altura, altura de linha e espaçamento entre letras.

5. Aplicar as definições da sua fonte
Uma vez que as suas fontes estejam definidas e personalizadas, pode aplicar as modificações no seu aplicativo.
Estas definições são definidas automaticamente em todas as seções, ajudando-o a poupar tempo e a manter um design consistente pelo seu aplicativo


3

Botões

Na sua app, os botões são usados nas páginas que solicitam uma ação ao seu usuário.
Existem três níveis de botões, cada um desenhado para um tipo de acção e contexto específicos dentro das seções e widgets Home.

A GoodBarber automaticamente associates o nível de botão apropriado baseado na ação e onde o botão é exibido na app.

- Nível 1: Botão de ação primário, exibido sempre como um botão preenchido.
- Nível 2: Botão de ação secundário,  exibido sempre como um botão delineado.
- Nível 3: Botão de ação terciário,  exibido sempre como um link de texto apenas.

2. Defina a forma do botão
A partir do. menu Estilo do App, pode escolher a forma aplicada a todos os botões do seu app:
- Quadrado
- Arredondado
- Redondo

Esta definição aplica-se globalmente a todos os níveis de botão.

Importante
-  As cores dos botões são baseadas no esquema de cores do seu app. Pode substituir a cor de um botão em específico a partir do painél de design da seção ou das definições de widget .
- O nível de botão é definido pela GoodBarber e não pode ser modificado manualmente.


4

Campos de formulário

No menu Estilo do App, pode definir a aparência global dos campos de formulário ao configurar:

- A forma do campo (quadrado, arredondado, or redondo)
- O tamanho do campo e layout (pequeno, médio, or grande)
- A posição da etiqueta  (título dentro ou título acima do campo)

Uma vez modificado, estes estilos de campo serão automaticamente usados em cada seção e widget.
A configuração global ajuda-o a manter um design consistente no seu aplicativo sem ter de ajudar todos os campos manualmente.


Outros artigos