Finden Sie alle verfügbaren Bilder für als `systemName` in SFSymbols


79

Wo finde ich alle Systemabbilder, die in den SFSymbols verfügbar sind? Zum Beispiel im SwiftUI- ImageInitialisierer Image(systemName:)?

Ich habe nur "chevron"und "star.fill"bis jetzt verwendet, wie in Apples SwiftUI-Tutorial-Serie entdeckt. Ich konnte jedoch in keiner offiziellen Dokumentation eine vollständige Liste der Symbole finden.


Sie können das vollständige Kit vom Entwicklerportal herunterladen
Oscar Apeland

Schauen Sie hier, es steht in den Apple-Richtlinien für SF-Symbole: developer.apple.com/design/human-interface-guidelines/…
Ronald Hofmann

5
Ich habe alle Dokumente nach "star.fill" durchsucht und nichts gefunden. Wo sind diese aufgelistet? Ich kann FontBook öffnen und unter SF Pro Display (zum Beispiel) durch Symbolseiten scrollen, aber ich sehe "star.fill" nicht und wenn Sie eines dieser Symbole verwenden möchten - wie?
P. Ent

Antworten:


125

Diese Symbole werden als SF-Symbole bezeichnet . Es gibt über 2.400 Symbole, die Sie in iOS 13 und höher, macOS 11 und höher, watchOS 6 und höher und tvOS 13 und höher verwenden können. Sie können ein Symbol überall dort verwenden, wo Sie ein Bild verwenden können.

Laden Sie die SF Symbols-App herunter , um alle Symbole zu durchsuchen . Weitere Informationen zu SF-Symbolen finden Sie hier .


SF Symbols 2 führt über 750 neue Symbole ein und enthält:

  • Über 150 vorkonfigurierte mehrfarbige Symbole, die sich automatisch an die Lebendigkeit, die Einstellungen für die Barrierefreiheit und die Darstellungsmodi anpassen
  • Negative Seitenränder in Standard- und benutzerdefinierten Symbolen ermöglichen eine bessere Kontrolle über die horizontale Ausrichtung
  • Lokalisierte Symbolvarianten für Schreibsysteme von rechts nach links sowie skriptspezifische Symbole für Arabisch, Devanagari und Hebräisch

Verwendung

UIKit:

let heartImage = UIImage(systemName: "heart.fill")

SwiftUI:

let heartImage = Image(systemName: "heart.fill")

16

Sie können SF-Symbolbilder in SwiftUI verwenden

Image(systemName: "person")

Download-Link: https://developer.apple.com/design/resources/


4
Sie sollten kein Produkt eines Drittanbieters kaufen müssen, um die Symbole anzuzeigen. Warum kann Xcode es nicht öffnen und Ihnen zeigen? Mit Android Studio können Sie ganz einfach Vektorsymbole aus der Bibliothek in Ihre App einfügen.
P. Ent

Die meisten Anwendungen verwenden diese Symbole nicht. Das kann der Grund sein.
Mehmet Ali Vatanlar

2
Apple stellt sie zur Verfügung und Standardbilder in verschiedenen Apps erleichtern Benutzern das Erkennen bekannter Symbole. Ich denke nur, es wäre eher Apple-ähnlich, sie bereitzustellen.
P. Ent

9
Die SF Symbols App ist kostenlos und wird von Apple und nicht von Drittanbietern erstellt. Es ist auch für Designer, nicht nur für Entwickler.
jmdecombe

13

Die App von 

Apple hat eine spezielle App für dieses Symbol namens SF Symbol. Sie sollten die neueste Version von hier herunterladen, um den vollständigen Satz von Symbolen zu durchsuchen.

Vorschau


Wichtige Notiz

Sie sollten immer bei der App bleiben, um neue Symbole für die Vorschau , den Export und den Genuss zur Verfügung zu haben.


Rückwärtskompatibilität.

Wenn Sie neue Symbole verwenden müssen, wie die neuen mehrfarbigen, die in SF Symbols 2.0 für iOS 14 und höher eingeführt wurden, können Sie diese über die App selbst exportieren und als Assets in das Projekt importieren. Schritt 1 und 2 dieser Antwort zeigen, wie Sie Symbole exportieren können, um sie für ältere iOS-Versionen zu verwenden


7

Angenommen, Sie haben Xcode installiert, können Sie auch eine Vorschau aller Bilder anzeigen, ohne eine separate App herunterladen zu müssen.

Der Trick ist, dass Sie sie in einem Storyboard anzeigen müssen, nicht in einem SwiftUI-Canvas.

Fügen Sie Ihrem Storyboard eine UIImageView hinzu und drücken Sie den Dropdown-Pfeil neben Image. Sie sehen die gesamte Liste der von Apple bereitgestellten Bilder:

Geben Sie hier die Bildbeschreibung ein

Kopieren Sie den Namen eines Bildes und verwenden Sie ihn dann wie andere oben erwähnte Antworten:

Image(systemName: "square.and.arrow.up")

Und dann? Wie werden wir sie in SwiftUI verwenden?
Lord Anubis

1
In SwiftUI verwenden Sie es wie in der obigen Anweisung: Image (systemName: "SystemImageName")
Daniel Belém Duarte

5

Schauen Sie sich dieses Swift-Paket SFSafeSymbols an

Sie können über eine Aufzählung auf alle SF-Symbole zugreifen

static func getRandomSFSymbol() -> SFSymbol {
    return SFSymbol.allCases.randomElement() ?? SFSymbol.xCircle
}

Ich suche nach einer Möglichkeit, dasselbe in den Versionen unter iOS 13.0 zu tun, daher hat SFSafeSymbols nicht geholfen
Володимир

SF-Symbole sind in iOS 12 und niedriger nicht verfügbar. Was Sie tun müssen, ist, diese Aufzählung aus der Bibliothek zu nehmen, die ich erwähnt habe, und dann müssen Sie sie mit einem Array-Bildnamen verbinden, wobei die Bilder die SF-Symbole sind, die Sie als Bilder exportieren. Für noch bessere Ergebnisse können Sie die Symbole als SVG
visc

1
Vielen Dank. Ich habe versucht, SF Symbol in die Zeichenfolge zu kopieren und direkt in Label oder Button einzufügen - ohne Erfolg. Am Ende - als PDF exportiert und als Vektorbild eingefügt - hat es geholfen.
Володимир

Ja, die Code- und Schriftsymbole sind unter iOS 12 und darunter nicht vorhanden. Sie können sie also nicht vom Betriebssystem herunterladen. Sie müssen sie zur Verfügung stellen
visc

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.