What did SF Symbols 5 Bring? #Apple
For a while, Apple had been keeping quiet about SF Symbols. Apart from some minor improvements, we hadn't seen any significant changes, except for the arrival of new symbols.
A : Firstly, animations have been introduced, and here are the animations:
Appear: Use when a symbol appears in the interface.
Disappear: Use when a symbol is removed from the interface.
Bounce: Confirm a successful interaction or completed action, reinforce a concept, and add playfulness.
Scale: Confirm an action or highlight importance, provide focus or feedback. Scale is stateful, meaning its effect persists until it is removed.
Pulse: Convey ongoing activity by changing opacity. Works well with a single layer in a symbol.
Variable Color: Conveys varying levels of strength and relies on color to communicate a change in the symbol over time.
B : Afterward, we also have the opportunity to create our own symbols, called custom symbols. We can animate these as well.
C : Moreover, new symbols have been added, with some fantastic designs for gamers.
SF Symbols 5 has already reached over 5000 symbols.
Here are some sample code snippets for usage:
Simple one:
Image(systemName: "wifi")
.symbolEffect(.variableColor)
Animated sample: (alarm clock wave)
struct AnimatedSFSymbols: View {
@State private var animate = false
var body: some View {
Image(systemName: "alarm.waves.left.and.right.fill")
.symbolEffect(.bounce, value: animate)
.font(.system(size: 100))
.onTapGesture {
animate.toggle()
}
}
}
That is repeating sample:
.symbolEffect(.bounce, options: .repeating, value: animate)
For more samples please visit that Apple Documentation and don't forget these are only compatible with IOS 17 and other new series OS for other platforms.
