Erfahren Sie, wie Sie scrollbare Zeichenflächen erstellen, um nicht sichtbare Inhalte darzustellen.

Was Sie benötigen

Die Beispieldatei ist ein Adobe Stock-Element, mit dem Sie die Schritte dieses Tutorials nachvollziehen können. Wenn Sie die Beispieldatei anderweitig verwenden möchten, können Sie sie bei Adobe Stock lizenzieren. In der ReadMe-Datei in diesem Ordner finden Sie die Bedingungen für die Verwendung dieser Beispieldatei.

Zeichenflächengröße für vertikalen Bildlauf ändern – Zusammenfassung.

Bei der Design-Erstellung kann es vorkommen, dass die Zeichenfläche nicht groß genug ist, um den gesamten Content aufzunehmen. Wenn Sie deshalb die Zeichenfläche verlängern, aktiviert Adobe XD CC automatisch den vertikalen Bildlauf, sodass die Anzeige auf allen Screen-Formaten gewährleistet ist.

Größe von Zeichenflächen ändern.

Um die Größe einer Zeichenfläche anzupassen, müssen Sie sie zuerst auswählen.

  • Klicken Sie mit dem Werkzeug „Auswählen“ (Select) auf den Namen der Zeichenfläche, oder ziehen Sie mit der Maus über die Zeichenfläche.
  • Alternativ können Sie im Bedienfeld „Ebenen“ (Layers) auf den Namen der gewünschten Zeichenfläche klicken, um sie im Dokumentfenster auszuwählen.

Ziehen Sie nun den Griff am unteren Rand der Zeichenfläche weiter nach unten. Eine gestrichelte Linie markiert die ursprüngliche Länge der Zeichenfläche.

Vorschau des Bildlaufs anzeigen.

Sie können direkt in XD eine Vorschau der Bildlauf-Funktion anzeigen.

  • Wählen Sie die scrollbare Zeichenfläche oder den Inhalt darauf aus, und klicken Sie rechts oben im Anwendungsfenster auf den Playbutton, das Symbol für die Vorschau. Die ausgewählte Zeichenfläche wird in einem neuen Fenster angezeigt. Die Größe des neuen Fensters entspricht der Größe der ausgewählten Zeichenfläche. Der sichtbare Bereich der Zeichenfläche wird als „Viewport“ bezeichnet.
  • Klicken und ziehen Sie im Fenster, um senkrecht durch die Zeichenfläche zu scrollen.
  • Schließen Sie das Vorschaufenster.

Bildlauf deaktivieren.

  • Sie können den Bildlauf für eine Zeichenfläche deaktivieren, indem Sie im Eigenschafteninspektor im Abschnitt „Bildlauf“ die Option „Kein“ auswählen. Wenn der Bildlauf für eine Zeichenfläche deaktiviert wird, die größer als der Viewport des Geräts ist, wird die Zeichenfläche auf die Viewport-Größe skaliert.

Hinweis: Sie können auch die Höhe des Viewport-Bereichs anpassen, wenn der Bildlauf für die Zeichenfläche aktiviert ist. Ziehen Sie dazu den Scrubber am Anfang der gestrichelten Linie.

 

Vorheriges Thema: Wireframe-Kits verwenden

 

War diese Seite hilfreich?