SwiftUI: How to get drag and drop reordering of items to work?

Question

I have the following 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)
                }
            }
        }
    }
}

However, it doesn't appear that the onMove closure is executing. I believe this is because all gestures are only given to the ScrollView and so the inner views don't receive the gestures.

I tried converting this view to a List, however I don't want the row separators, which in iOS 14 I believe are impossible to hide.

So, I was wondering what I need to change to get this to allow the user to drag and drop CardViews to reorder them. Thanks!

Answer 1

According to Apple reply in Drag and Drop to reorder Items using the new LazyGrids?

That's not built-today, though you can use the View.onDrag(_:) and View.onDrop(...) to add support for drag and drop manually.

Do file a feedback request if you'd like to see built-in reordering support. Thanks!

So the solution using .onDrag & .onDrop provided in my answer for actually duplicated question in https://stackoverflow.com/a/63438481/12299030

Main idea is to track drug & drop by grid card views and reorder model in drop delegate, so LazyVGrid animates subviews:

   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)
            }
        }
    }