Introducing Drag and Drop

1. drag and drop :在app之间或者app内生动地移动数据
   • 响应快速，在需要的时候move or copy 数据
   • 异步传输数据
   • 安全，数据只对destination app 可见
2. iPhone 只能在app内使用drag and drop

3. Phase of a drag session

   
   
   

   793b4447-164b-4a3c-b5cd-08b5e8a545e4.png

4. Enabling a Drag

   
   
   

   7195ee18-ef06-4706-9593-a1602a37b29f.png

5. Lift Phase

   
   
   

   a570e741-eee6-489b-b4e4-eb3854dfe944.png

6. Drag Items

   
   
   

   3e75a05c-d50d-446c-9fdb-8ae85a8fdf7d.png
7. Enabling a Drop

• UIPasteConfiguration

UIResponders have a new paste configuration property

// Indicate you can accept or paste strings
let config = UIPasteConfiguration(typeIdentifiersForAcceptingClass: NSString.self)
view.pasteConfiguration = config

// Will be called for both Drag and Drop, and Copy/Paste
override func paste(itemProviders: [NSItemProvider]) { }

• UIDropInteraction

1. Drag Phase: The delegate responds to drag events.
2. Set Down Phase: On touch up, the drag session may be cancelled, The drag preview animates back.Or the drop is accepted, The delegate is told to perform drop.
3. Data Transfer Phase: Delegate requests data representation of items.

feef2236-ee61-4a16-9e49-c458482c92e4.png

8. API Roadmap

   
   
   

   9192717b-5706-4813-ad41-5450d0e0a5d9.png
9. Drag and Drop Timeline

   1. not accepted

      
      
      

      0eb4d73f-30fa-4760-a18a-16dea8a15a2f.png

   2. accepted

      
      
      

      b8fe4daa-887a-4621-a22c-57d0b526a0e2.png
      
      
      

      af5660b7-4d62-4f8b-a35e-e2b86148cd59.png
10. API Essentials

func dragInteraction(_ interaction: UIDragInteraction,
                     itemsForBeginning session: UIDragSession) -> [UIDragItem] {
    let itemProvider = NSItemProvider(object: "Hello World" as NSString) 
    let dragItem = UIDragItem(itemProvider: itemProvider)
    return [ dragItem ]
}


func dropInteraction(_ interaction: UIDropInteraction,
                     sessionDidUpdate session: UIDropSession) -> UIDropProposal {
    return UIDropProposal(operation: UIDropOperation)
}

4ca12484-c74d-4e09-bffd-036c91bd1c0b.png

4f630645-37c7-43c9-8495-143d0145ffb5.png

func dropInteraction(_ interaction: UIDropInteraction, performDrop session: UIDropSession) {
    session.loadObjects(ofClass: UIImage.self) { objects in
        for image in objects as! [UIImage] {
            self.imageView.image = image
        }
    }
}

或者

