Потяните вниз, чтобы обновить данные в SwiftUI

Мне нужно было то же самое для приложения, с которым я играю, и похоже, что API SwiftUI в настоящее время не включает возможность управления обновлением для ScrollViews.

Со временем API будет разрабатывать и исправлять подобные ситуации, но общим резервом отсутствующей функциональности в SwiftUI всегда будет реализация структуры, реализующей UIViewRepresentable. Вот быстрый и грязный пример для UIScrollView с контролем обновления.

struct LegacyScrollView : UIViewRepresentable {
    // any data state, if needed

    func makeCoordinator() -> Coordinator {
        Coordinator(self)
    }

    func makeUIView(context: Context) -> UIScrollView {
        let control = UIScrollView()
        control.refreshControl = UIRefreshControl()
        control.refreshControl?.addTarget(context.coordinator, action:
            #selector(Coordinator.handleRefreshControl),
                                          for: .valueChanged)

        // Simply to give some content to see in the app
        let label = UILabel(frame: CGRect(x: 0, y: 0, width: 200, height: 30))
        label.text = "Scroll View Content"
        control.addSubview(label)

        return control
    }


    func updateUIView(_ uiView: UIScrollView, context: Context) {
        // code to update scroll view from view state, if needed
    }

    class Coordinator: NSObject {
        var control: LegacyScrollView

        init(_ control: LegacyScrollView) {
            self.control = control
        }

        @objc func handleRefreshControl(sender: UIRefreshControl) {
            // handle the refresh event

            sender.endRefreshing()
        }
    }
}

Но, конечно, вы не можете использовать какие-либо компоненты SwiftUI в своем представлении прокрутки, не обернув их в UIHostingController и не перетащив в makeUIView, а не поместив в LegacyScrollView() { // views here }.

Привет, проверьте эту библиотеку, которую я сделал: https://github.com/AppPear/SwiftUI-PullToRefresh

Вы можете реализовать это одной строкой кода:

struct CategoryHome: View {
    var categories: [String: [Landmark]] {
        .init(
            grouping: landmarkData,
            by: { $0.category.rawValue }
        )
    }

    var body: some View {
        RefreshableNavigationView(title: "Featured", action:{
           // your refresh action
        }){
                ForEach(categories.keys.sorted().identified(by: \.self)) { key in
                    Text(key)
                    Divider() // !!! this is important to add cell separation
                }
            }
        }
    }
}

Вот реализация, которая анализирует иерархию представлений и добавляет правильный UIRefreshControl к табличному представлению SwiftUI List: https://github.com/timbersoftware/SwiftUIRefresh

Большую часть логики самоанализа можно найти здесь: https://github.com/timbersoftware/SwiftUIRefresh/blob/15d9deed3fec66e2c0f6fd1fd4fe966142a891db/Sources/PullToRefresh.swift#L39-L73

Swiftui-introspects еще не поддерживается в masOS, поэтому, если вы собираетесь создать пользовательский интерфейс, который работает как для iOS, так и для macOS, рассмотрите библиотеку Samu Andras.

Я разветвил его код, добавил несколько улучшений и добавил возможность использовать без NavigationView.

Вот пример кода.

RefreshableList(showRefreshView: $showRefreshView, action:{
                           // Your refresh action
                            // Remember to set the showRefreshView to false
                            self.showRefreshView = false

                        }){
                            ForEach(self.numbers, id: \.self){ number in
                                VStack(alignment: .leading){
                                    Text("\(number)")
                                    Divider()
                                }
                            }
                        }

Для получения более подробной информации вы можете перейти по ссылке ниже. https://github.com/phuhuynh2411/SwiftUI-PullToRefresh

вот решение просто, небольшой и чистый SwiftUI, которое я сделал, чтобы добавить функциональность обновления для ScrollView.

struct PullToRefresh: View {
    
    var coordinateSpaceName: String
    var onRefresh: ()->Void
    
    @State var needRefresh: Bool = false
    
    var body: some View {
        GeometryReader { geo in
            if (geo.frame(in: .named(coordinateSpaceName)).midY > 50) {
                Spacer()
                    .onAppear {
                        needRefresh = true
                    }
            } else if (geo.frame(in: .named(coordinateSpaceName)).maxY < 10) {
                Spacer()
                    .onAppear {
                        if needRefresh {
                            needRefresh = false
                            onRefresh()
                        }
                    }
            }
            HStack {
                Spacer()
                if needRefresh {
                    ProgressView()
                } else {
                    Text("⬇️")
                }
                Spacer()
            }
        }.padding(.top, -50)
    }
}

Чтобы использовать его просто, просто добавьте его вверху вашего ScrollView и дайте ему координатное пространство ScrollView :

ScrollView {
    PullToRefresh(coordinateSpaceName: "pullToRefresh") {
        // do your stuff when pulled
    }
    
    Text("Some view...")
}.coordinateSpace(name: "pullToRefresh")

