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...
SwiftUI Charts

Build custom charts with SwiftUI Styles      

SwiftUICharts

A simple line and bar charting library that support accessibility written using SwiftUI.

Swipeable cards

Swipeable Cards with SwiftUI

RGStack

This UI attempts to capture the Quibi Card Stack and the associated User Interaction.

🃏 CardStack

A easy-to-use SwiftUI view for Tinder like cards on iOS, macOS & watchOS.