Close View when .onDrag leaves view boundaries in SwiftUI

Question

I want to close my object-menu as soon as my finger crosses the border of the view when dragging an item. CARE: I do not want to close the item when dropping the item. Unfortunately I have no idea on how to achieve this.

I am simply using:

struct BuildingItemSlot: View {

    var preview: ObjectPreview
    
    var body: some View {
        VStack() {
            Image(uiImage: UIImage(contentsOfFile: preview.dataPath + "/Raw/Thumbnails/" + preview.id + ".png") ?? UIImage())
                .resizable()
                //.scaledToFit()
                .frame(width: 64, height: 64)
                .padding(4)
                //.border(Color.black, width: 1)
        }
        .onDrag({ NSItemProvider() })
    }
}

embedded in a view that makes up the inventory ...

VStack() {
     ForEach(networkManager.objectPreviewList.objects ?? []){ preview in 
             BuildingItemSlot(preview: preview)
          }
      }
      .padding(40)

I am opening and closing the side menu simply by with:

.offset(x: stateHandler.openBuildingsMenu ? 0 : 480)

Thanks a lot, Jakob

Answer 1

Approach:

• Use onDrop(of:delegate) is the view modifier to be used on the view which can accept a drop.
• The DropDelegate has functions like
  • dropEntered ,
  • dropExited ,
  • dropUpdated ,
  • validateDrop - You can dynamically validate if drop is valid or not
  • performDrop
• Play around with above functions by adding print statements

Interruptions:

• It is not possible to interrupt drag gestures however validateDrop should give you control when to accept / deny drop dynamically.

Reference:

Mac

• SwiftUI on the Mac: The finishing touches
• Building a great mac app with SwiftUI

iOS

• Drag & Drop with SwiftUI

Note:

• There are some SwiftUI bugs for drag and drop for macOS and iOS, if you encounter any bugs drop a comment as it is difficult to list all the bugs.