Windows-Apps
Inhaltsverzeichnis reduzieren
Inhaltsverzeichnis erweitern

Entwerfen flexibler Layouts (Apps im Metro-Stil mit JavaScript und HTML)

[Diese Dokumentation ist vorläufig. Änderungen vorbehalten.]

In Windows 8 bezeichnet eine Ansicht die Art und Weise, in der sich der Inhalt der Windows-UI im Metro-Stil daran anpasst, wie ein Benutzer auf Metro-Apps zugreift und sie verwendet. Eine App im Metro-Stil, die mehrere Ansichten unterstützt, kann auf Geräten verschiedener Größen und Ausrichtungen verwendet werden und ermöglicht es den Benutzern, den Inhalt an ihre Anforderungen und Vorlieben anzupassen.

Ansichtszustand

Der Ansichtszustand bezeichnet eine von drei Methoden, die der Benutzer zum Anzeigen der Apps im Metro-Stil auswählen kann: "Andocken", "Füllen" und "Vollbild" (siehe folgende Abbildungen).

Ansichtszustand "Vollbild"

Vollbild

Die App füllt den gesamten Bildschirm aus.

Ansichtszustand "Andocken"

Angedockt

Die App wird an einem kleinen Bereich des gesamten Bildschirms angedockt.

Ansichtszustand "Füllen"

Füllen

Die App füllt den verbleibenden Bildschirmbereich aus, der nicht von der angedockten App belegt ist.

 

Da Benutzer mit bis zu zwei Apps gleichzeitig arbeiten können, sollten Ihre Layouts ausreichend flexibel sein, um alle drei Zustände zu unterstützen.

Wenn Sie die Ansichten "Vollbild", "Andocken" und "Füllen" einplanen, wird die Benutzeroberfläche der App dynamisch umgebrochen und kann sich der Bildschirmgröße, der Ausrichtung und den Benutzerinteraktionen problemlos anpassen.

Bildschirmausrichtung

Da Benutzer ihre Tablets, Slates und Monitore drehen und kippen können, muss Ihre App sowohl Quer- als auch Hochformate unterstützen.

Quer- und Hochformatlayouts

Benutzerinteraktionen

Gute Apps unterstützen Benutzer dabei, die gewünschten Aktionen mit dem Inhalt in der Benutzeroberfläche auszuführen.

Beim Entwerfen der App sollten Sie überlegen, welche Bereiche der Benutzeroberfläche Verschiebung und Bildlauf, optischen und semantischen Zoom und das Ändern der Größe von Objekten unterstützen sollen.

Erstellen Sie Ansichten, die es dem Benutzer ermöglichen, die Größe von Objekten zu ändern und den Inhalt der App zu vergrößern.

Bereich, der Größenänderungen unterstützt

Lassen Sie die Benutzeroberfläche ggf. den Bildschirmbereich überlaufen, sodass sie sich auf zusätzliche "Seiten" erstreckt. In diesen Fällen können die Benutzer die großen Oberflächen mit Verschiebung und Bildlauf erkunden und den Inhalt auf den zusätzlichen Seiten anzeigen.

Verschieben mehrerer Inhaltsseiten

Inhalt dieses Abschnitts

ThemaBeschreibung

Schnellstart: Definieren von App-Layouts für Ansichtszustände

Sie können App-Layouts für jeden UI-Ansichtszustand im Windows Metro-Stil – Hochformat, Querformat, angedockt und gefüllt – definieren.

Richtlinien zum Skalieren auf die Pixeldichte

Windows skaliert Anwendungen, um unabhängig von der Pixeldichte des Bildschirms einheitliche Größen von UI-Elementen zu gewährleisten. In diesem Thema wird beschrieben, wie Sie eine App erstellen, deren Layout und Bildern auch skaliert gut aussehen.

Richtlinien zum Skalieren auf Bildschirme

In diesem Thema werden bewährte Methoden zum Gestalten und Erstellen eines Layouts für Metro-Apps beschrieben, das sich an die verschiedenen von Windows 8 unterstützten Bildschirmgrößen anpasst.

Richtlinien für angedockte und gefüllte Ansichten

Diese Richtlinien sollen Ihnen helfen, die UI einer App im Metro-Stil so zu designen, dass sie sich erfolgreich an jeden Ansichtszustand anpasst.

 

 

 

Anzeigen:
© 2017 Microsoft