Estilos e tema

Todo o widget tem um bloco de Aspecto no inspector, com as mesmas opções independentemente do tipo. É ai que se muda título, cores, borda e tipografia.

O bloco Aspecto

Grupo	Propriedades
Título	Título, mostrar título, descrição, mostrar descrição
Cores	Fundo, cor do texto, cor do rótulo
Borda	Cor, estilo (continua, tracejada, pontilhada), espessura, raio dos cantos
Espaço	Preenchimento interno
Texto	Alinhamento, tamanho (escala tudo), peso (normal, médio, semi-negrito, negrito)
Rótulo	Espaço até ao campo, largura fixa, alinhamento — só em campos de entrada

Só os valores que definir são aplicados. Deixar uma propriedade em branco não a põe a zero: mantém o default do tema, que é quase sempre o que se quer.

Tamanho: escala o widget inteiro

O campo Tamanho não muda só o texto solto — é a régua a que todo o conteúdo do widget se agarra. Mexer nele escala o widget em proporção: num KPI, o valor, a etiqueta, a badge de período, o ícone e a tendência crescem juntos.

O valor por omissão é 16. Baixá-lo compacta um cartão que não tem espaço; subi-lo destaca o número que interessa mais.

Os ícones estruturais das molduras ficam de fora da escala de propósito — escalá-los partiria o alinhamento dos cabeçalhos. Os ícones dos indicadores de KPI escalam, porque são parte do cartão.

Título e descrição

Widgets com moldura — gráfico, tabela, lista, cartões, KPI, painel, abas, markdown, imagem — mostram um cabeçalho com título e descrição quando estão activos.

É preferível usar este título em vez de colocar um widget de texto por cima: o cabeçalho acompanha o widget quando ele se move, ajusta-se à largura, e reserva o espaço correcto para o conteúdo por baixo.

Tema claro e escuro

A aplicação tem tema claro e escuro, alternado pelo ícone na barra superior (sol, lua ou o do sistema). A escolha é do utilizador que está a ver, não de quem desenhou.

Isto tem uma consequência importante para as cores que escolher.

Cores fixas não mudam com o tema

Se escrever um fundo branco no Aspecto de um painel, esse painel fica branco também no tema escuro — com texto claro por cima, provavelmente ilegível.

Deixar as cores por definir é o caminho seguro: o widget acompanha o tema sozinho. Use cores fixas apenas quando o efeito é mesmo intencional e verifique nos dois temas.

As cores dos gráficos

Os gráficos usam uma paleta de oito cores, sempre pela mesma ordem. A ordem não e decorativa: os pares vizinhos foram verificados para continuarem distinguíveis por quem tem daltonismo.

Por isso, três recomendações:

1. Não reordene a paleta num gráfico sem uma boa razão — a segurança vem da ordem.
2. Mantenha a legenda visível. Três das oito cores têm contraste baixo sobre fundo claro, e a legenda é o que garante que se percebe qual e qual.
3. Menos séries é melhor. Um gráfico com oito séries usa a paleta toda, incluindo os pares mais dificeis. Cinco séries lê-se muito melhor.

Cada gráfico pode ter uma paleta própria nas suas opções, se houver uma razão — cores da marca, por exemplo. Ver Gráficos.

Consistência

Um dashboard lê-se melhor quando as peças se parecem umas com as outras. Três regras simples chegam:

Um tamanho de título por nível. O título do ecrã maior, os títulos dos widgets todos iguais.

Alinhamento por tipo de conteúdo. Números a direita, texto a esquerda, cabeçalhos a acompanhar as células. É o que permite comparar valores em coluna.

A mesma folga entre blocos. Escolha 8 ou 12 píxeis e use sempre o mesmo.

Formatação de números

A formatação não vive no Aspecto — vive em cada widget, onde os números aparecem:

• KPI — casas decimais, forma compacta (1,2 M), separador de milhares, prefixo e sufixo por indicador;
• Tabela — tipo e formato por coluna, com definições regionais próprias se necessário;
• Gráfico — formato dos valores no eixo, nos rótulos e na dica.

Ver Formatos de valor.