Symbol-Animation mit Toggle
Beschreibung
BeimDiese AnklickenView deszeigt Buttonsein wirdSymbol, das Herzdurch eine Animationseffekt (.bounce) hervorgehoben wird. Über einen Button kann der Effekt aktiviert oder deaktiviert werden, wodurch eine interaktive visuelle Rückmeldung entsteht.
🔍 Zweck
- Demonstration von SF Symbol-Effekten
- Aufbau einer interaktiven UI mit
einemAnimation - Einsatz
Effektalsbeweget.Like- oder Favoriten-Indikator - Visualisierung von Statusänderungen
- Experimentieren mit SwiftUI Symbolanimationen
🖥️ Betriebssystem
iOS
📄 Codebeispiel
import SwiftUI
@main
struct SymbolAnimationApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
struct ContentView: View {
// Track the animation state
@State private var isActive = false
var body: some View {
VStackVStack(spacing: 20) {
// Heart symbol with bounce effect triggered by state
Image(systemName: "heart.fill")
.font(.system(size: 50))
.symbolEffect(.bounce, value: isActive)
// Button toggles the state to activate/deactivate effect
Button("Toggle Effect") {
isActive.toggle()
}
.buttonStyle(.borderedProminent)
}
.padding()
}
}
// Modern Swift 5.10+ preview syntax
#Preview {
ContentView()
}