web-dev-qa-db-ja.com

プルダウンしてSwiftUIのデータを更新します

私はListを使用してデータの簡単なリストを使用しました。プルダウンを追加して機能を更新したいのですが、どちらが最善のアプローチであるかわかりません。

UITableViewでUIRefreshControlをUIKitに追加した場合と同じように、ユーザーが一番最初のインデックスからプルダウンしようとした場合にのみ、プルダウンしてビューを更新できます。

SwiftUIにデータをリストするための簡単なコードを次に示します。

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

    var body: some View {
        NavigationView {
            List {
                ForEach(categories.keys.sorted().identified(by: \.self)) { key in
                    Text(key)
                }
            }
            .navigationBarTitle(Text("Featured"))
        }
    }
}
swiftlistuirefreshcontrolswiftui
18
PinkeshGjr

私が遊んでいるアプリにも同じものが必要でしたが、現時点ではSwiftUI APIに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コンポーネントを使用するには、LegacyScrollView() { // views here }ではなくUIHostingControllerにラップしてmakeUIViewにドロップする必要があります。 。

17
Evan Deaubl

以下は、ビュー階層をイントロスペクトし、適切なUIRefreshControlをSwiftUI Listのテーブルビューに追加する実装です。 https://github.com/timbersoftware/SwiftUIRefresh

イントロスペクションロジックの大部分はここにあります： https://github.com/timbersoftware/SwiftUIRefresh/blob/15d9deed3fec66e2c0f6fd1fd4fe966142a891db/Sources/PullToRefresh.Swift#L39-L7

9
ldiqual

こんにちは、私が作成したこのライブラリをチェックしてください： https://github.com/AppPear/SwiftUI-PullToRefresh

1行のコードで実装できます。

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
                }
            }
        }
    }
}
2
Samu Andras

Swiftui-introspectsはまだmasOSではサポートされていないため、iOSとmacOSの両方で機能するUIを構築する場合は、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

0
Phu HUYNH