Na WWDC 2017, a Apple reinventou o Drag and Drop. No iPad, agora é possível compartilhar dados com outras apps de uma maneira fácil e intuitiva. Além disso, ele abre novas possibilidades de interações para o usuário dentro da app, tanto no iPad quanto no iPhone. O objetivo da palestra é explicar o funcionamento das novas APIs de Drag and Drop, mostrando desde integrações mais simples até como customizar as interações e tornar suas próprias estruturas de dados arrastáveis. Durante a palestra veremos aplicações reais e exemplos de códigos escritos no aplicativo do VivaReal para o iOS 11.

1. Rodrigo Borges Soares
iOS Developer @ VivaReal
Drag and Drop no iOS 11

2. Eu 🤓
• Manauara
• Desenvolvedor Mobile desde 2009
• Mestre em Computação Móvel @ UFMG 📡
• Lead iOS Developer @ VivaReal 🏡

3. Resumo
1. Drag and Drop
2. Definindo o modelo de dados arrastável
3. Customizando a experiência

4. Drag and Drop
Table Views, Collection Views e Custom Views 📱

5. Drag and Drop

6. Drag and Drop
• Table Views e Collection Views
• UICollectionViewDragDelegate, UICollectionViewDropDelegate
• Custom UIViews
• UIDragInterationDelegate, UIDropInteractionDelegate
• Classes importantes
• UIDragItem, UIDragSession, UIDropSession, NSItemProvider

7. • UIDragSession & UIDropSession
• Objetos criados pelo sistema para gerenciar o Drag/Drop
• UIDragItem
• Objetos que são arrastado em uma UIDragSession
• NSItemProvider
• Encapsula os dados arrastáveis
• NSString, NSAttributedString, NSURL, UIColor, UIImage
• NSItemProviderWriting: definir representação do seu modelo
Conceitos importantes

8. Drag em Collection Views
1. Criar um UICollectionViewDragDelegate
1. Criar UIDragItems (objetos que são arrastados)
2. Definir drag delegate da Collection View

9. Drag em Collection Views
1. Criar um UICollectionViewDragDelegate

10. Drag em Collection Views
2. Definir Drag Delegate da Collection View

11. Drag em Collection Views
Drag de múltiplos UIDragItem ao mesmo tempo

12. Drag em Custom Views

13. Drag em Custom Views
1. Criar um UIDragInteractionDelegate
1. Criar UIDragItems (objetos que são arrastados)
2. Instanciar e associar UIDragInteraction à View

14. Drag em Custom Views

15. Drag em Custom Views
1. Criar um UIDragInteractionDelegate

16. Drag em Custom Views
2. Instanciar e associar UIDragInteraction à View

17. Drop em Collection Views

18. Drop em Collection Views
1. Criar UICollectionViewDropDelegate
2. Definir drop delegate da Collection View

19. Drop em Collection Views
1. Criar UICollectionViewDropDelegate

20. • Como o drop é dentro da própria app, podemos usar o localObject da
UIDragItem
• UICollectionViewDropProposal mostra um feedback sobre o resultado do drop
• .cancel, .forbidden, .copy, .move
Drop em Collection Views
1. Criar UICollectionViewDropDelegate

21. Drop em Collection Views
2. Definir drop delegate da Collection View

22. Definindo representações de
dados
NSProviderItemWriting FTW! 🚀

23. Definindo representações de dados
• Melhor representação para um anúncio de imóvel?
• NSString (descrição, URL, etc)
• NSURL
• NSAttributedString (texto + foto)
• UIImage
• UIColor
• MKMapItem

24. Definindo representações de dados
Notes Messages

25. Definindo representações de dados
Como definir múltiplas representações de dados para um objeto?

26. Definindo representações de dados

27. Definindo representações de dados
NSItemProviderWriting! 🙏

28. Definindo representações de dados

29. Definindo representações de dados

30. Criando um contato para a agenda

31. Criando um contato para a agenda

32. Customizando a experiência
Implementando interfaces para os drag items 🖼

33. Customizando a experiência

34. Customizando a experiência

35. Bônus: Spring Loading
Navegando na interface durante o Drag 🚢

36. Spring Loading

37. Referências
• Drag and Drop - UIKit Documentation
• https://developer.apple.com/documentation/uikit/drag_and_drop
• Drag and Drop Human Interface Guidelines
• https://developer.apple.com/ios/human-interface-guidelines/user-interaction/
drag-and-drop/
• WWDC Drag and Drop Sessions
• https://developer.apple.com/videos/play/wwdc2017/203/

38. That’s all folks! ✌
Rodrigo Borges
rborges.soares@gmail.com
@rdgborges
lindekin.com/in/rdgborges
medium.com/@rdgborges
🤓
📧
🐦
💻
📝