Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up
for free
Custom Gesture Recognizer on iOS
Tachibana Kaoru
April 27, 2020
3
630
Custom Gesture Recognizer on iOS
Tachibana Kaoru
April 27, 2020
Tweet
Share
More Decks by Tachibana Kaoru
See All by Tachibana Kaoru
toyship
2
610
toyship
1
620
toyship
1
480
toyship
3
260
toyship
5
5.6k
toyship
2
500
toyship
3
2.9k
toyship
1
1.2k
toyship
2
400
Featured
See All Featured
holman
461
280k
lauravandoore
10
1.6k
smashingmag
283
47k
destraynor
222
47k
keithpitt
401
20k
searls
204
36k
deanohume
294
28k
ammeep
656
54k
jrom
116
7.2k
trallard
14
720
stephaniewalter
260
11k
moore
125
21k
Transcript
Custom Gesture Recognizer @TachibanaKaoru 2020/4/27 potatotips #69
About Me @TachibanaKaoru Freelance iOS Engineer
Gesture Recognizer
Default Gesture Recognizers UITapGestureRecognizer UISwipeGestureRecognizer UIRotationGestureRecognizer ....
Limitation of Default Gesture δΣενϟʔ͕ೝࣝ͞Ε͍ͯΔ్தͰͳʹ͔ॲཧΛ͍ͨ͠ɻ ಠࣗͷετϩʔΫͰೖྗ͍ͨ͠ɻ
ͦ͜Ͱ Custom Gesture Recognizer !
GestureRecognizerͷ͘͠Έ શମͷྲྀΕ view ͷλονΠϕϯτͷํΛղੳ͢Δɻ ҙਤͨ͠ɾํͳΒδΣενϟʔೝࣝΛଓ͚ɺͦ͏Ͱͳ͚Εऴ ྃ͢Δɻ δΣενϟʔ͕ೝࣝͰ͖ͨΒ delegate ʹ recognizedΠϕϯτΛૹ৴͢
Δɻ
Tracking of UITouch
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 }
velocity vector with UITouch location previousLocation
velocity vector with UITouch location previousLocation (x1 , y1 )
velocity vector with UITouch location previousLocation (x1 , y1 )
(x2 , y2 )
velocity vector with UITouch location previousLocation (x1 , y1 )
(x2 , y2 ) ( x2 − x1 t2 − t1 , y2 − y1 t2 − t1 ) 2ؒͷϕΫτϧ
velocity vector with UITouch location previousLocation (x1 , y1 )
(x2 , y2 ) ( x2 − x1 t2 − t1 , y2 − y1 t2 − t1 ) 2ؒͷϕΫτϧ (x2 − x1 , y2 − y1 ) 2ؒͷ୯Ґ࣌ؒ͋ͨΓͷϕΫτϧ
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 }
gradient of UITouch location previousLocation (x1 , y1 ) (x2
, y2 ) θ
gradient of UITouch location previousLocation (x1 , y1 ) (x2
, y2 ) θ vx vy
gradient of UITouch location previousLocation (x1 , y1 ) (x2
, y2 ) θ vx vy tan θ = vy vx
gradient of UITouch location previousLocation (x1 , y1 ) (x2
, y2 ) θ vx vy tan θ = vy vx θ = tan−1 vy vx
struct Velocity { var vx: CGFloat var vy: CGFloat var
gradient: CGFloat{ // ࣮ࡍʹɺvyɺvx͕0ͷ࣌ͷॲཧ͓Αͼɺgradient͕ 0-2πʹͳΔΑ͏ͳ // ਖ਼نԽΛߦ͍·͢ var calcGradient = atan(vy / vx) return calcGradient }
Radian ހ๏ 360° = 2 π radian
π 2 0 π 3π 2
π 2 0 π 3π 2 π 4
π 2 0 π 3π 2 3π 4
Tracking of UITouch ͜ΕͰɺUITouch͔ΒɺϕΫτϧͱ͖ (gradient) ͕Θ͔ΔΑ͏ʹͳ Γ·ͨ͠ɻ
How to handle gesture state Custom Gesture RecognizerͰɺԼهͷ2छྨͷঢ়ଶΛཧ͠·͢ɻ δΣενϟʔͷશମঢ়ଶ (UIGestureRecognizer.State)
ܧଓ or ࣦഊ or ޭ ετϩʔΫͷஅ શମͷͲͷ෦Λೝࣝதͳͷ͔
UIGestureRecognizer.State open class UIGestureRecognizer : NSObject { // the current
state of the gesture recognizer open var state: UIGestureRecognizer.State { get } }
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() { } }
Handling touch event t
Handling touch event touchesBegan t touchesMoved touchesEnd
touchesBegan t touchesMoved touchesEnd
Possible Recognized Failed Possible gestureॲཧܧଓ gestureॲཧऴྃ gestureॲཧऴྃ
P F P P P P R F F touchesBegan
touchesMoved touchesEnd
ετϩʔΫͷஅ ετϩʔΫͷ͖͔Βɺೝ͍ࣝͨ͠δΣενϟʔͲͷετϩʔΫʹͳͷ ͔Λஅ͢Δɻ ෳͷετϩʔΫ͔Βߏ͞ΕΔδΣενϟʔ͋Δ
ೋͭͷ࿈ଓͨ͠ετϩʔΫ͔Βߏ͞ΕΔ߹
δΣενϟʔ։࢝ ӈԼͷετϩʔΫ ӈ্ͷετϩʔΫ δΣενϟʔྃ
P F P P P P R F F touchesBegan
touchesMoved touchesEnd
ೋͭͷ࿈ଓ͠ͳ͍ετϩʔΫ͔Β ߏ͞ΕΔ߹
ӈԼͷετϩʔΫ͔Β࢝·Δύλʔϯ ࠨԼͷετϩʔΫ͔Β࢝·Δύλʔϯ
P F P P P F touchesBegan touchesMoved touchesEnd touchesEnd
touchesMoved touchesMoved touchesBegan R F P P
·ͱΊ Custom Gesture Recognizerͷ࣮ҙ֎ͱ؆୯Ͱ͢ɻ ͨͩ͠ɺετϩʔΫʹΑͬͯɺϢʔβʔͷೖྗΛҙਤ௨Γʹஅ͢Δ ͷ͕͍͠߹͋ΔͨΊɺঢ়گʹԠͨ͡࠷దԽ͕ඞཁɻ αϯϓϧ͕ͪ͜Βʹ͋ΔͷͰɺΑ͔ͬͨΒݟͯΈ͍ͯͩ͘͞ɻ https://github.com/TachibanaKaoru/CustomGestureRecognizer