Utilizar temas modernos em aplicações de tela

Os temas modernos são conjuntos de estilos pré-estabelecidos que podem transformar a aparência da sua aplicação. Estes temas, baseados na linguagem de design da Fluent da Microsoft, modificam vários aspetos de estilo, tais como cor, tipografia, limites e sombras, garantindo uma interface visualmente agradável.

Os temas modernos simplificam o processo de personalização e permitem que os criadores concebam sem esforço uma aplicação com um apelo visual unificado e consistente.

Pré-requisitos

Ative a caraterística de temas modernos nas definições da aplicação Power Apps:

1. Abra a sua aplicação ou crie uma nova.
2. Na sua aplicação, abra Definições no menu de criação de aplicações ou na barra de comando moderna.
3. Aceda a Atualizações>Novo>Controlos e temas modernos.
4. Defina o comutador Controlos e temas modernos como Ativado.
5. Feche o pop-up de Definições.

Para mais informações, consulte Ativar controlos e temas modernos para a sua aplicação.

Nota

Quando os controlos e temas modernos estão ativados, não pode selecionar temas clássicos na barra de comando. Para usar temas clássicos descontinuados, aceda a Manter temas clássicos no separador Descontinuados de Atualizações em Definições e alterne para Ativado.

Criar um tema

Existem vários temas de origem disponíveis para dar estilo à sua aplicação. Também pode criar o seu próprio tema para uma estética visual mais personalizada.

1. No menu de criação de aplicações, selecione Temas.

2. No painel Temas, selecione Adicionar um tema.

   

   A caixa de diálogo Criar um tema aparece.

   

3. No diálogo Criar um tema, escolha ou introduza as seguintes informações:

   Caraterística	Ação ou descrição
   Cor principal (provisionamento)	Escolher uma cor no seletor de cores. Pode, alternativamente, introduzir o hexadecimal ou RGB manualmente.
   Bloquear cor principal (pré-visualização)	A paleta de temas de 16 blocos é gerada usando a cor de provisionamento. - Desativado: A paleta de 16 blocos está otimizada para acessibilidade. Desativado é a opção predefinida. - Ativado: A cor da provisionamento é colocada no bloco primário (a meio) da paleta. As cores restantes são geradas ao tornar as cores incrementalmente mais claras de um lado e mais escuras do outro lado. A paleta gerada poderá não cumprir os requisitos de acessibilidade da relação de contraste.
   Nome do tema	Introduza um nome de tema exclusivo.
   Font	Escolha o tipo de letra predefinido usado pelos controlos na aplicação.
   Flexibilidade	Afeta a tonalidade, a sombra ou o tom da paleta. A torção não é aplicável se escolher Bloquear cor primária.
   Saturação	Afeta o mutismo ou a luminosidade da paleta. A saturação não é aplicável se escolher Bloquear cor primária.
   Pré-visualizar	Opcionalmente, veja a pré-visualização estática do novo tema. Pode interagir com os controlos de amostra para ver como o seu tema é aplicado ao estado em repouso e a vários estados de interação.

4. Selecione Criar.

O novo tema é criado e aplicado à sua aplicação.

Aplicar tema moderno

1. No menu de criação de aplicações, selecione Temas.
2. No painel Temas, selecione um dos temas predefinidos.
3. Se tiver controlos clássicos na sua aplicação, ser-lhe-á pedido para aplicar o tema moderno a estes controlos. Pode sempre selecionar Anular na barra de comando se não gostar do tema.

   Nota

   Quando escolhe aplicar temas modernos a controlos clássicos, as fórmulas do Power Fx são definidas em propriedades dos controlos afetados que referenciam variáveis do tema moderno. Visualmente, os controlos clássicos podem não se alinhar exatamente com os seus equivalentes de controlo modernos, já que os controlos clássicos não são baseados no Fluent v9.

Quando um tema moderno é selecionado, o estilo do tema é aplicado automaticamente aos controlos na sua aplicação. Esta ação define a propriedade App.Theme.

Editar um tema

Pode editar o tema e alterar um ou mais parâmetros do tema personalizado.

1. No menu de criação de aplicações, selecione Temas.

2. No painel Temas, localize o mosaico do tema que pretende editar e selecione o menu de capacidade excedida e, em seguida, Editar.

   

3. No painel Editar tema, ajuste o tema conforme necessário.

4. Selecione Guardar ou Cancelar fora da caixa de diálogo.

Nota

Não pode editar temas de origem.

Eliminar um tema

Se decidir que já não precisa de um tema personalizado na sua aplicação, pode eliminá-lo.

1. No menu de criação de aplicações, selecione Temas.
2. No painel Temas, localize o tema que pretende editar, selecione o menu de capacidade excedida e, em seguida, selecione Eliminar.
3. Na caixa de diálogo de confirmação, selecione Eliminar tema.

Se tiver fórmulas do Power Fx que referenciem este tema na sua aplicação, precisa de atualizar manualmente a fórmula.

Nota

Não pode eliminar temas de origem.

Utilizar temas com o Power Fx

Estão disponíveis objetos de tema moderno para os criadores utilizarem o Power Fx. O objeto de tema atualmente ativo pode ser referenciado por App.Theme. Qualquer tema carregado na aplicação pode ser referenciado pelo respetivo nome de instância, como RedTheme. Recomendamos que referencie o objeto de tema utilizando App.Theme para garantir que as seleções de cor se adaptam a alterações de tema.

Cada objeto de tema inclui as seguintes informações:

• Nome do tema
• Cores, uma coleção de rampa de marca de 16 cores acessível individualmente pelo nome; a Cor de primeiro plano primária é a cor do texto predefinida, por exemplo, a cor do texto num plano de fundo
• Tipo de letra usado no tema

A imagem mostra as variáveis de ranhura dentro da coleção Cores e, como exemplo, as cores correspondentes para o tema Aço.

Utilizando a rampa da marca do tema, pode personalizar manualmente um controlo clássico com base no tema moderno atual, por exemplo Button.Fill = App.Theme.Colors.Primary.

Nota

Para fornecer feedback, consulte: Fornecer o seu feedback à Microsoft.

Veja também

Publicação de blogue de controlos modernos
Utilizar temas modernos com o Power Apps (vídeo)