Exportieren eines Slice in Sketch mit transparentem Hintergrund

15

Mit Sketch 3 möchten Sie ein Symbol exportieren. Die Symbole selbst sind 24x24 groß, befinden sich jedoch in einem Bereich von 32x32.

Ich habe herausgefunden, wie das geht, indem ich zwei verschiedene Ebenen 24x24 und 32x32 kombiniert habe, aber es ist ein mühsamer Prozess. Ich muss dies für jedes einzelne Symbol tun.

Gibt es einen schnelleren Workflow?

Ariel Seidman
quelle
1
Können Sie klarstellen, was Sie unter "einem Gebiet" verstehen? Einfarbig? Eine Zeichenfläche? Eine Scheibe? Oder muss die endgültige Datei nur 32x32 groß sein und das 24x24-Symbol enthalten?
Spirale
Hallo Ariel, willkommen auf der GDSE und vielen Dank für Ihre Frage. Bitte klären Sie, was Ihr Problem ist, wie Spiral fragt. Wenn möglich, bitte ein Beispielfoto posten. Vielen Dank! Wenn Sie mehr über die Website erfahren möchten, wenden Sie sich an die Hilfe oder senden Sie einen Ping-Befehl an einen von uns im Chat, sobald Ihr Ruf ausreicht (20). Tragen Sie weiter bei und genießen Sie die Seite!
Vincent

Antworten:

13

Hit Azur Erstellung eines Artboard , wählen Sie die Größe (oder geben Sie Ihre eigenen , indem Sie auf den Button +in der rechten unteren Ecke) und starten Sie den Export. Es müssen keine zusätzlichen Ebenen erstellt werden.

M. Appelman
quelle
7

Es ist eigentlich sehr einfach, wenn du weißt, wie es geht :)

Angenommen, Sie haben ein Symbol mit 24 x 24 Pixel und möchten, dass das PNG 32 x 32 Pixel groß ist. Sie müssen ein Slice über dem Symbol erstellen. Das Slice muss 32x32px sein. Gruppieren Sie dann das Segment und das Symbol. Last but not least: Klicken Sie auf das Slice und im Inspector sehen Sie so etwas:

Inspektorfenster

Stellen Sie sicher, dass Sie "Nur Gruppeninhalte exportieren" aktivieren. Die anderen Optionen müssen deaktiviert sein.

Auf diese Weise exportieren Sie eine transparente PNG, auch wenn sich unter dem Symbol kein transparenter Hintergrund befindet.

Inma
quelle
Ich habe diese Optionen nicht, wird nicht mehr empfohlen? Ich benutze Sketch Version 56.2
Adriano Resende
1

Wenn Sie nur die Symbolebene (24x24) exportieren möchten, ziehen Sie die Ebene einfach auf den Desktop.

Kilian
quelle
Wäre nett. Leider haben Sie keine Icons für höhere Bildschirmauflösungen.
Julian F. Weinert
1

Verwenden Sie dies, um Ihre Assets zu exportieren. Das Problem mit Sketch selbst und den meisten anderen Plugins ist, dass beim Exportieren unsichtbare Ebenen vernachlässigt werden. Infolgedessen funktionieren unsichtbare Grenzen nicht.

Ich habe sogar versucht, die Deckkraft einer Schranke auf 0 zu verringern, um Sketch zum Exportieren zu bewegen. Aber der native Export von Sketch ist nicht so naiv.

Möglicherweise sehen Sie eine Horde von Sketch-Plugins, die beim Exportieren von Assets für Android auf einfache Weise helfen. Sie können die erforderlichen Schritte reduzieren, lösen jedoch nicht das Problem der Grenzen.

Dieser tut es.

https://github.com/GeertWille/sketch-export-assets

Sie können Assets für iOS, Android und Windows für alle Auflösungen exportieren und dabei die Grenzen beibehalten.

Spart all diese Zeichenflächenbemühungen.

Sarthak Pranit
quelle
1
Hallo Sarthak, kannst du uns bitte etwas näher erläutern, was sich hinter dem von dir angegebenen Link verbirgt und warum die Frage beantwortet wird? Auf diese Weise ist Ihre Antwort immer noch von Wert, falls der Link zu einem späteren Zeitpunkt unterbrochen wird. Link Rot ist der Hauptgrund, warum wir hier keine Nur-Link-Antworten mögen. Vielen Dank für Ihre Mühe und weiterhin Ihren Beitrag!
Vincent
0

Diese Methode hat bei mir funktioniert: Platzieren Sie die richtige Größen-Slice-Ebene über der Ebene, auf der sich Ihr Symbol befindet, und stellen Sie sicher, dass sie nicht gruppiert sind .

Ich hoffe es hilft

Bildbeschreibung hier eingeben

cmdQ
quelle
0

Ich habe mehr Zeit damit verbracht, als manuell nacheinander zu arbeiten, aber ich habe nicht aufgegeben und eine Lösung gefunden, die gut funktioniert:

  1. Kopieren Sie alle Symbole, die Sie exportieren möchten, in eine neue Datei
  2. Konvertieren Sie sie in Symbole
  3. Da sie zu Symbolen wurden, haben sie ihre eigenen Zeichenflächen (Sie müssen nur auf eines der Symbole doppelklicken, um zur Symbolseite zu gelangen).
  4. Vergewissern Sie sich auf der Symbolseite, dass alle Symbole ausgeblendet sind. Ansicht> Ebenenliste> Alle Gruppen ausblenden und wählen Sie sie alle aus. Cmd + A
  5. Jetzt können Sie weiter machen und alle exportieren
  6. Voila! Wenn Sie sie richtig benannt haben, haben Sie sie auch in ordentlichen kleinen Ordnern

hoffe das hat geholfen!

Jay
quelle
0

Ich habe eine Problemumgehung gefunden, bei der keine separaten Zeichenflächen erstellt wurden. Es ist ein bisschen abgedreht, aber es hat bei mir funktioniert. Ich wollte, dass Symbole in meinem Design in Zeplin exportiert werden können. Das Erstellen neuer Zeichenflächen würde es Entwicklern daher erschweren, die Symbole zu finden.

Also habe ich den quadratischen Hintergrund mit dem Mischmodus "Abdunkeln" um 1% deckend gemacht. Sie können es überhaupt nicht sehen. Dann habe ich das mit dem Icon gruppiert und die Gruppe exportierbar gemacht. Super einfach.

Sharkonaut
quelle