Richtlinien und Prüfliste für App-Leisten (Windows Store-Apps)

Befolgen Sie diese Richtlinien, wenn Sie mit App-Leisten für Windows Store-Apps arbeiten.

Roadmap: Wie hängt dieses Thema mit anderen zusammen? Informationen finden Sie unter:

• Roadmap für Windows Store-Apps mit C# oder Visual Basic
• Roadmap für Windows Store-Apps mit C++
• Windows Store-App-Benutzeroberfläche von A bis Z, hervorgehoben in unserer Serie App-Features von A bis Z

Richtlinien für die Benutzeroberfläche

App-Leisten ermöglichen dem Benutzer bei Bedarf den einfachen Zugriff auf Befehle. Der Benutzer kann über den unteren Bildschirmrand wischen, um App-Leisten anzuzeigen, und kann mit deren Inhalt interagieren, um sie vom Bildschirm zu entfernen. App-Leisten können auch zum Anzeigen von Befehlen oder Optionen verwendet werden, die aus dem jeweiligen Benutzerkontext stammen, wie z. B. Fotoauswahl oder Zeichnungsmodus.

Wenn bestimmte Befehle erforderlich sind, damit ein Benutzer einen Workflow (z. B. das Kaufen eines Produkts) abschließen kann, legen Sie diese Befehle auf der Canvas statt auf App-Leisten ab.

Richtlinien für Befehle auf der App-Leiste

Befolgen Sie diese Richtlinien, wenn Sie Befehle auf der App-Leiste ablegen.

• Erstellen Sie getrennte, unterschiedliche Befehlsgruppen auf den entgegengesetzten Seiten der App-Leiste.

  Wenn Sie unterschiedliche Befehlssätze haben (beispielsweise einen Satz zum Erstellen neuer Inhalte und einen zum Filtern der Ansicht), platzieren Sie einen Satz auf der rechten und einen auf der linken Seite der App-Leiste.

  Wenn Sie mehr als zwei Sätze haben, trennen Sie die Sätze durch eine Trennlinie.

• Verwenden Sie in der gesamten App eine einheitliche Position für Befehle.

  Jede Seite sollte zwar nur die jeweils relevanten Befehle enthalten, aber Befehle, die auf beiden Seiten verwendet werden, sollten sich möglichst an der gleichen Stelle befinden, damit die Benutzer die Befehle an der erwarteten Stelle finden.

• Halten Sie sich an Platzierungskonventionen.

  • Platzieren Sie die Schaltflächen "Neu", "Hinzufügen" und "Erstellen" mit den zugehörigen Symbolen ganz rechts.
  • Gruppieren Sie Wechselschaltflächen, und platzieren Sie sie ganz links.
  • Platzieren Sie die Befehle "Akzeptieren", "Ja" und "OK" links von den Befehlen "Ablehnen", "Nein" und "Abbrechen".

• Zeigen Sie Befehle kontextbezogen auf einer App-Leiste an, wenn ein Element ausgewählt wird, und zeigen Sie die App-Leiste automatisch an.

  Die meisten Benutzer sind Rechtshänder. Zeigen Sie daher, wenn Benutzer ein Element auf der App-Seite auswählen, die für das jeweilige Element relevanten Befehle auf der linken Seite der App-Leiste an. Auf diese Weise verdecken die Benutzer die Befehle nicht mit dem Arm oder der Hand.

• Setzen Sie für die Anzeige von Kontextbefehlen den Modus zum Schließen der App-Leiste auf "Einrasten".

  Wenn Sie Kontextbefehle auf einer App-Leiste verwenden, legen Sie für die Dauer des Kontexts den Einrastmodus fest, damit die Leiste bei Benutzerinteraktionen mit der App nicht automatisch ausgeblendet wird. Deaktivieren Sie den Einrastmodus, wenn der Kontext nicht mehr besteht.

  Beispiel: Sie möchten möglicherweise Kontextbefehle für die Fotobearbeitung anzeigen, wenn Benutzer ein Bild auswählen. Es soll den Benutzern möglich sein, weiter mit dem Bild zu arbeiten, beispielsweise um es zu drehen oder zuzuschneiden. In diesem Fall bleibt die Leiste sichtbar, bis die Benutzer die Auswahl des Bilds aufheben oder die App-Leiste mit einer Streifbewegung über den Bildschirmrand schließen.