func dropInteraction(_ interaction: UIDropInteraction, performDrop session: UIDropSession) {
    for item in session.items {
        item.itemProvider.loadObject(ofClass: UIImage.self) { (object, error) in
            if object != nil {
                DispatchQueue.main.async {
                    self.imageView.image = (object as! UIImage)
                }
            } else {
                // Handle the error
            }
            
        }
}

11. Drag Interaction Delegate

// Lift Phase
// Custom Preview, preview 不属于任何视图层级，所以需要target
func dragInteraction(_ interaction:UIDragInteraction,
                     previewForLifting item:UIDragItem, session:UIDragSession)
    -> UITargetedDragPreview? {
        let imageView = UIImageView(image: UIImage(named: "MyDragImage"))
        let dragView = interaction.view!
        let dragPoint = session.location(in: dragView)
        let target = UIDragPreviewTarget(container: dragView, center: dragPoint)
        return UITargetedDragPreview(view: imageView, parameters:UIDragPreviewParameters(),target:target)
}

// animator
func dragInteraction(_ interaction: UIDragInteraction, willAnimateLiftWith animator: UIDragAnimating,
                     session: UIDragSession) {
    animator.addAnimations { self.view.backgroundColor = UIColor.gray }
    animator.addCompletion { position in if position == .end {
        // The lift ended normally, and a drag is now happening
    }
    else if position == .start {
        // The lift was cancelled and the animation returned to the start
        }
    }
}

// Drag Phase
Session begins and moves
func dragInteraction(_ interaction: UIDragInteraction, sessionWillBegin session: UIDragSession)
func dragInteraction(_ interaction: UIDragInteraction, sessionAllowsMoveOperation session: UIDragSession) -> Bool
// And more methods asking questions about the new drag session
func dragInteraction(_ interaction: UIDragInteraction, sessionDidMove session: UIDragSession)

// Adding items during the session
func dragInteraction(_ interaction: UIDragInteraction, itemsForAddingTo session: UIDragSession,
                     withTouchAt point: CGPoint) -> [UIDragItem]

// custom preview
func dragInteraction(_ interaction:UIDragInteraction,
                     previewForLifting item:UIDragItem, session:UIDragSession)
    -> UITargetedDragPreview?

// The drag session ends
func dragInteraction(_ interaction: UIDragInteraction, session: UIDragSession,
willEndWith operation: UIDropOperation)

// The session ends in a cancel
func dragInteraction(_ interaction: UIDragInteraction, previewForCancelling item: UIDragItem,
withDefault defaultPreview: UITargetedDragPreview) -> UITargetedDragPreview?
func dragInteraction(_ interaction: UIDragInteraction, item: UIDragItem,
willAnimateCancelWith animator: UIDragAnimating)
func dragInteraction(_ interaction: UIDragInteraction, session: UIDragSession
didEndWith operation: UIDropOperation)

// The session ends in a copy or move
func dragInteraction(_ interaction: UIDragInteraction, session: UIDragSession
didEndWith operation: UIDropOperation)
func dragInteraction(_ interaction: UIDragInteraction, sessionDidTransferItems session: UIDragSession)

12. Drop Interaction Delegate

// Session enters the view
func dropInteraction(_ interaction: UIDropInteraction, canHandle session: UIDropSession) -> Bool {
     return session.canLoadObjects(ofClass: UIImage.self) 
//  return session.hasItemsConforming(toTypeIdentifiers: [kUTTypeImagePNG as String])
}

// Session enters and exits the view, may be mutiple times
func dropInteraction(_ interaction: UIDropInteraction, sessionDidEnter session: UIDropSession)
func dropInteraction(_ interaction: UIDropInteraction,
sessionDidUpdate session: UIDropSession) -> UIDropProposal
func dropInteraction(_ interaction: UIDropInteraction, sessionDidExit session: UIDropSession)

// Springloading: When session hovers over a view
  // UIKit自动触发action
let button = UIButton() 
button.isSpringLoaded = true

  // 自定义action
let springLoadedInteraction = UISpringLoadedInteraction { (interaction, context) in
 // Activate springloading here
}
 view.addInteraction(springLoadedInteraction)

// Session ends over a different view
func dropInteraction(_ interaction: UIDropInteraction, sessionDidEnd session: UIDropSession)

// Drop animations
func dropInteraction(_ interaction: UIDropInteraction, previewForDropping item: UIDragItem,
withDefault defaultPreview: UITargetedDragPreview) -> UITargetedDragPreview?
func dropInteraction(_ interaction: UIDropInteraction, item: UIDragItem,
willAnimateDropWith animator: UIDragAnimating)
func dropInteraction(_ interaction: UIDropInteraction, concludeDrop session: UIDropSession)

// Data transfer
func dropInteraction(_ interaction: UIDropInteraction, performDrop session: UIDropSession) 

let progress = item.itemProvider.loadObject(ofClass: UImage.self) { (object, error) in 
      // Closure is called when object or error are available
}
let fractionCompleted = progress.fractionCompleted let isFinished = progress.isFinished progress.cancel()
let sessionProgress = session.progress