Skip to content

Instantly share code, notes, and snippets.

@denisenepraunig
Created March 29, 2021 15:43
Show Gist options
  • Save denisenepraunig/449ff489d499da907564ec2b7da749e0 to your computer and use it in GitHub Desktop.
Save denisenepraunig/449ff489d499da907564ec2b7da749e0 to your computer and use it in GitHub Desktop.
SwiftUI Activity Indicator Sine Dots
import SwiftUI
struct DotIndicator: View {
@State private var isLoading = false
var body: some View {
HStack(spacing: 10) {
ForEach(0...4, id: \.self) { index in
Circle()
.frame(width: 20, height: 20)
.foregroundColor(Color(.systemGreen))
.scaleEffect(isLoading ? 0.2 : 1)
.offset(x: 0, y: isLoading ? -10 : 10)
.opacity(isLoading ? 0.2 : 1)
.animation(Animation.easeInOut(duration: 0.6).repeatForever().delay(0.2 * Double(index)))
}
}
.onAppear {
isLoading = true
}
}
}
struct DotIndicator_Previews: PreviewProvider {
static var previews: some View {
DotIndicator().preferredColorScheme(.dark)
}
}
@denisenepraunig
Copy link
Author

Animation preview

sine-dot-animation

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment