SwiftUI ile UIRefreshControl kullanımı

Merhabalar bu yazımda SwiftUI ile ScrollView içerisinde kullandığımız iPhone cihazlarda yukardan aşağıya doğru çekme işlemi sonrası ortaya çıkan UIRefreshControl nesnesinin kullanımını paylaşacağım.

iOS ile tüm liste refresh gerçekleştirecek uygulamalarda kullandığımız scroll işlemini SwiftUI ile gerçekleştirmemiz için Custom olarak UIKit nesnesi UIScrollView ve UIRefreshControl kullanmamız ve yazdığımız bu sınıfı UIViewRepresentable ‘dan türeterek SwiftUI için kullanılacak hale getirmemiz gerekli.

Aşağıdaki örneği inceleyebilir ve RefreshScrollView sınıfını uygulamalarınızda kullanabilirsiniz.

struct ContentView: View {
    
    var body: some View {
        NavigationView {
            RefreshScrollView {
                LazyVGrid(columns: Array(repeating: GridItem(.flexible()), count: 3), spacing: 2, content: {
                    ForEach(1...100, id: \.self) { index in
                        Text("\(index)")
                            .font(.largeTitle)
                            .padding()
                    }
                }).padding()
            } onRefresh: { control in
                DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
                    control.endRefreshing()
                }
            }
            .edgesIgnoringSafeArea(.bottom)
            .navigationTitle("List")
            .navigationBarTitleDisplayMode(.inline)
        }
    }
}

struct RefreshScrollView<Content: View>: UIViewRepresentable {
    
    var content: Content
    var onRefresh: (UIRefreshControl) -> Void
    var refreshControl = UIRefreshControl()
    
    init(@ViewBuilder content: @escaping () -> Content, onRefresh: @escaping (UIRefreshControl) -> Void) {
        self.content = content()
        self.onRefresh = onRefresh
    }
    
    func makeCoordinator() -> Coordinator {
        return Coordinator(parent: self)
    }
    
    func makeUIView(context: Context) -> UIScrollView {
        let scrollView = UIScrollView()
        refreshControl.addTarget(context.coordinator, action: #selector(context.coordinator.refreshAction), for: .valueChanged)
        refreshControl.tintColor = .black
        setupScrollView(scrollView: scrollView)
        scrollView.refreshControl = refreshControl
        return scrollView
    }
    
    func updateUIView(_ uiView: UIScrollView, context: Context) {
        setupScrollView(scrollView: uiView)
    }
    
    private func setupScrollView(scrollView: UIScrollView) {
        let hostView = UIHostingController(rootView: self.content.frame(maxHeight: .infinity, alignment: .top))
        hostView.view.translatesAutoresizingMaskIntoConstraints = false
        
        let constraints = [
            hostView.view.topAnchor.constraint(equalTo: scrollView.topAnchor),
            hostView.view.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
            hostView.view.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
            hostView.view.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
            hostView.view.widthAnchor.constraint(equalTo: scrollView.widthAnchor),
            hostView.view.heightAnchor.constraint(greaterThanOrEqualTo: scrollView.heightAnchor, constant: 1)
        ]
        scrollView.subviews.last?.removeFromSuperview()
        scrollView.addSubview(hostView.view)
        scrollView.addConstraints(constraints)
    }
    
    class Coordinator: NSObject {
        
        var parent: RefreshScrollView
        
        init(parent: RefreshScrollView) {
            self.parent = parent
        }
        
        @objc func refreshAction() {
            parent.onRefresh(parent.refreshControl)
        }
    }
}