Laden

SwiftUI 加载指示器视图

安装

此组件使用 Swift Package Manager 构建，使用起来非常简单，无需命令行

在 Xcode (11+) 中，打开你的项目并导航到 File > Swift Packages > Add Package Dependency...
粘贴仓库 URL

https://github.com/vinhnx/Laden

然后点击 Next 以让 Xcode 解析包。3. 对于 Rules，选择 Versions，并选择 Up to Next Major 作为 0.1.0，或者查看 Releases 标签以获取即将发布的版本。 4. 点击 Finish 以将包集成到你的 Xcode 目标中。 5. 尽情享用吧！☺️

用法

最简形式

import SwiftUI
import Laden

struct ContentView: View {
    var body: some View {
        Laden.CircleLoadingView()
    }
}

要在当前视图顶部显示加载视图，你可以将 Laden 嵌入到 ZStack 中，并将其放在当前视图下方

ZStack {
    Text("Some text") // your content view
    Laden.CircleOutlineLoadingView()
}

或者直接使用 .overlay 属性

Text("Some text") // your content view
  .overlay(Laden.BarLoadingView())

ZStack

一个覆盖其子视图的视图，使其在两个轴上对齐。

要指示加载状态，请使用一个私有的加载布尔值 @State 并将其绑定到 Laden 的 isAnimating 初始化器，默认值为 true（或默认动画）

import SwiftUI
import Laden

struct ContentView: View {
    @State private var isLoading = true

    var body: some View {
        VStack {
            Laden.CircleLoadingView(isAnimating: isLoading)
            Button(isLoading ? "Stop loading" : "Start loading") {
                self.isLoading.toggle()
            }
        }
    }
}

要显示或隐藏加载视图，请使用一个私有的显示/隐藏布尔值 @State，并在切换时使用 .hidden 属性修改加载状态

import SwiftUI
import Laden

struct ContentView: View {
    @State private var shouldLoadingView = true

    var laden: some View {
        Laden.CircleLoadingView(
            color: .white, size: CGSize(width: 30, height: 30), strokeLineWidth: 3
        )
    }
    
    var body: some View {
        VStack {
            if shouldLoadingView {
                laden.hidden()
            } else {
                laden
            }

            Button(shouldCircleView ? "Show" : "Hide") {
                self.shouldLoadingView.toggle()
            }
        }
    }
}

自定义

要自定义加载视图颜色，请使用 color 初始化器

Laden.CircleOutlineLoadingView(color: .red)

可用的自定义项

/// Loading view protocol that define default configurations.
public protocol LoadingAnimatable: View {
    /// Whether this loading view is animating.
    var isAnimating: Bool { get }

    /// Default color for loading view.
    var color: Color { get }

    /// The default size for loading view.
    var size: CGSize { get set }

    /// Default stroke line width for loading bar.
    var strokeLineWidth: CGFloat { get }
}

当前正在使用 Laden 的应用

Clendar - Clendar - 通用日历应用。使用 SwiftUI 编写。在 App Store 上可用。MIT 许可证。

(在此处添加你的应用)

致谢

想法 💡

AppCoda 的 SwiftUI 动画：用于基本构建块。
ActivityIndicators：用于了解如何构建和发布自定义 SwiftUI 控件包的想法。

Laden 实际上是什么？

它的意思是“充电”，在挪威语中 ⚡️

帮助、反馈或建议？

欢迎提出 issue 或在 Twitter 上联系我，讨论、获取新闻和公告以及其他项目。 🚀

希望你喜欢！:)