Я пробовал много разных решений, но ничего не работало достаточно хорошо для моего случая. Решения на основе GeometryReader имели плохую производительность для сложной компоновки.

Вот чистое представление SwiftUI 2.0, которое работает хорошо, не снижает производительность прокрутки при постоянном обновлении состояния и не использует никаких хаков UIKit:

import SwiftUI

struct PullToRefreshView: View
{
    private static let minRefreshTimeInterval = TimeInterval(0.2)
    private static let triggerHeight = CGFloat(100)
    private static let indicatorHeight = CGFloat(100)
    private static let fullHeight = triggerHeight + indicatorHeight
    
    let backgroundColor: Color
    let foregroundColor: Color
    let isEnabled: Bool
    let onRefresh: () -> Void
    
    @State private var isRefreshIndicatorVisible = false
    @State private var refreshStartTime: Date? = nil
    
    init(bg: Color = .white, fg: Color = .black, isEnabled: Bool = true, onRefresh: @escaping () -> Void)
    {
        self.backgroundColor = bg
        self.foregroundColor = fg
        self.isEnabled = isEnabled
        self.onRefresh = onRefresh
    }
    
    var body: some View
    {
        VStack(spacing: 0)
        {
            LazyVStack(spacing: 0)
            {
                Color.clear
                    .frame(height: Self.triggerHeight)
                    .onAppear
                    {
                        if isEnabled
                        {
                            withAnimation
                            {
                                isRefreshIndicatorVisible = true
                            }
                            refreshStartTime = Date()
                        }
                    }
                    .onDisappear
                    {
                        if isEnabled, isRefreshIndicatorVisible, let diff = refreshStartTime?.distance(to: Date()), diff > Self.minRefreshTimeInterval
                        {
                            onRefresh()
                        }
                        withAnimation
                        {
                            isRefreshIndicatorVisible = false
                        }
                        refreshStartTime = nil
                    }
            }
            .frame(height: Self.triggerHeight)
            
            indicator
                .frame(height: Self.indicatorHeight)
        }
        .background(backgroundColor)
        .ignoresSafeArea(edges: .all)
        .frame(height: Self.fullHeight)
        .padding(.top, -Self.fullHeight)
    }
    
    private var indicator: some View
    {
        ProgressView()
            .progressViewStyle(CircularProgressViewStyle(tint: foregroundColor))
            .opacity(isRefreshIndicatorVisible ? 1 : 0)
    }
}

Он использует LazyVStack с отрицательным дополнением для вызова onAppear и onDisappear в представлении триггера Color.clear, когда он входит или выходит за границы экрана.

Обновление запускается, если время между появлением и исчезновением представления триггера превышает minRefreshTimeInterval, чтобы позволить ScrollView отскакивать без запуска обновления.

Чтобы использовать его, добавьте PullToRefreshView в начало ScrollView:

import SwiftUI

struct RefreshableScrollableContent: View
{
    var body: some View
    {
        ScrollView
        {
            VStack(spacing: 0)
            {
                PullToRefreshView { print("refreshing") }
                
                // ScrollView content
            }
        }
    }
}

Суть: https://gist.github.com/tkashkin/e5f6b65b255b25269d718350c024f550

Честно говоря, ни один из ответов с самым высоким рейтингом не работал хорошо для моего сценария. В сценарии было переключение между ScrollView и пользовательским LoadingView. И каждый раз, когда я переключаюсь с LoadingView на ScrollView, который создается с использованием устаревшего UIScrollView с использованием UIViewRepresentable, contentSize портится.

Поэтому в качестве решения я создал библиотеку, которая может быть полезна всем разработчикам, пытающимся найти решение такой простой проблемы. Я взял хорошие кусочки со всего Интернета, просмотрел множество сайтов и, наконец, подправил решение, которое в итоге дало мне лучшее решение.

Шаги

1. Добавьте SPMhttps://github.com/bibinjacobpulickal/BBRefreshableScrollView в свой проект.
2. import BBRefreshableScrollView в нужный файл.
3. Обновите View's body.

struct CategoryHome: View {
    ...
    var body: some View {
        NavigationView {
            BBRefreshableScrollView { completion in
                // do refreshing stuff here
            } content: {
                ForEach(categories.keys.sorted().identified(by: \.self)) { key in
                    Text(key)
                }
            }
            .navigationBarTitle(Text("Featured"))
        }
    }
}

Для получения более подробной информации вы можете следить за Прочти меня.

Это чистый подход SwiftUI с использованием ScrollView, GeometryReader и PreferenceKey. Я могу прочитать смещение прокрутки в ScrollView, и как только оно превысит пороговое значение, я могу выполнить действие

import SwiftUI

struct RefreshableView<Content:View>: View {
    init(action: @escaping () -> Void, @ViewBuilder content: @escaping () -> Content) {
        self.content = content
        self.refreshAction = action
    }
    
