Eliminate the Annoying "+" Icon in Your SwiftUI Drag & Drop: A Practical Guide

Confused by that persistent green circle with a "+" during your SwiftUI drag and drop operations? You're not alone! This article dives into why that seemingly unkillable indicator appears and, more importantly, how to banish it from your app's user experience.

Decoding the Drag and Drop Mystery in SwiftUI

When implementing drag and drop functionality in SwiftUI, you might encounter a small green circle with a "+" sign appearing during the drag operation, especially when hovering over a drop target like a trash icon. Frustratingly, even attempting to hide the presentationDragIndicator might seem ineffective. So, what's going on?

• The "+" Symbol's Role: This indicator usually signifies that a copy operation will occur upon dropping the dragged item. SwiftUI, by default, assumes you want to duplicate the dragged object.

The Solution: Specifying the Correct Transfer Representation. Make sure to use .move transfer representation.

If your goal is to move the item, not copy it, you must explicitly tell SwiftUI. This is often the case when dragging an item to a trash icon for deletion or reordering items in a list.

.onDrag {
    NSItemProvider(object: item as NSItemProviderWriting)
}.onDrop(of: [.text], delegate: MyDropDelegate())

struct MyDropDelegate: DropDelegate {
    func dropEntered(info: DropInfo) {
          }
    func performDrop(info: DropInfo) -> Bool {
        return true
    }
    func dropExited(info: DropInfo) {
    }
}

Beyond the Basics: Fine-Tuning Your Drag and Drop

While specifying .move often solves the "plus sign" issue, consider these additional tips for creating a polished drag and drop experience:

• Customizing the Drag Preview: Use preview parameter within the onDrag modifier to create an informative visual representation of the dragged item.
• Drop Proposal: Take time to customize the proposal from .onDrop for a great user experience.

By understanding the default behavior of SwiftUI's drag and drop and explicitly defining your intended data transfer, you gain full control over the user experience. Banish that confusing "+" icon and create intuitive, user-friendly interactions in your SwiftUI applications! Implement the above strategies to refine SwiftUI drag and drop with .move transfer representation.