Aparência moderna e atualizada para aplicativos baseados em modelo

Os aplicativos baseados em modelo adquirem uma aparência moderna e atualizada quando o recurso Experimentar a nova aparência é ativado pelos usuários finais. A nova aparência fornece um estilo atualizado, incluindo fontes, cores, bordas, sombras e muito mais que se alinham ao sistema Sistema de design do Microsoft Fluent mais recente. A aparência atualizada torna os aplicativos baseados em modelo mais fáceis de usar para que os usuários possam atingir seus objetivos com rapidez e eficiência. O sistema de design do Fluent fornece consistência, qualidade e coerência de plataforma em toda a Microsoft. Ele também fornece uma base sólida para extensibilidade e permitirá suporte ao modo escuro no futuro.

O recurso de aparência moderna e atualizada que agora está ativado por padrão será lançado em um cronograma mais lento do que outros recursos. Mais informações: Gerenciando a distribuição de disponibilidade geral por padrão .

O que está incluído na aparência moderna, atualizada

Veja o que você pode esperar na experiência moderna e atualizada:

• Design atualizado das páginas do formulário, da exibição e do painel, que inclui o uso de sombras e cores de fundo mais brilhantes para criar uma aparência elevada ou flutuante. A aparência flutuante ajuda a separar visualmente as seções e concentra a atenção no conteúdo principal.
• Novos controles baseados no Fluent em formulários, fluxos do processo empresarial e caixas de diálogo. As caixas de diálogo agora são redimensionadas automaticamente com base no conteúdo.
• Uma nova grade do Power Apps no lugar da grade somente leitura nas páginas de exibição e padrão do painel.
• Um novo mecanismo para personalizar as cores do cabeçalho do aplicativo para combinarem com sua identidade visual pessoal ou da organização. Mais informações: Usar temas modernos
• Uma configuração para o usuário final chamada Experimente a nova aparência que permite uma experiência moderna e atualizada.

Barra de comandos

A barra de comando flutuante se alinha com a experiência do Microsoft 365, com espaçamento consistente, cantos arredondados e elevação. Observe como a barra de comandos está em uma seção separada na parte superior da página no exemplo a seguir.

Páginas de exibição

As páginas de exibição usam a nova barra de comandos e têm áreas de grade atualizadas que aproveitam as alterações de elevação para ajudar a chamar a atenção do usuário.

A alteração mais significante nas páginas de exibição é a mudança da grade somente leitura para o controle de grade do Power Apps, que apresenta rolagem infinita para uma experiência de navegação de dados moderna. Essa grade também aparece em subgrades e grades associadas nos formulários principais e nos painéis. O controle de grade do Power Apps também oferece suporte à edição em linha usando a propriedade Habilitar a filtragem. Os criadores podem configurar manualmente suas grades editáveis para usar o controle de grade do Power Apps.

O exemplo a seguir mostra uma página de exibição com a aparência moderna e atualizada.

Páginas de formulário

As páginas de formulário usam a nova barra de comandos e têm cabeçalhos, guias, seções e fluxos do processo empresarial atualizados. Visualizações rápidas, formulários de cartão, cabeçalhos, mapas de sites e controles de linha do tempo também apresentam estilos atualizados.

O exemplo a seguir mostra uma página de formulário com a aparência moderna e atualizada.

Controles de campo

Os controles de campo, como entrada de texto, entrada de ação, pesquisa e controles de caixa de seleção, são criados e projetados usando componentes do Fluent. Mais controles de campo serão modernizados usando o design do Fluent em atualizações futuras.

As seções de campo, que são contêineres para os campos em um formulário, têm um design mais simplificado. Agora os ícones estão no lado direito dos rótulos dos campos. Alguns ícones redundantes foram removidos para que o layout fique mais limpo. O estilo de entrada e mensagem de erro também é atualizado com base no design do Fluent.

O exemplo a seguir mostra um conjunto de campos com a aparência moderna e atualizada.

Página do painel

A página do painel do sistema, com subgrades e gráficos independentes, foi atualizada para usar a nova barra de comandos e tem estilo semelhante às seções nas páginas de formulário e de exibição. Quando a experiência moderna está habilitada, ou ao usar o canal mensal, as grades do painel do sistema usam o novo controle de grade do Power Apps. A nova grade não está habilitada por padrão.

Limitações conhecidas

A aparência moderna e atualizada dos aplicativos baseados em modelo tem algumas limitações:

Aparência moderna e atualizada fora do navegador

O aplicativo móvel e o aplicativo de email não oferecem suporte à aparência moderna e atualizada e não fazem parte da versão preliminar ou da disponibilidade geral.

Alternar temas ou ativar o modo escuro

A troca de temas ou a ativação do modo escuro ainda não é suportada.

Honrando temas clássicos

Com a nova aparência moderna, atualizada, o Power Apps deixa de homenagear as personalizações de tema clássico. No entanto, você pode substituir as cores de cabeçalho do aplicativo para combinar a identidade visual da sua organização com aparência moderna, atualizada. Consulte alterar a cor do cabeçalho do aplicativo para obter mais detalhes. Outras opções de personalização do tema para a aparência moderna, atualizada não estão disponíveis ainda.

Ícones personalizados

Há suporte somente a ícones de SVG. Se você usar outros formatos, como PNG, a navegação não os exibirá e um ícone padrão será exibido.

