Custom Gesture Recognizer on iOS

Transcript

1. Custom Gesture Recognizer @TachibanaKaoru 2020/4/27 potatotips #69
2. About Me @TachibanaKaoru Freelance iOS Engineer
3. Gesture Recognizer
4. Default Gesture Recognizers UITapGestureRecognizer UISwipeGestureRecognizer UIRotationGestureRecognizer ....
5. Limitation of Default Gesture δΣενϟʔ͕ೝࣝ͞Ε͍ͯΔ్தͰͳʹ͔ॲཧΛ͍ͨ͠ɻ ಠࣗͷετϩʔΫͰೖྗ͍ͨ͠ɻ
6. ͦ͜Ͱ Custom Gesture Recognizer !
7. GestureRecognizerͷ͘͠Έ શମͷྲྀΕ view ͷλονΠϕϯτͷ଎౓΍ํ޲Λղੳ͢Δɻ ҙਤͨ͠଎౓ɾํ޲ͳΒδΣενϟʔೝࣝΛଓ͚ɺͦ͏Ͱͳ͚Ε͹ऴ ྃ͢Δɻ δΣενϟʔ͕ೝࣝͰ͖ͨΒ delegate ʹ recognizedΠϕϯτΛૹ৴͢ Δɻ
8. Tracking of UITouch
9. UITouch open class UITouch : NSObject { open var timestamp: TimeInterval { get } open var tapCount: Int { get } open var type: UITouch.TouchType { get } open func location(in view: UIView?) -> CGPoint open func previousLocation(in view: UIView?) -> CGPoint }
10. velocity vector with UITouch location previousLocation
11. velocity vector with UITouch location previousLocation (x1 , y1 )
12. velocity vector with UITouch location previousLocation (x1 , y1 ) (x2 , y2 )
13. velocity vector with UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) ( x2 − x1 t2 − t1 , y2 − y1 t2 − t1 ) 2఺ؒͷ଎౓ϕΫτϧ
14. velocity vector with UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) ( x2 − x1 t2 − t1 , y2 − y1 t2 − t1 ) 2఺ؒͷ଎౓ϕΫτϧ (x2 − x1 , y2 − y1 ) 2఺ؒͷ୯Ґ࣌ؒ͋ͨΓͷ଎౓ϕΫτϧ
15. struct Velocity { var vx: CGFloat var vy: CGFloat } extension UITouch{ func velocity(in view: UIView?) -> Velocity{ let location = location(in: view) let previousLocation = previousLocation(in: view) let distanceX = location.x - previousLocation.x let distanceY = location.y - previousLocation.y let velocity = Velocity(vx: distanceX, vy: distanceY) return velocity }
16. gradient of UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) θ
17. gradient of UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) θ vx vy
18. gradient of UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) θ vx vy tan θ = vy vx
19. gradient of UITouch location previousLocation (x1 , y1 ) (x2 , y2 ) θ vx vy tan θ = vy vx θ = tan−1 vy vx
20. struct Velocity { var vx: CGFloat var vy: CGFloat var gradient: CGFloat{ // ࣮ࡍʹ͸ɺvyɺvx͕0ͷ࣌ͷॲཧ͓Αͼɺgradient஋͕ 0-2πʹͳΔΑ͏ͳ // ਖ਼نԽΛߦ͍·͢ var calcGradient = atan(vy / vx) return calcGradient }
21. Radian ހ౓๏ 360° = 2 π radian
22. π 2 0 π 3π 2
23. π 2 0 π 3π 2 π 4
24. π 2 0 π 3π 2 3π 4
25. Tracking of UITouch ͜ΕͰɺUITouch͔Βɺ଎౓ϕΫτϧͱ܏͖ (gradient) ͕Θ͔ΔΑ͏ʹͳ Γ·ͨ͠ɻ
26. How to handle gesture state Custom Gesture RecognizerͰ͸ɺԼهͷ2छྨͷঢ়ଶΛ؅ཧ͠·͢ɻ δΣενϟʔͷશମঢ়ଶ (UIGestureRecognizer.State) ܧଓ or ࣦഊ or ੒ޭ ετϩʔΫͷ൑அ શମͷͲͷ෦෼Λೝࣝதͳͷ͔
27. UIGestureRecognizer.State open class UIGestureRecognizer : NSObject { // the current state of the gesture recognizer open var state: UIGestureRecognizer.State { get } }
28. class MyGestureRecognizer: UIGestureRecognizer{ override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent) { } override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent) { } override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent) { } override func touchesCancelled(_ touches: Set<UITouch>, with event: UIEvent) { } override func reset() { } }
29. Handling touch event t
30. Handling touch event touchesBegan t touchesMoved touchesEnd
31. touchesBegan t touchesMoved touchesEnd
32. Possible Recognized Failed Possible gestureॲཧܧଓ gestureॲཧऴྃ gestureॲཧऴྃ
33. P F P P P P R F F touchesBegan touchesMoved touchesEnd
34. ετϩʔΫͷ൑அ ετϩʔΫͷ܏͖͔Βɺೝ͍ࣝͨ͠δΣενϟʔͲͷετϩʔΫʹͳͷ ͔Λ൑அ͢Δɻ ෳ਺ͷετϩʔΫ͔Βߏ੒͞ΕΔδΣενϟʔ΋͋Δ
35. ೋͭͷ࿈ଓͨ͠ετϩʔΫ͔Βߏ੒͞ΕΔ৔߹
36. δΣενϟʔ։࢝ ӈԼ΁ͷετϩʔΫ ӈ্΁ͷετϩʔΫ δΣενϟʔ׬ྃ
37. P F P P P P R F F touchesBegan touchesMoved touchesEnd
38. ೋͭͷ࿈ଓ͠ͳ͍ετϩʔΫ͔Β ߏ੒͞ΕΔ৔߹
39. ӈԼ΁ͷετϩʔΫ͔Β࢝·Δύλʔϯ ࠨԼ΁ͷετϩʔΫ͔Β࢝·Δύλʔϯ
40. P F P P P F touchesBegan touchesMoved touchesEnd touchesEnd touchesMoved touchesMoved touchesBegan R F P P
41. ·ͱΊ Custom Gesture Recognizerͷ࣮૷͸ҙ֎ͱ؆୯Ͱ͢ɻ ͨͩ͠ɺετϩʔΫʹΑͬͯ͸ɺϢʔβʔͷೖྗΛҙਤ௨Γʹ൑அ͢Δ ͷ͕೉͍͠৔߹΋͋ΔͨΊɺঢ়گʹԠͨ͡࠷దԽ͕ඞཁɻ αϯϓϧ͕ͪ͜Βʹ͋ΔͷͰɺΑ͔ͬͨΒݟͯΈ͍ͯͩ͘͞ɻ https://github.com/TachibanaKaoru/CustomGestureRecognizer