Benutzerhandbuch Abbrechen

Hinzufügen von Overlays

Hier erfahren Sie, wie Sie Overlays hinzufügen, um interaktive Einblendeffekte zu simulieren.

Mit Adobe XD können Sie Inhalte über einer anderen Zeichenfläche stapeln, anstatt sie auf mehrere Zeichenflächen zu duplizieren, um Effekte wie Dropdown-Listen, Einblenden der Tastatur und mehr zu simulieren. 

Tastatur als Overlay auf der Zeichenfläche
Tastatur als Overlay auf der Zeichenfläche

  1. Wählen Sie im Designmodus eine Quellzeichenfläche und eine zweite Zeichenfläche als Overlay. Sie können eine Overlay-Zeichenfläche mehrmals verwenden.

  2. Im Prototypmodus ziehen Sie die Verbindungslinie per Drag & Drop von der Quellzeichenfläche zur Zeichenfläche mit den Overlay-Inhalten. Klicken Sie auf die Verbindungslinie, um das Fenster Interaktion anzuzeigen, das im Eigenschafteninspektor erscheint, und legen Sie die folgenden Optionen fest:

    • Trigger: Wählen Sie eine Option aus.
    • Aktion: Wählen Sie Overlay aus. Sie können einem einzelnen Trigger wie Antippen auch zwei Aktionen zuweisen: Dazu setzen Sie die erste Aktion im Eigenschafteninspektor auf Overlay, klicken für die zweite Aktion auf das Pluszeichen (+) und setzen sie auf eine Nicht-Übergangsaktion wie Audiowiedergabe oder Sprachwiedergabe.
    • Animation: Wählen Sie den Animationstyp aus. Wenn Sie Nach oben hineinbewegen oder Nach unten hineinbewegen auswählen, wird das Overlay von XD automatisch am Rand der Quellzeichenfläche platziert.
    • Easing: Wählen Sie eine Option aus, um Easing-Effekte zu simulieren.
    • Dauer: Geben Sie die Dauer an. Die Höchstdauer, die Sie für den Übergang zwischen Zeichenflächen festlegen können, beträgt fünf Sekunden.
    Tastatur als Overlay auf der Quellzeichenfläche hinzufügen
    Tastatur als Overlay auf der Quellzeichenfläche hinzufügen

  3. Um die Position eines Overlays auf der Quellzeichenfläche anzupassen, klicken Sie auf den grünen Positionsknopf (+) und ziehen ihn auf die gewünschte Position.

  4. Um in unterstützten Browsern eine Vorschau der Overlays anzuzeigen, klicken Sie auf 

Verschachtelte Overlays

Adobe XD unterstützt keine verschachtelten Overlays, bei denen Sie ein Overlay über einem anderen Overlay anwenden. Wenn Sie in solchen Szenarien die erste Zeichenfläche mit einer anderen Zeichenfläche verbinden, wird die erste Zeichenfläche ausgeblendet, bevor die zweite Zeichenfläche eingeblendet wird. 

Beispiele und Beispieldateien

Sie können auch in der XD Community nach weiteren Tutorials und Beispieldateien suchen.

Schneller und einfacher Hilfe erhalten

Neuer Benutzer?