LoadingButton – Simple Loading Animation Button for SwiftUI
  • July 2, 2025

Simple Loading Animation Button for SwiftUI

📹 Preview

 

🏁 Getting Started


Requirements

  • Xcode 11+
  • SwiftUI
  • iOS 14+
  • macOS 10.15+

Installaion

Swift Package Manager(SPM)

File ➜ Swift Packages ➜ Add Package Dependancy..

.package(url: “https://github.com/Changemin/LoadingButton”, from: “1.1.2”)

🎈Usage


LoadingButton(action: { }, isLoading: <Binding>Bool, style: LoadingButtonStyle) {
// View on the button
// style is optional parameter

  • action : Actions to do when button clicked
  • isLoading : <Binding>Bool type. you can control loading status with this.
  • style(Optional) : Custom style with LoadingButtonStyle

🛠Custom Modifiers

LoadingButtonStyle(width: CGFloat,
height: CGFloat,
cornerRadius: CGFloat,
backgroundColor: Color,
loadingColor: Color,
strokeWidth: CGFloat,
strokeColor: Color)

// All of the parameter is optional

  • width(Optional) : Width of button
  • height(Optional) : Height of button
  • cornerRadius(Optional) : Corner radius of button
  • backgroundColor(Optional) : Background color of button
  • loadingColor(Optional) : Background color of button when Loading, default is 50% opacity of backgroundColor
  • strokeWidth(Optional) : Circle loading indicator stroke width
  • strokeColor(Optional) : Circle loading indicator stroke Color(default: gray)

Example


👶 Simple

import SwiftUI
import LoadingButton

struct ContentView: View {
@State var isLoading: Bool = false

var body: some View {
LoadingButton(action: {
// Your Action here
}, isLoading: $isLoading) {
Text(“LoadingButton”).foregroundColor(Color.white)
}
}
}

Result

 

💅🏻 Applying Fully Custom Style

import SwiftUI
import LoadingButton

struct ContentView: View {
@State var isLoading: Bool = false
var style = LoadingButtonStyle(width: 312,
height: 54,
cornerRadius: 27,
backgroundColor: .orange,
loadingColor: Color.orange.opacity(0.5),
strokeWidth: 5,
strokeColor: .gray)

var body: some View {
LoadingButton(action: {
// Your Action here
}, isLoading: $isLoading, style: style) {
Text(“Styled LoadingButton”).foregroundColor(Color.white)
}
}
}

Same Result

 

✅ TODO


  • End animation(normal, shake(when fail), expand)
  •  Support gradient background color

import SwiftUI
import LoadingButton

struct ContentView: View {
@State var isLoading: Bool = false

var body: some View {
LoadingButton(action: {
// Your Action here
}, isLoading: $isLoading, style: LoadingButtonStyle(cornerRadius: 27, backgroundColor: .orange)) {
Text(“Styled LoadingButton”).foregroundColor(Color.white)
}
}
}

GitHub


View Github

#animation #button #loading #swift
YOU MIGHT ALSO LIKE...
DeckKit

DeckKit is a SwiftUI library that makes it easy to create deck-based apps. It has a DeckView that can render any list ...

SwiftUICam

If you want to have a custom camera using SwiftUI and not using the UIPickerController that will display the original ...

CameraView for SwiftUI 📷

CameraView allows you to have a SnapChat-style screen on your SwiftUI app that gives a realtime view of the iPhone ...

Camera-SwiftUI

SwiftUI has proven to be a really awesome new framework to build and design apps in a quick and reliable ...