    var body: some View {
        GeometryReader { geometry in
            ScrollView {
                content()
                    .anchorPreference(key: OffsetPreferenceKey.self, value: .top) {
                        geometry[$0].y
                    }
            }
            .onPreferenceChange(OffsetPreferenceKey.self) { offset in
                if offset > threshold {
                    refreshAction()
                }
            }
        }
    }
    
    
    private var content: () -> Content
    private var refreshAction: () -> Void
    private let threshold:CGFloat = 50.0
}

fileprivate struct OffsetPreferenceKey: PreferenceKey {
    static var defaultValue: CGFloat = 0
    
    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
        value = nextValue()
    }
}

Это пример использования RefreshableView. Индикатор выполнения не включен в RefreshableView, который предоставляет только GeometryReader и ScrollView, включая содержимое, которое вы хотите обновить. Вам нужно предоставить ProgressView или другое представление, чтобы показать, что идет загрузка. Это не работает со списком, но вместо этого вы можете использовать ForEach, и содержимое будет прокручиваться благодаря ScrollView

RefreshableView(action: {
    viewModel.refreshFeed(forceReload: true)
}) {
    if viewModel.showProgressView {
        VStack {
            ProgressView()
            Text("reloading feed...")
                .font(Font.caption2)
        }
    }
    ForEach(viewModel.feed.entries) { entry in
        viewForEntry(entry)
    }
}

Полный пример можно найти на Гитхаб

от iOS 15+

NavigationView {
    List(1..<100) { row in
     Text("Row \(row)")
    }
    .refreshable {
         print("write your pull to refresh logic here")
    }
}

подробнее: Яблочный документ

что насчет этого

import SwiftUI

public struct FreshScrollView<Content>: View where Content : View{
    private let content: () -> Content
    private let action: () -> Void
    
    init(@ViewBuilder content:  @escaping () -> Content, action: @escaping ()-> Void){
        self.content = content
        self.action = action
    }
    
    @State var startY: Double = 10000
    
    public var body: some View{
        ScrollView{
            GeometryReader{ geometry in
                HStack {
                    Spacer()
                    if geometry.frame(in: .global) .minY - startY > 30{
                        ProgressView()
                            .padding(.top, -30)
                            .animation(.easeInOut)
                            .transition(.opacity)
                            .onAppear{
                                let noti = UIImpactFeedbackGenerator(style: .light)
                                noti.prepare()
                                noti.impactOccurred()
                                action()
                            }
                    }
                    Spacer()
                }
                .onAppear {
                    startY = geometry.frame(in:.global).minY
                }
            }
            content()
        }
    }
}


#if DEBUG
struct FreshScrollView_Previews: PreviewProvider {
    static var previews: some View {
        FreshScrollView {
            Text("A")
            Text("B")
            Text("C")
            Text("D")
        } action: {
            print("text")
        }

    }
}
#endif

Я знаю, что исходный вопрос был для списка, но вот код для ScrollView и LazyVStack, так как иногда список не подходит.

import SwiftUI

struct PullToRefreshSwiftUI: View {
    @Binding private var needRefresh: Bool
    private let coordinateSpaceName: String
    private let onRefresh: () -> Void
    
    init(needRefresh: Binding<Bool>, coordinateSpaceName: String, onRefresh: @escaping () -> Void) {
        self._needRefresh = needRefresh
        self.coordinateSpaceName = coordinateSpaceName
        self.onRefresh = onRefresh
    }
    
    var body: some View {
        HStack(alignment: .center) {
            if needRefresh {
                VStack {
                    Spacer()
                    ProgressView()
                    Spacer()
                }
                .frame(height: 100)
            }
        }
        .background(GeometryReader {
            Color.clear.preference(key: ScrollViewOffsetPreferenceKey.self,
                                   value: $0.frame(in: .named(coordinateSpaceName)).origin.y)
        })
        .onPreferenceChange(ScrollViewOffsetPreferenceKey.self) { offset in
            guard !needRefresh else { return }
            if abs(offset) > 50 {
                needRefresh = true
                onRefresh()
            }
        }
    }
}


struct ScrollViewOffsetPreferenceKey: PreferenceKey {
    typealias Value = CGFloat
    static var defaultValue = CGFloat.zero
    static func reduce(value: inout Value, nextValue: () -> Value) {
        value += nextValue()
    }

}

И вот типичное использование:

struct ContentView: View {
    @State private var refresh: Bool = false
    @State private var itemList: [Int] = {
        var array = [Int]()
        (0..<40).forEach { value in
            array.append(value)
        }
        return array
    }()
    
    var body: some View {
        ScrollView {
            PullToRefreshSwiftUI(needRefresh: $refresh,
                                 coordinateSpaceName: "pullToRefresh") {
                DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
                    withAnimation { refresh = false }
                }
            }
            LazyVStack {
                ForEach(itemList, id: \.self) { item in
                    HStack {
                        Spacer()
                        Text("\(item)")
                        Spacer()
                    }
                }
            }
        }
        .coordinateSpace(name: "pullToRefresh")
    }
}