ios – Easy methods to take away an merchandise from its place whereas dragging it in a lazyVgrid utilizing .draggable? Principally tips on how to fully detach the merchandise whereas drag?


I’m implementing drag and drop for gadgets in a lazyVgrid for which I’m utilizing .draggable and .dropDestination
Proper now whereas I’m dragging an merchandise I see its preview and in addition the merchandise itself within the grid. I would like that solely the dragging preview needs to be seen and the unique merchandise ought to disappear from the grid till I’ve dropped it at some acceptable place. Picture exhibiting the preview for the blue dragged merchandise exhibiting each of them seem collectively

            ScrollView{
                LazyVGrid(columns: columns, spacing:10, content material: {
                    ForEach(colours, id:.self){ shade in
                        GeometryReader{
                            let measurement = $0.measurement
                            
                            RoundedRectangle(cornerRadius: /*@START_MENU_TOKEN@*/25.0/*@END_MENU_TOKEN@*/)
                                .fill(shade.gradient)
                                .draggable(shade){
                                    RoundedRectangle(cornerRadius: 25.0)
                                        .fill(.ultraThinMaterial)
                                        .body(width: measurement.width, top: measurement.top)
                                        .onAppear {
                                            draggingItem = shade
                                            print(measurement)
                                        }
                                }
                                .dropDestination(for: Shade.self) {gadgets,location in 
                                    return false
                                } isTargeted: { standing in
                                    if let draggingItem, standing, draggingItem != shade {
                                        if let sourceIndex = colours.firstIndex(of: draggingItem),
                                           let destinationIndex = colours.firstIndex(of: shade){
                                            withAnimation(.bouncy){
                                                let sourceItem = colours.take away(at: sourceIndex)
                                                colours.insert(sourceItem, at: destinationIndex)
                                                print(colours)
                                            }
                                        }
                                            
                                    }
//                                    print(standing)
                                }
                            }
                                .body(width: 120, top: 120)

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Latest Articles