Linee guida di progettazione reattiva

Le app canvas con layout adattivo adattano il layout e la navigazione in base all'area di visualizzazione disponibile anziché ridimensionare un canvas fisso. Progettare un comportamento reattivo intenzionalmente in modo che l'app rimanga utilizzabile in ogni dimensione della finestra supportata, orientamento del dispositivo, livello di zoom e modalità di input.

Ognuna delle linee guida seguenti è volta a garantire che l'app canvas offra un'esperienza utente ottimale, indipendentemente dalle dimensioni o dall'orientamento dello schermo del dispositivo. Queste linee guida riguardano uno degli aspetti più critici dello sviluppo di app moderne. Queste linee guida sono fondamentali per gli sviluppatori che desiderano migliorare l'accessibilità e il coinvolgimento degli utenti dei propri siti Power Apps.

Adattarsi alle dimensioni dello schermo

Le app canvas dovrebbero essere progettate per adattare automaticamente il layout e l'interfaccia in base alle dimensioni dello schermo del dispositivo. Questa reattività garantisce che l'app rimanga funzionale e visivamente accattivante su vari dispositivi, dagli smartphone ai computer desktop.

Usare i contenitori di layout automatico

Usare contenitori di layout automatico orizzontale e verticale come struttura principale per uno schermo reattivo. Questi contenitori organizzano e allineano dinamicamente i componenti dell'app, assicurandosi che rispondano in modo efficace alle modifiche apportate alle dimensioni dello schermo.

Disabilitare La scalabilità per adattarsi e gestire proporzioni e orientamento

Disattiva l'impostazione Adatta alla dimensione per abilitare la reale adattabilità dell'app. Questa impostazione impedisce il ridimensionamento e promuove l'adattamento naturale del layout a varie dimensioni dello schermo. Inoltre, regola il rapporto d'aspetto e le impostazioni di Blocca orientamento. Queste regolazioni assicurano che il layout dell'app risponda in modo efficace a diverse dimensioni e orientamenti dello schermo. L'app mantiene un'interfaccia coerente e funzionale indipendentemente dal fatto che il dispositivo sia in modalità verticale o orizzontale.

Uso dei layout reattivi

Usare progettazioni di layout come split-screen e barra laterale, che offrono esperienze utente diverse su vari dispositivi. Questa adattabilità migliora la funzionalità dell'app, rendendola più intuitiva per gli utenti su qualsiasi dispositivo.

Usare le formule per il layout dinamico

Usare formule anziché coordinate fisse per il posizionamento e il ridimensionamento dei controlli. Questo approccio garantisce che si adattino alle modifiche apportate alle dimensioni dello schermo per un layout dinamico e reattivo.

Pianificare vari dispositivi

Una progettazione reattiva efficace implica anticipare l'aspetto e il funzionamento dell'app su diversi dispositivi. Questa previsione include decisioni sul ridimensionamento degli elementi o nasconderle interamente su schermi più piccoli per ottimizzare lo spazio e mantenere l'usabilità.

Implementazione pratica

Trasformare un'app canvas non responsiva in un'app reattiva richiede un approccio sistematico. Questo approccio prevede la regolazione delle impostazioni per la velocità di risposta e la configurazione attenta delle proprietà del contenitore per garantire che gli elementi all'interno dell'app si adattino a dimensioni dello schermo diverse.

Resources

• Creare layout reattivi nelle app canvas
• Creazione di app canvas reattive
• Organizzare i controlli nelle app canvas accessibili
• Esaminare un'app canvas per l'accessibilità
• Panoramica dei controlli e dei temi moderni nelle app canvas
• Aggiornamenti recenti ai controlli moderni nelle app canvas
• Suggerimenti per l'ottimizzazione del layout

Passaggio successivo

Leggibilità del codice