项目作者: Changemin

项目描述 :
🔄 Loading Animation Button for SwiftUI 🔄
高级语言: Swift
项目地址: git://github.com/Changemin/LoadingButton.git
创建时间: 2020-12-01T15:23:24Z
项目社区:https://github.com/Changemin/LoadingButton

开源协议:MIT License

下载



Project logo

🔄 SwiftUI LoadingButton 🔄



License
Release




Simple Loading Animation Button for SwiftUI


📹 Preview



🏁 Getting Started

Requirements

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

Installaion

Swift Package Manager(SPM)

  1. File Swift Packages Add Package Dependancy..
  1. .package(url: "https://github.com/Changemin/LoadingButton", from: "1.1.2")

🎈Usage

  1. LoadingButton(action: { }, isLoading: <Binding>Bool, style: LoadingButtonStyle) {
  2. // View on the button
  3. // 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

  1. LoadingButtonStyle(width: CGFloat,
  2. height: CGFloat,
  3. cornerRadius: CGFloat,
  4. backgroundColor: Color,
  5. loadingColor: Color,
  6. strokeWidth: CGFloat,
  7. strokeColor: Color)
  8. // 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

  1. import SwiftUI
  2. import LoadingButton
  3. struct ContentView: View {
  4. @State var isLoading: Bool = false
  5. var body: some View {
  6. LoadingButton(action: {
  7. // Your Action here
  8. }, isLoading: $isLoading) {
  9. Text("LoadingButton").foregroundColor(Color.white)
  10. }
  11. }
  12. }

Result


💅🏻 Applying Fully Custom Style

  1. import SwiftUI
  2. import LoadingButton
  3. struct ContentView: View {
  4. @State var isLoading: Bool = false
  5. var style = LoadingButtonStyle(width: 312,
  6. height: 54,
  7. cornerRadius: 27,
  8. backgroundColor: .orange,
  9. loadingColor: Color.orange.opacity(0.5),
  10. strokeWidth: 5,
  11. strokeColor: .gray)
  12. var body: some View {
  13. LoadingButton(action: {
  14. // Your Action here
  15. }, isLoading: $isLoading, style: style) {
  16. Text("Styled LoadingButton").foregroundColor(Color.white)
  17. }
  18. }
  19. }

Result


💅🏻 Styling Only Needs

  1. import SwiftUI
  2. import LoadingButton
  3. struct ContentView: View {
  4. @State var isLoading: Bool = false
  5. var body: some View {
  6. LoadingButton(action: {
  7. // Your Action here
  8. }, isLoading: $isLoading, style: LoadingButtonStyle(cornerRadius: 27, backgroundColor: .orange)) {
  9. Text("Styled LoadingButton").foregroundColor(Color.white)
  10. }
  11. }
  12. }

Same Result


✅ TODO

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

📜 License

LoadingButton is available under the MIT license. See the LICENSE file for more info.

✍️ Author