Ausrichtung und Verteilung in der Skizze beherrschen

In diesem Lernprogramm erfahren Sie, wie Sie Objekte mit Hilfe von Sketch 3 perfekt ausrichten und verteilen. Ich werde einige grundlegende Beispiele verwenden, um die Optionen ausführlich zu erläutern. Einige werden Sie überraschen!

1. Ausrichten einer einzelnen Ebene an der Zeichenfläche

Dies ist vielleicht die einfachste Technik hier. 

Schauen Sie sich den oberen Bereich des Inspektors an: Es werden einige Schaltflächen angezeigt, die sich auf die Ausrichtung beziehen. Die sechs rechten Schaltflächen (links, horizontal, rechts, oben, vertikal und unten ausrichten) dienen zum Ausrichten von Ebenen untereinander. Wenn Sie jedoch nur ein einzelnes Objekt ausgewählt haben, wird es an der übergeordneten Zeichenfläche ausgerichtet. So funktioniert das:

Wie bereits erwähnt, können Sie dieselben Schaltflächen verwenden, wenn Sie mehrere Objekte ausgewählt haben, um sie untereinander auszurichten. Aber was ist, wenn wir mehrere Objekte an der Zeichenfläche ausrichten möchten??

2. Mehrere Ebenen an der Zeichenfläche ausrichten

Um mehrere Objekte an der Zeichenfläche auszurichten, gruppieren Sie sie in einer einzigen Ebenengruppe. Die Gruppe fungiert als einzelnes Objekt, wenn Sie die Ausrichtungsschaltflächen verwenden.

Eine solche Gruppierung passt jedoch möglicherweise nicht immer zu Ihrer Situation. Lass mich dir einen anderen Ansatz zeigen.

Wählen Sie die Ebenen aus, die Sie ausrichten möchten, und halten Sie die Taste gedrückt alt "Taste Damit die Ausrichtungssymbole im Inspektor ihr Aussehen ändern. Jetzt richten Sie die Ebenen an der Zeichenfläche aus! Denken Sie daran, dass Sie die ausgewählten Ebenen benötigen innerhalb die Zeichenfläche, sonst ist diese Option nicht verfügbar. 

Im folgenden Beispiel habe ich drei verschiedene Ebenen ausgewählt:

Dies funktioniert auch mit Ebenengruppen. Das bedeutet, Sie können mehrere Layer-Gruppen auswählen, die Alt-Taste gedrückt halten und sie an der Zeichenfläche ausrichten.

3. Ausrichtung auf bestimmte Ebenen

Eine andere Situation: Ich möchte, dass sich alles an einem einzelnen Objekt ausrichtet. Zunächst müssen Sie verstehen, dass sich Sketch standardmäßig immer an dem orientiert äußerste Schicht aller ausgewählten. Diese Schicht wird als "Schlüsselobjekt" bezeichnet..

Um alle ausgewählten Objekte nach oben auszurichten, ist das Objekt, das sich an der äußersten oberen Position befindet, das Schlüsselobjekt. Hier ein Beispiel, bei dem ich drei Objekte an der rechten oberen Position ausrichte (das rote Quadrat ist unser "Schlüsselobjekt"):

Es wäre schön, wenn wir das Schlüsselobjekt an das Objekt anpassen könnten, das wir wollen, oder? Hier ist der Trick: Sperren Sie die Ebene, die Sie als Schlüsselobjekt verwenden möchten,Wählen Sie dann alle Ebenen erneut aus. (Sie können gesperrte Layer nur über die Layer-Liste auswählen.). 

Im folgenden Beispiel ist das blaue Quadrat bereits gesperrt, sodass es als unser neues Schlüsselobjekt fungiert. Jetzt richten wir die Objekte wieder rechts oben aus:

Ich habe diesen praktischen Trick dank SketchTips entdeckt. Und Sie können das Align To-Plugin von Lucien Lee verwenden, um dieselben Ergebnisse zu erzielen. 

4. Vektorpunkte ausrichten

Spitze: Sie können auch die Schaltflächen zum Ausrichten verwenden, um mehrere Vektorpunkte auszurichten Bearbeitungsmodus. Wählen Sie das Vektorobjekt aus, und doppelklicken Sie, um in den Bearbeitungsmodus zu wechseln (Sie können auch das Symbol "Bearbeiten" in der Hauptsymbolleiste verwenden), und wählen Sie alle Vektorpunkte aus, die Sie ausrichten möchten.

5. Verteilen von Schichten

Wenn Sie oben im Inspektorfenster nachsehen, werden Sie feststellen, dass ich die beiden Ausrichtungssymbole links noch nicht erwähnt habe. Diese Schaltflächen dienen zum horizontalen und vertikalen Verteilen von Objekten. Wir können sie auch gleichmäßig verteilen, was sehr praktisch ist! Angenommen, wir haben einige Formen ausgewählt und möchten diese horizontal verteilen. Verwenden Sie die Horizontal verteilen Taste oder gehen Sie zu Anordnen> Verteilen> Horizontal.

Die Schichten ganz links und ganz rechts bleiben, wo sie sind, während die Schichten in der Mitte gleichmäßig zwischen ihnen liegen. Sie können dasselbe mit der vertikalen Achse tun Vertikale Verteilung Möglichkeit.

6. Verteilen von Ebenen mit festem Abstand

Okay, aber was ist, wenn ich diese Schichten 20px voneinander trennen möchte? Horizontal / vertikal verteilen hilft hier nicht.

In diesem Fall können wir die verwenden Machen Sie ein Gitter Werkzeug (Anordnen> Gitter erstellen) Um horizontale und vertikale Abstände zwischen den Objekten zu definieren. Am Anfang ist es vielleicht ein bisschen schwierig zu verstehen, also zeige ich Ihnen ein anderes animiertes Beispiel:

Hier wollte ich vier verschiedene Ebenen mit einem Abstand von 20px verteilen. Ich habe ein Raster aus einer einzelnen Reihe (um alle Ebenen horizontal auszurichten) und vier Spalten (eine Spalte pro Ebene) erstellt. Dann setze ich den Rand der Spalten auf 20px, um den gewünschten Abstand zu erhalten. Wenn ich die Ebenen vertikal verteilen möchte, muss ich ein Raster mit vier Zeilen (mit 20px-Rand) und einer Spalte erstellen.

Wenn Sie sich mit dieser Methode nicht wohl fühlen, können Sie das SketchDistributor-Plugin ausprobieren. Sie können ausgewählte Objekte mit einem bestimmten Abstand verteilen. 

Das ist alles für jetzt

Ich hoffe, dir hat dieses Tutorial gefallen. Wenn Sie die Ausrichtungs- und Verteilungswerkzeuge in Sketch beherrschen, sparen Sie viel Zeit!