Perguntas frequentes

Usando a aparência moderna e atualizada no Power Apps Component Framework / componentes de código personalizado

O tema moderno em uso é passado para componentes do Power Apps component framework, permitindo a você criar os componentes com temas modernos como estilo.

Como usar a aparência moderna e atualizada em páginas personalizadas

Controles modernos podem ser usados com páginas personalizadas e a aparência moderna e atualizada. O tema moderno não é atualmente herdado por páginas personalizadas.

Alterar a cor do cabeçalho do aplicativo

É possível alterar a cor do cabeçalho do aplicativo para corresponder à sua organização enquanto estiver na aparência moderna e atualizada. Consulte Usar temas modernos para obter mais detalhes. Outras opções de personalização do tema para a aparência moderna, atualizada não estão disponíveis ainda.

Trabalhando com a aparência moderna e atualizada

Fornecer comentários sobre a aparência moderna e atualizada

Depois de usar a aparência moderna e atualizada em seus aplicativos baseados em modelo, dê sua opinião no fórum da comunidade do Power Apps.

Gerenciando a distribuição de disponibilidade geral de aceitação

A aparência moderna e atualizada dos aplicativos baseados em modelo está disponível nos seguintes canais de lançamento:

• Canal mensal em agosto de 2023
• Canal semestral a partir do ciclo de lançamentos 2 de 2023

Quando estiver disponível para o público geral, os usuários finais verão a configuração Experimente a nova aparência para permitir a experiência moderna e atualizada. Os usuários podem voltar para a interface de usuário (IU) antiga a qualquer momento.

Ativar a aparência moderna e atualizada

Os usuários finais podem habilitar a aparência moderna e atualizada para seus aplicativos baseados em modelo ativando a configuração Experimente a nova aparência no cabeçalho do aplicativo. É possível alternar para a versão anterior a qualquer momento.

Reverter para a IU antiga

Sim, os usuários finais podem voltar para a interface do usuário antiga desativando a alternância Nova aparência. Os fabricantes também podem desativar a nova aparência atualizando as configurações do aplicativo.

Para obter mais informações sobre como desativar a aparência moderna e atualizada, consulte Gerenciar configurações de aplicativos baseados em modelo no designer de aplicativos.

Os administradores podem desabilitar a configuração Nova aparência em todos os aplicativos da organização usando o gerenciador de soluções para definir o valor de Nova aparência para aplicativos baseados em modelo como Não. Isso oculta a alternância Nova aparência e impede que a aparência moderna e atualizada entre em vigor.

1. Abrir https://make.powerapps.com/

2. Em Soluções abra uma solução existente com um ou mais aplicativos baseados em modelo.

3. Selecione Adicionar existente > Mais > Configuração.

4. Procure Nova aparência.

5. Selecione Nova aparência para aplicativos baseados em modelo.

6. Selecione Adicionar para adicioná-la à solução.

7. Selecione Nova aparência para aplicativos baseados em modelo no gerenciador de soluções.

8. Atualize Definir valor do ambiente como Não.

9. Selecione Salvar.

10. Publique todas as personalizações.

    Observação

    Se você estiver usando o ciclo de lançamentos 2 de 2023 e quiser desativar a nova aparência, atualize a configuração Experimentar a nova aparência.

Gerenciando a distribuição de disponibilidade geral ativada por padrão

A aparência moderna e atualizada dos aplicativos baseados em modelo está ativada por padrão nos seguintes canais de lançamento:

• Canal mensal em abril de 2024
• Canal semestral a partir do ciclo de lançamentos 1 de 2024

Quando estiver disponível para o público geral, os usuários finais poderão ver a configuração de Nova aparência habilitada por padrão, mostrando a experiência moderna e atualizada. Os usuários podem voltar para a interface de usuário (IU) antiga a qualquer momento. Para o canal semestral, o lançamento acontecerá lentamente ao longo de muitas semanas a partir de abril. Criadores e administradores devem esperar atrasos na implementação desse recurso em seus aplicativos.

Habilitando a aparência moderna para meu aplicativo e removendo a alternância

Em cenários em que criadores e administradores desejam ativar uma experiência moderna "Sempre ativada", eles podem habilitar isso definindo a configuração Nova aparência sempre ativa no aplicativo. Isso permite a aparência moderna e atualizada para todos os usuários do aplicativo e remove a capacidade de troca de cabeçalho para os usuários finais desativarem a Nova aparência.

Os administradores podem ativar a configuração Nova aparência sempre ativa em todos os aplicativos da organização usando o gerenciador de soluções para definir o valor de Nova aparência sempre ativa como Sim. Isso oculta a alternância Nova aparência e ativa a aparência moderna, atualizada para todos os usuários.

1. Abrir https://make.powerapps.com/
2. Em Soluções abra uma solução existente com um ou mais aplicativos baseados em modelo.
3. Selecione Adicionar existente > Mais > Configuração.
4. Procure por Nova aparência sempre ativa.
5. Selecione Nova aparência sempre ativa.
6. Selecione Adicionar para adicioná-la à solução.
7. Selecione Nova aparência sempre ativa do explorador de soluções.
8. Atualize Definir Valor do Ambiente como Sim.
9. Selecione Salvar.
10. Publique todas as personalizações.