Vektor-Editor In Zero Block

Wie Sie Ihre eigenen Vektorgrafiken erstellen auf Tilda

In Zero Block editor können Sie mit dem eingebauten Vektor-Editor Ihr eigenes Vektorgrafikbild erstellen. Klicken Sie dazu auf die Plustaste zum Hinzufügen neuer Elemente → Vektor hinzufügen.

In Zero Block: the "Add Vector" option in the elements menu under the plus button in the upper-left corner.

Gehen Sie zu Elementeinstellungen und klicken Sie auf die Schaltfläche "Vektor bearbeiten". Sie können die Arbeit mit dem Vektor auch durch einen Doppelklick auf das Element beginnen.

Zero Block: the "EDIT VECTOR" button in the "ELEMENT SETTINGS" panel on the right.

Der Vektorbild-Editor wird geöffnet. Es sind 4 Werkzeuge verfügbar: Auswahlwerkzeug, Zeichenwerkzeug, Biegewerkzeug und Bearbeitungswerkzeug für Ankerpunkte.

Zeichnen Werkzeug

Mit dem Zeichenwerkzeug können Sie einen neuen Vektor erstellen, indem Sie Bezier-Kurven mit Ankerpunkten (bei Klick) und Einstellen der Kurvengriffe. Mit diesem Werkzeug können Sie gerade und gebogene Linien erstellen.

Wenn Sie die Umschalttaste gedrückt halten, wird der nächste Ankerpunkt horizontal, vertikal oder diagonal positioniert in einem 45-Grad-Winkel in Bezug auf den vorherigen Punkt positioniert.

Um den Pfad zu schließen, fügen Sie den letzten Punkt über den ersten Punkt. Um die Form offen zu halten, doppelklicken Sie auf den letzten Punkt oder drücken Sie die ESC-Taste.

Werkzeug auswählen

Mit dem Auswahlwerkzeug können Sie einzelne Formen, die Sie erstellt haben, auswählen, ziehen, skalieren und drehen sowie ihre Einstellungen - Füll- und Strichfarbe und -breite - konfigurieren.

Vector editor in Zero Block: a duplicated curved vector shape being moved and positioned on the canvas.

Es gibt vier Skalierungsmodi:

Frei. Die Größe des Elements ist frei wählbar, und das Seitenverhältnis wird nicht beibehalten.
Proportional ( Umschalttaste gedrückt halten). Das Element wird in der Größe verändert, wobei das Seitenverhältnis beibehalten wird.
Größe vom Mittelpunkt aus ändern ( Alt-/Optionstaste gedrückt halten). Das Element behält seine Position relativ zum zentralen Punkt bei. Das Seitenverhältnis wird nicht beibehalten.
Proportionale Größenänderung vom Mittelpunkt aus (Umschalttaste + Alt-/Optionstaste gedrückt halten). Das Element behält seine Position relativ zum zentralen Punkt bei. Das Seitenverhältnis wird beibehalten.

Beispiele für die 4 Skalierungsmodi

Es gibt zwei Möglichkeiten der Drehung Elemente:

Frei. Das Element kann beliebig gedreht werden, indem der Cursor über die Ecke des Elements bewegt wird .
Drehung mit einem 15-Grad-Schritt (Umschalttaste Taste gedrückt halten).

An zurücksetzen Rotation zu ändern, klicken Sie mit der rechten Maustaste, um das Kontextmenü des Elements zu öffnen, und wählen Sie "Rotation zurücksetzen".

An spiegeln das Element vertikal oder horizontal zu spiegeln, verwenden Sie die Optionen des Kontextmenüs: Horizontal spiegeln, Vertikal spiegeln.

Zero Block Vector Editor: context menu for a selected vector shape with options to copy, paste, delete, arrange, and flip.

Biegewerkzeug

Mit dem Biegewerkzeug können Sie einzelne Kurvensegmente und den Winkel der Kurvengriffe für die Ankerpunkte nachdem Sie einen Vektor erstellt haben.

Vector editor in Zero Block: the top toolbar with drawing tools, "FILL", "STROKE", and "SAVE & CLOSE" button over an edited shape.

Werkzeug bearbeiten

Mit dem Werkzeug Bearbeiten können Sie Ankerpunkte bearbeiten (verschieben Sie können Ankerpunkte verschieben und Bezier-Kurven bearbeiten und Segmente zwischen zwei Ankerpunkten ändern. Um dieses Werkzeug zu aktivieren, doppelklicken Sie auf das Element, das Sie bearbeiten möchten.

Zero Block: vector editor toolbar at the top and an editable curved path with anchor points on the canvas.

Mehrere Formen in einem Vektorbild

Sie können mehrere Formen innerhalb eines Vektorbildes erstellen. Um sie über- oder untereinander (als Ebenen) zu platzieren, öffnen Sie das Kontextmenü mit einem Rechtsklick auf das Element und wählen Sie die Option "Nach vorne bringen" oder "Nach hinten schicken". Sie können auch die Option ] oder [ Shortcuts verwenden.

Um ein Element zu löschen, drücken Sie die Rücktaste oder verwenden Sie das Kontextmenü.

Vector editor in Zero Block: the context menu for a selected shape with options like "Bring to front", "Send to back", and flip settings.

SVG-Dateien importieren

Verwenden Sie das Kontextmenü, das Menü der Symbolleiste oder Cmd/Strg+l Tastaturkürzel, um ein Bild zu importieren. Sie können importieren jedes SVG-Bild bis zu 20KB importieren.

Zero Block vector editor: the three-dots menu on the top toolbar with the "Shortcuts" and "Import SVG" options.

The vector editor in Zero Block with a context menu showing the "Paste here", "Import SVG here", and "Save and close" options.

Umwandlung eines Vektorelements in ein Bild und zurück

Um ein Vektorelement in ein Bild im SVG-Format umzuwandeln, wählen Sie das Element auf der Zeichenfläche aus und klicken Sie auf die Schaltfläche In Bild umwandeln im rechten Einstellungsfenster.

In Zero Block: the "Convert to Image" option in the "VECTOR EDITOR" section of the "ELEMENT SETTINGS" panel.

Nach der Konvertierung wird das Vektorelement in der Ebenenliste als Bild angezeigt, und der Dateititel und die Erweiterung werden in den Elementeinstellungen angezeigt.

Um die empfangene SVG-Datei zu bearbeiten, klicken Sie auf Bearbeiten - der Vektor-Editor wird geöffnet. Sobald Sie den Editor verlassen, wird das Element gespeichert und wieder in eine SVG-Datei umgewandelt.

Um die SVG-Datei wieder in ein Vektorelement umzuwandeln, wählen Sie das Element aus und klicken Sie auf "Zu Vektor".