This section walks through adding SFSymbols and using the three primary APIs.
Add SFSymbols to your Xcode project or Swift package.
let package = Package(
dependencies: [
.package(url: "https://github.com/simonbs/SFSymbols.git", from: "1.0.0")
]
)SFSymbolPicker is a SwiftUI view that presents a labeled row with a button showing the current symbol.
import SFSymbols
import SwiftUI
struct ContentView: View {
@State private var selectedSymbol = "tortoise"
var body: some View {
Form {
SFSymbolPicker("Symbol", selection: $selectedSymbol)
}
}
}SFSymbolPicker accepts both optional and non-optional bindings. Optional bindings let you clear the selection.
Use the view modifier when you want full control over the button or the presentation trigger.
import SFSymbols
import SwiftUI
struct ContentView: View {
@State private var isPresented = false
@State private var selectedSymbol: String?
var body: some View {
Button {
isPresented = true
} label: {
Label("Pick a Symbol", systemImage: selectedSymbol ?? "questionmark")
}
.sfSymbolPicker(isPresented: $isPresented, selection: $selectedSymbol)
}
}.sfSymbolPicker can be attached to any view, including images, list rows, or custom buttons.
SFSymbols loads the system catalog asynchronously. Use it to build custom filters, category views, or search.
import SFSymbols
import SwiftUI
struct SymbolBrowser: View {
@State private var symbols: SFSymbols?
var body: some View {
List {
if let symbols {
ForEach(symbols.categories) { category in
Section(category.key) {
ForEach(category.symbols) { symbol in
Label(symbol.name, systemImage: symbol.name)
}
}
}
}
}
.task {
symbols = try? await SFSymbols()
}
}
}SFSymbols exposes the full list of symbols and their categories.
let symbols = try await SFSymbols()
let allSymbols = symbols.symbols
let categories = symbols.categoriesEach SFSymbol includes its name, searchTerms, and categories, so you can build your own search and filtering UI.
Open the example app in Example/Example.xcodeproj to see SFSymbolPicker in a simple form.