在 SwiftUI 中，可以使用 `List` 或 `ScrollView` 来显示可滚动的列表或视图。为了添加
下拉刷新功能，可以使用 `UIRefreshControl`。
首先，需要创建一个 `UIRefreshControl` 的实例，然后将其添加到 `List` 或 `ScrollView` 中。在用户
下拉列表时，`UIRefreshControl` 会触发一个动作。在该动作中，可以执行更新数据的操作，并结束
下拉刷新。
下面是一个示例代码，演示如何在 SwiftUI 中使用 `UIRefreshControl`
实现下拉刷新：
```swift
import SwiftUI
struct ContentView: View {
@State private var isRefreshing = false
@State private var data = ["Item 1", "Item 2", "Item 3"]
var body: some View {
List(data, id: \.self) { item in
Text(item)
}
.onPullToRefresh(isRefreshing: $isRefreshing) {
// Simulate a network request
DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
self.data = ["New Item 1", "New Item 2", "New Item 3"]
self.isRefreshing = false
}
}
}
}
extension View {
func onPullToRefresh(isRefreshing: Binding<Bool>, action: @escaping () -> Void) -> some View {
ModifiedContent(content: self, modifier: PullToRefresh(isRefreshing: isRefreshing, action: action))
}
}
struct PullToRefresh: ViewModifier {
@Binding var isRefreshing: Bool
var action: () -> Void
func body(content: Content) -> some View {
content
.overlay(
GeometryReader { geometry in
VStack {
if self.isRefreshing {
ActivityIndicator(isAnimating: .constant(true), style: .medium)
} else {
Color.clear
}
}
.frame(width: geometry.size.width, height: 60, alignment: .center)
.offset(y: -60)
},
alignment: .bottom
)
.onAppear {
let refreshControl = UIRefreshControl()
refreshControl.addTarget(self, action: #selector(self.onRefresh), for: .valueChanged)
UITableView.appearance().refreshControl = refreshControl
}
}
@objc private func onRefresh() {
isRefreshing = true
action()
}
}
struct ActivityIndicator: UIViewRepresentable {
@Binding var isAnimating: Bool
let style: UIActivityIndicatorView.Style
func makeUIView(context: UIViewRepresentableContext<ActivityIndicator>) -> UIActivityIndicatorView {
UIActivityIndicatorView(style: style)
}
func updateUIView(_ uiView: UIActivityIndicatorView, context: UIViewRepresentableContext<ActivityIndicator>) {
isAnimating ? uiView.startAnimating() : uiView.stopAnimating()
}
}
```
在该示例中，我们使用 `List` 显示一个简单的字符串列表。我们添加了一个名为 `onPullToRefresh` 的自定义修饰符，用于在 `List` 上添加
下拉刷新功能。该修饰符接受两个参数：一个布尔绑定，用于控制刷新控件的状态；一个闭包，用于执行更新数据的操作。
在该示例中，我们使用 `GeometryReader` 将一个 `ActivityIndicatorView` 添加到列表头部。当用户
下拉列表时，`UIRefreshControl` 会触发一个动作，在该动作中，我们将布尔绑定设置为 `true`，然后执行更新数据的操作。当数据更新完成后，我们将布尔绑定设置为 `false`，结束
下拉刷新。
请注意，由于 SwiftUI 中的 `List` 是基于 `
UITableView`
实现的，因此我们需要使用 `
UITableView` 的 `refreshControl` 属性来添加 `UIRefreshControl`。在 `onAppear` 中，我们设置了 `
UITableView` 的 `refreshControl` 属性，将其与我们创建的 `UIRefreshControl` 实例关联起来。
71
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
