- Notifications
You must be signed in to change notification settings - Fork1
SwiftUI loading indicator view
License
vinhnx/Laden
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
SwiftUI loading indicator view
This component is built using Swift Package Manager, it is pretty straight forward to use, no command-line needed:
- In Xcode (11+), open your project and navigate to
File > Swift Packages > Add Package Dependency... - Paste the repository URL:
https://github.com/vinhnx/Ladenand clickNext to have Xcode resolve package.3. For Rules, selectVersions, and chooseUp to Next Major as0.1.0, or checkout theReleases tab for upcoming releases.
4. ClickFinish to integrate package into your Xcode target.5. Profit!
At simplest form:
import SwiftUIimport LadenstructContentView:View{varbody:someView{Laden.CircleLoadingView()}}
To show loading view on top on current view, you can embed Laden inside aZStack, and put it below your current view:
ZStack{Text("Some text") // your content viewLaden.CircleOutlineLoadingView()}
or simply just use.overlay attribute:
Text("Some text") // your content view.overlay(Laden.BarLoadingView())
A view that overlays its children, aligning them in both axes.
To indicate loading state, have a private loading bool@State and bind it to Laden'sisAnimating initialzier, default value istrue (or animated by default):
import SwiftUIimport LadenstructContentView:View{@StateprivatevarisLoading=truevarbody:someView{VStack{Laden.CircleLoadingView(isAnimating: isLoading)Button(isLoading?"Stop loading":"Start loading"){self.isLoading.toggle()}}}}
To show or hide loading view, have a private show/hide bool@State and modify said loading with.hidden attribute, when toggled:
import SwiftUIimport LadenstructContentView:View{@StateprivatevarshouldLoadingView=truevarladen:someView{Laden.CircleLoadingView( color:.white, size:CGSize(width:30, height:30), strokeLineWidth:3)}varbody:someView{VStack{if shouldLoadingView{ laden.hidden()}else{ laden}Button(shouldCircleView?"Show":"Hide"){self.shouldLoadingView.toggle()}}}}
To customize loading view color, usecolor initializer:
Laden.CircleOutlineLoadingView(color:.red)
Available customizations:
/// Loading view protocol that define default configurations.publicprotocolLoadingAnimatable:View{ /// Whether this loading view is animating.varisAnimating:Bool{get} /// Default color for loading view.varcolor:Color{get} /// The default size for loading view.varsize:CGSize{getset} /// Default stroke line width for loading bar.varstrokeLineWidth:CGFloat{get}}
- Clendar - Clendar - universal calendar app. Written in SwiftUI. Available on App Store. MIT License.
idea 💡
- AppCoda's SwiftUI animation: for basic building block.
- ActivityIndicators: for idea how to build and publish a custom SwiftUI control package.
It's mean "charge", in Norwegian ⚡️
Feel free toopen an issue or contact me onTwitter for discussions, news & announcements & other projects. 🚀
I hope you like it! :)
About
SwiftUI loading indicator view