Orientações de design responsivo

As aplicações de tela reativas adaptam a respetiva disposição e navegação à área de visualização disponível, em vez de redimensionarem uma tela fixa. Projete o comportamento responsivo intencionalmente para que a aplicação continue utilizável em todos os tamanhos de janela, orientação do dispositivo, nível de zoom e modo de entrada suportados.

Cada uma das seguintes diretrizes visa garantir que a sua aplicação canvas proporcione uma experiência de utilizador ótima, independentemente do tamanho ou orientação do ecrã do dispositivo. Estas diretrizes abordam um dos aspetos mais críticos do desenvolvimento moderno de aplicações. Estas diretrizes são fundamentais para programadores que pretendem melhorar a acessibilidade e o envolvimento dos utilizadores nas suas Power Apps.

Adaptar-se a tamanhos de ecrã

As aplicações canvas devem ser projetadas para ajustarem automaticamente o seu layout e interface com base no tamanho do ecrã do dispositivo. Esta capacidade de resposta garante que a aplicação permanece funcional e visualmente apelativa em vários dispositivos, desde smartphones a computadores de secretária.

Usar contentores de disposição automática

Use contentores de auto-layout horizontal e vertical como estrutura principal para um ecrã responsivo. Estes contentores organizam e alinham dinamicamente os componentes da aplicação, garantindo que respondem eficazmente às alterações nas dimensões do ecrã.

Desativar Dimensionar para Ajustar e gerir a proporção e a orientação

Desative a definição Dimensionar para Ajustar para ativar a verdadeira capacidade de resposta da aplicação. Esta configuração impede o escalonamento e promove a adaptação natural do layout a vários tamanhos de ecrã. Além disso, ajusta a proporção de aspeto e as definições de Orientação do Bloqueio . Estes ajustes garantem que o layout da aplicação responde eficazmente a diferentes tamanhos e orientações de ecrã. A aplicação mantém uma interface consistente e funcional, quer o dispositivo esteja em modo retrato ou paisagem.

Utilizar layouts responsivos

Use designs de layout como ecrã dividido e barra lateral, que oferecem diferentes experiências de utilizador em vários dispositivos. Esta adaptabilidade melhora a funcionalidade da aplicação, tornando-a mais intuitiva para os utilizadores em qualquer dispositivo.

Utilizar fórmulas para esquema dinâmico

Use fórmulas em vez de coordenadas fixas para controlos de posicionamento e dimensionamento. Esta abordagem garante que se adaptam às alterações nas dimensões do ecrã para um layout dinâmico e responsivo.

Planear para vários dispositivos

Um design reativo eficaz envolve antecipar o aspeto e as funções da aplicação em diferentes dispositivos. Esta antecipação inclui decisões sobre redimensionar elementos ou escondê-los inteiramente em ecrãs mais pequenos para otimizar o espaço e manter a usabilidade.

Aplicação prática

Transformar uma aplicação de tela não responsiva numa aplicação responsiva requer uma abordagem sistemática. Esta abordagem envolve ajustar definições para a resposta e configurar cuidadosamente as propriedades dos contentores, para garantir que os elementos dentro da aplicação se adaptam a diferentes tamanhos de ecrã.

Resources

Próximo passo

Legibilidade do código

  • Última atualização a