Auf der Entwurfsfläche wird die visuelle Ausgabe der Websites angezeigt, mit denen erstellt wurde Blocs. Benutzer können mit der Seite in Echtzeit interagieren und Elemente auswählen, verschieben und ihren Inhalt bearbeiten. Die Design-Leinwand befindet sich in der Mitte des Hauptanwendungsfensters zwischen der linken und rechten Seitenleiste.
Der Auswahlmarker
Wenn ein Element auf der Entwurfsfläche angeklickt wird, wird eine blaue Markierung angezeigt, die als Auswahlmarkierung bezeichnet wird. Abhängig vom ausgewählten Objekttyp kann diese Markierung auch einige visuelle Stilsteuerelemente enthalten, mit denen Benutzer die Größe und Position des ausgewählten Elements anpassen können. Wir bezeichnen diese als Freihandsteuerungkönnen Sie mehr über sie lesen Hier .
Canvas-Einstellungen
Der Designbereich verfügt über eine Reihe von Optionen, mit denen Benutzer das visuelle Rendern der aktuell geöffneten Website steuern können. Diese Optionen finden Sie in der unten links Ecke der Designleinwand.
Wireframe-Modus
Im Wireframe-Modus werden alle nicht für das Layout erforderlichen Stile entfernt, sodass Benutzer sich auf den Seiteninhalt und die Struktur konzentrieren können.
Gliederungsmodus
Im Gliederungsmodus wird ein dünnes blaues Rechteck um die Begrenzungsbereiche aller Elemente auf der Seite angezeigt, sodass Benutzer die zugrunde liegende Struktur anzeigen können.
Dark Site-Modus
Der Dark Site-Modus invertiert die Farben des + Schaltflächen, wodurch sie auf dunklem Hintergrund besser unterscheidbar sind. Es simuliert auch den Dunkelmodus des Betriebssystems und wendet die Dunkles Thema class in das body-Tag der aktuellen Seite.
Anzeige Hinzufügen Bloc Taste
Schalten Sie die Sichtbarkeit des ein + Schaltflächen, die zum Hinzufügen verwendet werden Blocs zu einer Seite. Diese Option kann auch über die Tastenkombination ein- und ausgeschaltet werden ⌥+⌘+4.
Anzeige Hinzufügen Bric Taste
Schalten Sie die Sichtbarkeit des ein + Schaltflächen, die zum Hinzufügen verwendet werden Brics zu einer Seite. Diese Option kann auch über die Tastenkombination ein- und ausgeschaltet werden ⌥+⌘+5.
Zeilenumbruch-Tags anzeigen
Zeilenumbruch-Tags sind standardmäßig nicht sichtbar. Mit dieser Option können Benutzer das visuelle Rendering auf der Entwurfsfläche umschalten.
Filter für Sehbehinderungen
Mit dieser Option können Sie aus verschiedenen Arten von Farbenblindheitsfiltern auswählen, sodass Sie sehen können, wie Ihre Website für eine Person mit einer Sehbehinderung aussehen würde.
Die Rendereinstellungen für das Design-Canvas werden nur in der App wirksam und haben keine Auswirkungen auf die Site, sobald sie in der Vorschau angezeigt oder exportiert wurden. Sie sind lediglich eine visuelle Designhilfe in der App.