Richtlinien für reaktionsfähiges Design

Im Abschnitt "Richtlinien für reaktionsfähiges Design" für Canvas-Apps in Power Apps befassen wir uns mit wesentlichen Strategien und Methoden zum Erstellen von Anwendungen, die nahtlos auf verschiedenen Geräten angepasst werden. Dieser Abschnitt umfasst die wichtigsten Prinzipien von Bildschirmanpassungstechniken bis hin zur Containernutzung, Einstellungsanpassungen und detaillierten Implementierungsschritten. Jede Richtlinie zielt darauf ab, sicherzustellen, dass Ihre Canvas-App eine optimale Benutzererfahrung bietet, unabhängig von der Bildschirmgröße oder Ausrichtung des Geräts, um einen der wichtigsten Aspekte der modernen App-Entwicklung zu behandeln. Diese Richtlinien sind für Entwickler hilfreich, die die Barrierefreiheit und die Benutzerbindung ihrer Power Apps verbessern möchten.

Anpassen an Bildschirmgrößen

Canvas-Apps sollten so konzipiert werden, dass das Layout und die Benutzeroberfläche basierend auf der Bildschirmgröße des Geräts automatisch angepasst werden. Durch diese Reaktionsfähigkeit wird sichergestellt, dass die App auf verschiedenen Geräten, von Smartphones bis hin zu Desktopcomputern, funktionsfähig und visuell ansprechend bleibt.

Verwenden von Containern

Integrieren Sie horizontale und vertikale Container im App-Design. Diese Container sind in der dynamischen Organisation und Ausrichtung von App-Komponenten entscheidend, um sicherzustellen, dass sie effektiv auf Änderungen in Bildschirmabmessungen reagieren.

Deaktivieren Sie „Passend skalieren“ und verwalten Sie das Seitenverhältnis/die Ausrichtung

Es ist wichtig, die Einstellung "An Bildschirm anpassen" zu deaktivieren, um eine echte App-Reaktionsfähigkeit zu ermöglichen, da dadurch eine bloße Skalierung verhindert wird und die Anpassung des natürlichen Layouts an verschiedene Bildschirmgrößen gefördert wird. Darüber hinaus ist es wichtig, das Seitenverhältnis und die Einstellungen „Ausrichtung sperren“ anzupassen. Diese Anpassungen stellen sicher, dass das Layout der App effektiv auf unterschiedliche Bildschirmgrößen und -ausrichtungen reagiert, wobei eine konsistente und funktionale Schnittstelle beibehalten wird, unabhängig davon, ob sich das Gerät im Hoch- oder Querformat befindet.

Dynamische Layouts verwenden

Verwenden Sie Layoutdesigns wie Splitscreen und Randleiste, die verschiedene Benutzeroberflächen auf verschiedenen Geräten bieten. Diese Anpassung verbessert die Funktionalität der App, wodurch sie für Benutzer auf jedem Gerät intuitiver wird.

Verwenden von Formeln für dynamisches Layout

Verwenden Sie Formeln anstelle fester Koordinaten für Positionierungs- und Größenanpassungssteuerelemente, um sicherzustellen, dass sie sich an Änderungen an Bildschirmabmessungen für ein dynamisches, reaktionsfähiges Layout anpassen.

Planung für verschiedene Geräte

Effektives responsives Design bedeutet, vorauszusehen, wie die App auf verschiedenen Geräten aussieht und funktioniert. Dies umfasst Entscheidungen darüber, die Größe von Elementen zu ändern oder sie auf kleineren Bildschirmen vollständig auszublenden, um Platz zu optimieren und die Benutzerfreundlichkeit zu gewährleisten.

Praktische Umsetzung

Das Umwandeln einer nicht reagierenden Canvas-App in eine reaktionsfähige App erfordert einen systematischen Ansatz. Dies umfasst das Anpassen von Einstellungen für die Reaktionsfähigkeit und die sorgfältige Konfiguration von Containereigenschaften, um sicherzustellen, dass elemente in der App an verschiedene Bildschirmgrößen angepasst werden.

Ressourcen

• Power Platform Well-Architected-Anleitung für das Layout

Nächster Schritt