Back to Library
Download Button

Hover to play

Download Button

by Luiz Mello

@luizmellodev
buttonloadinganimation

Description

An animated download button with progress tracking, state transitions, checkmark completion, and celebratory confetti.

SwiftUI Code

//
// Developer drives progress externally via @Binding:
//   - Set progress to any value in 0.0...1.0 as download advances
//   - Button auto-transitions: idle → downloading → downloaded
//   - Call onTap to start your download logic
//
// Example usage:
//   @State var progress: Double = 0
//   DownloadButton(progress: $progress) { startMyDownload() }

struct DownloadButton: View {
    @Binding var progress: Double
    var onTap: () -> Void

    @State private var phase: DownloadPhase = .idle
    @State private var checkProgress: CGFloat = 0
    @State private var confetti: [ConfettiPiece] = []

    private let h: CGFloat = 52
    private let w: CGFloat = 220

// ... (click "Show full code" to see more)
Viewing: DownloadButton.swift1 of 2