web-dev-qa-db-ja.com

Swiftui:商品の並べ替えをドラッグアンドドロップする方法は?

次のSwiftui Viewがあります。

struct ContentView: View {
    @State var model: Model
    
    var body: some View {
        ScrollView {
            LazyVGrid(columns: columns, spacing: 10) {
                ForEach(model.events, id: \.self) { event in
                    CardView(event: event)
                }
                .onMove { indices, newOffset in
                    model.events.move(fromOffsets: indices, toOffset: newOffset)
                }
            }
        }
    }
}
 _

ただし、onMoveクロージャーが実行されているとは見えません。私はこれがすべてのジェスチャーがScrollViewにのみ与えられているので、内側のビューはジェスチャーを受け取らないからです。

このビューをListに変換しようとしましたが、iOS 14では隠れることが不可能な行区切り記号は望ましくありません。

だから、私はユーザーがそれらを並べ替えるためにCardViewsをドラッグアンドドロップすることをユーザーにドラッグアンドドロップすることを許可するために何を変更する必要があるか疑問に思いました。ありがとう!

10

Apple返信] 新しいlazygridsを使用してアイテムを並べ替えるにドラッグアンドドロップしますか

それは今日構築されていませんが、View.OndRag(_ :)とView.Ondrop(...)を使用して、ドラッグアンドドロップを手動で追加できます。

組み込みの並べ替えサポートを見たい場合は、フィードバック要求を実行してください。ありがとう!

そのため、実際に重複した質問のために私の答えで提供された。 https://stackoverflow.com/a/63438481/122990

主なアイデアは、ドロップカードビューでドラッグ&ドロップを追跡することです。ドロップデリゲートでモデルを並べ替えることができるため、LazyVgrid Animatesサブビュー

   LazyVGrid(columns: model.columns, spacing: 32) {
        ForEach(model.data) { d in
            GridItemView(d: d)
                .overlay(dragging?.id == d.id ? Color.white.opacity(0.8) : Color.clear)
                .onDrag {
                    self.dragging = d
                    return NSItemProvider(object: String(d.id) as NSString)
                }
                .onDrop(of: [UTType.text], delegate: DragRelocateDelegate(item: d, listData: $model.data, current: $dragging))
        }
    }.animation(.default, value: model.data)
 _

...

    func dropEntered(info: DropInfo) {
        if item != current {
            let from = listData.firstIndex(of: current!)!
            let to = listData.firstIndex(of: item)!
            if listData[to].id != current!.id {
                listData.move(fromOffsets: IndexSet(integer: from),
                    toOffset: to > from ? to + 1 : to)
            }
        }
    }
 _
2
Asperi