• Wenn zu viele Befehle vorhanden sind, verwenden Sie Menüs und Flyouts.

  Wenn Sie nicht alle Befehle als separate Schaltflächen auf einer App-Leiste unterbringen können, gruppieren Sie sie, und ordnen Sie die Befehle in Menüs an, die über die Schaltflächen auf der App-Leiste geöffnet werden können.

  

  Verwenden Sie für die Befehle logische Gruppierungen. Platzieren Sie z. B. die Befehle "Antworten", "Allen antworten" und "Weiterleiten" im Menü "Antworten".

  Erstellen Sie keine Menüs, wie "Mehr" oder "Erweitert" ür nicht zusammenhängende sonstige Befehle. Diese Art generischer Befehle führt dazu, dass eine App komplizierter wirkt. Nur eine kleine Untergruppe von Benutzern verwendet diese Menüs. Wenn ein Überlauf erforderlich ist und keine logischen Gruppierungen verfügbar sind, sollten Sie die App vereinfachen.

• Entwickeln Sie Ihre App-Leiste für die angedockte Ansicht und das Hochformat.

  Sie sollten die Befehle in der App-Leiste so festlegen, dass sie in der angedockten Ansicht und im Hochformat richtig angezeigt werden.

  Weitere Informationen hierzu finden Sie unter So wird's gemacht: Verwenden einer App-Leiste in verschiedenen Ansichten.

• Entwickeln Sie für den horizontalen Bildlauf.

  Wenn die App unten auf der App-Seite einen horizontalen Bildlaufbereich enthält, verringern Sie die Höhe des Bildlaufbereichs bei Anzeige im Einrastmodus. Anderenfalls kann die App-Leiste die Bildlaufleiste verdecken, und die Benutzer müssen die App-Leiste umständlich schließen, um den Bildlauf fortzusetzen. Versuchen Sie, den unteren Rand der Bildlaufleiste bündig am oberen Rand der App-Leiste zu positionieren.

• Verwenden Sie keine Standardstile für Befehle, Menüs und Flyouts.

  Benutzer gewöhnen sich an die Platzierung und Größe von Schaltflächen. Daher empfehlen wir, wenn Sie eine App-Leiste anpassen möchten, die Farben des Hintergrunds, die Symbole und die Beschriftungen anzupassen, nicht jedoch die Größe oder den Abstand der Schaltflächen. Das Standardlayout ist so gestaltet, dass es die Fingereingabe unterstützt und bei allen unterstützten Bildschirmbreiten zehn Befehle beherbergen kann. Änderungen am Layout können zu unerwünschtem Verhalten führen.

  Weitere Informationen finden Sie unter Schnellstart: Formatieren von Schaltflächen auf der App-Leiste.

• Verwenden Sie die untere App-Leiste für Befehle und die Navigationsleiste zur Navigation.

  Verwenden Sie im Allgemeinen die untere App-Leiste für Befehle, die auf die aktuelle Seite angewendet werden. Verwenden Sie die Navigationsleiste für Navigationselemente, mit denen der Benutzer auf eine andere Seite gelangt.

• Verwenden Sie die integrierten Symbole für Befehle.

  Weitere Informationen finden Sie unter Schnellstart: Formatieren von Schaltflächen auf der App-Leiste.

• Legen Sie keine wichtigen Befehle in die App-Leiste.

  Platzieren Sie auf der App-Leiste keine Befehle, die für die entscheidenden Merkmale einer App wichtig sind. Platzieren Sie beispielsweise in einer Kamera-App den Befehl zum Aufnehmen nicht auf einer App-Leiste, sondern auf der App-Seite. Sie können der App-Seite eine Schaltfläche hinzufügen oder einfach das Aufnehmen des Bilds durch Tippen auf die Vorschau ermöglichen.

• Platzieren Sie keine Befehle für die An- oder Abmeldung oder für die sonstige Kontoverwaltung auf der App-Leiste.

  Sämtliche Befehle zur Kontoverwaltung, wie die An- und Abmeldung, die Kontoeinstellungen oder das Erstellen eines Kontos, sollten in einem Einstellungs-Flyout eingefügt werden. Wenn es wichtig ist, dass sich die Benutzer auf einer bestimmten Seite anmelden, stellen Sie die Anmeldeschaltfläche auf der App-Seite bereit.

