Back to Library
Animated Like Button

Hover to play

Animated Like Button

by Luiz Mello

@luizmellodev
buttonanimationinteraction

Description

A heart-shaped like button with a spring pop, particle burst, and animated count updates inspired by social app interactions.

SwiftUI Code

//
// A heart button that bursts into particles when liked.
// Tap to toggle. Inspired by Twitter/Instagram like interactions.

struct AnimatedLikeButton: View {
    @State private var isLiked = false
    @State private var bouncing = false
    @State private var particles: [LikeParticle] = []
    @State private var likeCount = 42

    var body: some View {
        VStack(spacing: 8) {
            ZStack {
                ForEach(particles) { p in
                    Circle()
                        .fill(p.color)
                        .frame(width: p.size, height: p.size)
                        .offset(x: p.offsetX, y: p.offsetY)
                        .opacity(p.opacity)
                }

// ... (click "Show full code" to see more)