Physics-Based Interfaces with UIKit Dynamics

Physics-Based Interfaces with UIKit Dynamics

E5703b43507ace0a59aaa59e053d3e61?s=128

Sam Kirchmeier

March 20, 2014
Tweet

Transcript

  1. Physics-Based Interfaces with UIKit Dynamics Adam May @yammada ! Sam

    Kirchmeier @skirchmeier
  2. None
  3. None
  4. Agenda

  5. Introduction ! ! !

  6. Introduction Examples ! !

  7. Introduction Examples Deconstruction !

  8. Introduction Examples Deconstruction Collection Views

  9. ! Examples Deconstruction Collection Views Limitations & Gotchas Introduction

  10. Introduction

  11. Introduced with iOS 7 Not a separate framework – built

    into UIKit Can be anywhere you're using UIKit
  12. Another tool in your tool belt

  13. Physics-Based Interfaces

  14. Classical Mechanics

  15. Classical mechanics is concerned with the set of physical laws

    describing the motion of bodies under the action of a system of forces.
  16. 2014

  17. 2014 2007

  18. None
  19. None
  20. None
  21. None
  22. 2014 2007

  23. 2014 2007 1972

  24. None
  25. Pong: the original physics-based interface.

  26. More Recent Examples

  27. None
  28. None
  29. None
  30. None
  31. None
  32. None
  33. None
  34. None
  35. None
  36. None
  37. None
  38. None
  39. UIKit Dynamics

  40. Natural, real-world interactions Without very much code Beautiful API Fun

    Knowledge of physics not required
  41. UIView

  42. UIView UIDynamicAnimator Reference View

  43. UIView UIDynamicAnimator Reference View UIGravityBehavior

  44. UIView UIDynamicAnimator Reference View UIGravityBehavior UICollisionBehavior

  45. None
  46. UIDynamicItem Protocol !

  47. UIDynamicItem Protocol UIView UICollectionViewLayoutAttributes

  48. UIDynamicBehaviors

  49. UIDynamicBehavior Base Class

  50. UICollisionBehavior UIGravityBehavior ! ! !

  51. UICollisionBehavior UIGravityBehavior UIAttachmentBehavior UIDynamicItemBehavior UIPushBehavior UISnapBehavior

  52. Demo

  53. Deconstruction

  54. None
  55. None
  56. UICollisionBehavior UIGravityBehavior UIAttachmentBehavior UIDynamicItemBehavior UIPushBehavior UISnapBehavior

  57. 1. Create a UIDynamicAnimator. 2. Recognize a touch, and add

    an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
  58. 1. Create a UIDynamicAnimator. 2. Recognize a touch, and add

    an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
  59. 1. Create a UIDynamicAnimator. 2. Recognize a touch, and add

    an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
  60. 1. Create a UIDynamicAnimator. 2. Recognize a touch, and add

    an attachment behavior. 3. Update the attachment’s anchor point during the gesture. 4. When the gesture ends, add a snap behavior or a push behavior.
  61. Demo

  62. Collection Views

  63. Gotchas

  64. Only 2D Hard to visualize Weird units Everything’s a square

    Not perfect for games
  65. Recap

  66. Introduced UIKit Dynamics PhotoFling Demo TweetBattle Demo Limitations & Gotchas

  67. Thanks!

  68. Discussion https://github.com/livefront/dynamics Adam May @yammada ! Sam Kirchmeier @skirchmeier