Contents

BounceSymbolEffect

A type that applies a transitory scaling effect, or bounce, to the layers in a symbol-based image separately or as a whole.

Declaration

struct BounceSymbolEffect

Overview

A bounce animation draws attention to a symbol by applying a brief scaling operation to the symbol’s layers. You can choose to scale the symbol up or down as it bounces.

// Add an effect in SwiftUI.
@State private var value1 = 0
@State private var value2 = 0
var body: some View {
    HStack {
        Image(systemName: "arrow.up.circle")
            // Bounce with a scale-up animation.
            .symbolEffect(.bounce.up, value: value1)
            .onTapGesture {
                value1 += 1
            }
        Image(systemName: "arrow.down.circle")
            // Bounce three times with a scale-down animation.
            .symbolEffect(.bounce.down, options: .repeat(3), value: value2)
            .onTapGesture {
                value2 += 1
            }
    }
}
// Add an effect in AppKit and UIKit.
// Bounce with a scale-up animation.
imageView1.addSymbolEffect(.bounce.up)
    
// Bounce three times with a scale-down animation.
imageView2.addSymbolEffect(.bounce.down, options: .repeat(3))

Topics

Accessing symbol effects

Determining effect scope

Accessing the configuration

See Also

Symbol effect types