Hinweis
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, sich anzumelden oder das Verzeichnis zu wechseln.
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, das Verzeichnis zu wechseln.
Beim Entwerfen eines SharePoint-Webparts benötigen Sie manchmal eine sekundäre Interaktionsebene, z. B. ein Element in einer Liste oder ein einzelnes Foto in einer Galerie. In diesem Artikel wird erläutert, wie Sie Sekundärzustand-Symbolleisten, Standardbefehle, Skalierung und Interaktionszustände verwenden, um ein einzelnes Element auszuwählen.
Sekundäre Webpart-Konfigurationen und -Symbolleisten folgen den gleichen Mustern wie Einzelzustand-Webparts, wie z. B. ein Bild- oder ein Datei-Viewer. Elemente der zweiten Ebene können eigene Symbolleisten und entsprechende Eigenschaftenbereiche besitzen, damit Autoren das Webpart einfacher mit aussagekräftigen Inhalten und Daten konfigurieren können. Beachten Sie, dass zwischen Konfigurationsoptionen in Webparts mit zwei Ebenen eine klare Trennung bestehen sollte. Wir empfehlen, die Quellen-, Filter- und Layout-Konfiguration sowie alle weiteren Optionen, die das Webpart als Ganzes beeinflussen, auf der ersten Ebene beizubehalten.
Nachfolgend finden Sie einige Webpart-Beispiele zu Referenzzwecken:
- Bildergalerie
- QuickLinks
Sekundäre Symbolleisten
Bei einzelnen Elementen in einem Webpart-Layout werden sekundäre Symbolleisten verwendet, die die Konfiguration auf Elementebene im Eigenschaftenbereich und andere Befehle wie Verschieben unterstützen müssen, um Elemente in einem Layout neu anzuordnen oder ein Element zu entfernen/löschen. Sie können auch benutzerdefinierte Befehle in dieser Symbolleiste hinzufügen, die den Anforderungen Ihres Webparts entsprechen.
Auswahlzustände
Symbolleisten auf zweiter Ebene innerhalb eines Webparts besitzen drei grundlegende Befehle: Bearbeiten, Verschieben und Entfernen. Bei der Erstellung eines Webparts auf sekundärer Ebene ist es wichtig, die Implementierung dieser Auswahlzustände in Betracht zu ziehen.
Die Symbolleiste der zweiten Ebene sollte nur angezeigt werden, wenn der Autor ein einzelnes Element (durch Klicken/Tippen) auswählt. Zeigen Sie nicht alle Symbolleisten der zweiten Ebene für alle Elemente gleichzeitig an, da dies den Benutzer verwirren könnte. Darüber hinaus sollte die Symbolleiste beim Darüberfahren nicht angezeigt werden, da dies bei Geräten, die auf Berührung reagieren, zu Bedienbarkeitsproblemen führen könnte.
Das umgebende Feld und/oder die Kontur der einzelnen Elemente auf zweiter Ebene sollten beim Darüberfahren vom Standardzustand in primäre Farbe wechseln und bei der Auswahl sollte die primäre Farbe beibehalten werden. Es ist wichtig, dass der aktive Status für das umgebende Feld und die Symbole beibehalten wird, damit der Benutzer versteht, welches Element ausgewählt wird, wenn er den Eigenschaftenbereich verwendet oder Elemente neu anordnet.
Es folgt ein Beispiel für ein einzelnes Element der zweiten Ebene im Bildergalerie-Webpart:
Element bearbeiten-Ebene – Der Eigenschaftenbereich mit bestimmten Konfigurationsoptionen auf Elementebene wird geöffnet. Beachten Sie, dass der Zustand „Aktiv/Ausgewählt“ für das umgebende Feld beibehalten bleibt.
Verschieben – Die Transparenz des Elements sinkt auf 65 %, und das Element ist von einem Schlagschatten umgeben.
Entfernen – Wenn das Entfernensymbol X ausgewählt wird, werden die Symbolleiste und das Element ausgeblendet, damit Platz für den Umbruch des Layouts vorhanden ist.
Eigenschaftenbereiche
Eigenschaftenbereiche funktionieren auf der zweiten Elementebene eines Webparts genauso wie bei der ersten Auswahl des gesamten Webparts. Der Fokus wechselt von der ersten Ebene auf die Auswahl der zweiten Ebene und ermöglicht es dem Autor, ein einzelnes Element zu konfigurieren.
Im folgenden Beispiel besteht die erste Ebene aus der Bildquelle und Layout-Konfiguration für das Bildergalerie-Webpart. Wenn der Benutzer ein einzelnes Bild auswählt, kann er im Eigenschaftenbereich der zweiten Ebene den Titel, die Beschriftung und den Alternativtext konfigurieren.