• Legen Sie keine Befehle für die Zwischenablage in die App-Leiste.

  Platzieren Sie die Befehle zum Ausschneiden, Kopieren und Einfügen auf der App-Seite statt auf der App-Leiste.

• Platzieren Sie keine App-Einstellungen auf der App-Leiste.

  Alle App-Einstellungsbefehle, beispielsweise Standardeinstellungen und Voreinstellungen, gehören in ein Einstellungsflyout. Das Einstellungsflyout eignet sich auch optimal für selten verwendete Verwaltungsbefehle, beispielsweise die Befehle zum Löschen des Verlaufs.

Funktionsweise der rechten Maustaste

Damit die Benutzeroberfläche Ihrer App in den Grundzügen der anderer Windows Store-Apps entspricht, müssen Benutzer mit der rechten Maustaste klicken, um die von Ihnen erstellte App-Leiste aufzurufen. Wenn die rechte Maustaste in Ihrer App einem anderen Zweck dienen muss, beispielsweise für Sekundärfeuer in einem Spiel oder als virtueller Trackball in einem 3D-Viewer, kann die App Ereignisse ignorieren, die zum Einblenden der App-Leiste führen. Berücksichtigen Sie jedoch die App-Leiste oder ein ähnliches Kontextmenü im Steuerungsmodells des Spiels, denn sie spielt eine wichtige Rolle für Windows Store-Apps.

Beachten Sie diese Richtlinien, wenn Sie die Steuerungen für Ihre App entwickeln:

• Wenn die rechte Maustaste in Ihrer App für eine wichtige Funktion benötigt wird, verwenden Sie sie direkt für diese Funktion. Aktivieren Sie kontextbezogene Steuerelemente oder die App-Leiste nur, wenn es für den Workflow wichtig ist.
• Wenn es Bereiche der Microsoft DirectX-Oberfläche gibt, die keine App-spezifischen kontextbezogenen Rechtsklickaktionen erfordern (z. B. Randmenüs), legen Sie fest, dass die App-Leiste angezeigt wird, wenn der Benutzer mit der rechten Maustaste auf diese Bereiche klickt.
• Wenn überall auf der Canvas das Klicken mit der rechten Maustaste unterstützt werden muss, können Sie z. B. festlegen, dass die App-Leiste durch Rechtsklick auf die oberste oder unterste waagerechte Pixelreihe aufgerufen wird.
• Wenn keine dieser Lösungen geeignet ist, positionieren Sie ein benutzerdefiniertes Steuerelement auf der DirectX-Oberfläche, damit die App-Leiste mit einer Mausbewegung geöffnet werden kann.
• Verwenden Sie Ereignisse der MouseDevice-Klasse, z. B. MouseMoved, um eigene Kontextmenüverhalten zu implementieren.
• Bei Verwendung der Fingereingabe entspricht ein langes Drücken sowie Drücken und Halten einem Klick mit der rechten Maustaste. Beide Ereignisse müssen auf ähnliche Weise gehandhabt werden. Um dieses Ereignis und sein benutzerdefiniertes Verhalten festzulegen, führen Sie die Registrierung für das Holding-Ereignis durch. Um Halten zu aktivieren, legen Sie die GestureSettings-Eigenschaft zur Unterstützung von Finger-, Stift- und Styluseingabe fest. Um das Halten mit einer Maus zu aktivieren, legen Sie HoldWithMouse für die GestureSettings-Eigenschaft fest.
• Definieren Sie in Ihrer App kein alternatives Verhalten für die Tastenkombination Win+Z. Entwickeln Sie eine App-Leiste oder ein ähnliches Kontextmenü, das angezeigt wird, wenn der Benutzer die Windows-Taste in Verbindung mit der Z-Taste drückt. Registrieren Sie die App für das KeyDown-Ereignis und das AcceleratorKeyActivated-Ereignis, damit das Drücken dieser beiden Tasten erkannt wird.

Verwandte Themen

Schnellstart: Hinzufügen von App-Leisten

Schnellstart: Formatieren von Schaltflächen auf der App-Leiste

So wird's gemacht: Verwenden einer App-Leiste in verschiedenen Ansichten

AppBar