diff --git a/MacOSExample/src/App.tsx b/MacOSExample/src/App.tsx index d0fd3f7697..e928ef4893 100644 --- a/MacOSExample/src/App.tsx +++ b/MacOSExample/src/App.tsx @@ -1,12 +1,5 @@ import React from 'react'; -import { - Text, - View, - StyleSheet, - SectionList, - Platform, - Pressable, -} from 'react-native'; +import { Text, View, StyleSheet, SectionList, Platform } from 'react-native'; import { createStackNavigator, StackScreenProps, @@ -20,6 +13,7 @@ import { import Draggable from './basic/draggable'; import PinchableBox from './recipes/scaleAndRotate'; import Tap from './basic/tap'; +import ManualExample from './basic/manual'; interface Example { name: string; @@ -38,6 +32,7 @@ const EXAMPLES: ExamplesSection[] = [ { name: 'Draggable', component: Draggable }, { name: 'Pinch & rotate', component: PinchableBox }, { name: 'Tap', component: Tap }, + { name: 'Manual', component: ManualExample }, ], }, ]; diff --git a/MacOSExample/src/basic/manual/index.tsx b/MacOSExample/src/basic/manual/index.tsx new file mode 100644 index 0000000000..e1ec007b79 --- /dev/null +++ b/MacOSExample/src/basic/manual/index.tsx @@ -0,0 +1,76 @@ +import { StyleSheet, View } from 'react-native'; +import { Gesture, GestureDetector } from 'react-native-gesture-handler'; +import Animated, { + interpolateColor, + useAnimatedStyle, + useSharedValue, + withTiming, +} from 'react-native-reanimated'; + +export default function ManualExample() { + const isPressed = useSharedValue(false); + const colorProgress = useSharedValue(0); + + const animatedStyles = useAnimatedStyle(() => { + const backgroundColor = interpolateColor( + colorProgress.value, + [0, 1], + ['#0a2688', '#6fcef5'] + ); + + return { + transform: [ + { scale: withTiming(isPressed.value ? 1.2 : 1, { duration: 100 }) }, + ], + backgroundColor, + }; + }); + + const g = Gesture.Manual() + .onBegin(() => console.log('onBegin')) + .onStart(() => { + console.log('onStart'); + isPressed.value = true; + colorProgress.value = withTiming(1, { + duration: 100, + }); + }) + .onFinalize(() => { + console.log('onFinalize'); + isPressed.value = false; + colorProgress.value = withTiming(0, { + duration: 100, + }); + }) + .onTouchesDown((e, stateManager) => { + console.log('onTouchesDown', e); + stateManager.activate(); + }) + .onTouchesMove((e) => console.log('onTouchesMove', e.state)) + .onTouchesUp((e, stateManager) => { + stateManager.end(); + console.log('onTouchesUp', e); + }); + + return ( + + + + + + ); +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'space-around', + alignItems: 'center', + }, + + pressBox: { + width: 100, + height: 100, + borderRadius: 20, + }, +}); diff --git a/apple/Handlers/RNManualHandler.m b/apple/Handlers/RNManualHandler.m index 66fbe42943..6e4fb5eed1 100644 --- a/apple/Handlers/RNManualHandler.m +++ b/apple/Handlers/RNManualHandler.m @@ -1,9 +1,10 @@ #import "RNManualHandler.h" #if !TARGET_OS_OSX - @interface RNManualRecognizer : UIGestureRecognizer - +#else +@interface RNManualRecognizer : NSGestureRecognizer +#endif - (id)initWithGestureHandler:(RNGestureHandler *)gestureHandler; @end @@ -19,25 +20,27 @@ - (id)initWithGestureHandler:(RNGestureHandler *)gestureHandler _gestureHandler = gestureHandler; _shouldSendBeginEvent = YES; } + return self; } -- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event +- (void)interactionsBegan:(NSSet *)touches withEvent:(UIEvent *)event { - [_gestureHandler setCurrentPointerType:event]; - [super touchesBegan:touches withEvent:event]; [_gestureHandler.pointerTracker touchesBegan:touches withEvent:event]; if (_shouldSendBeginEvent) { [_gestureHandler handleGesture:self]; +#if TARGET_OS_OSX + self.state = NSGestureRecognizerStateBegan; +#endif _shouldSendBeginEvent = NO; } } -- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event +- (void)interactionsMoved:(NSSet *)touches withEvent:(UIEvent *)event { - [super touchesMoved:touches withEvent:event]; [_gestureHandler.pointerTracker touchesMoved:touches withEvent:event]; + [_gestureHandler handleGesture:self]; if ([self shouldFail]) { self.state = (self.state == UIGestureRecognizerStatePossible) ? UIGestureRecognizerStateFailed @@ -47,10 +50,31 @@ - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event } } +- (void)interactionsEnded:(NSSet *)touches withEvent:(UIEvent *)event +{ + [_gestureHandler.pointerTracker touchesEnded:touches withEvent:event]; + [_gestureHandler handleGesture:self]; +} + +#if !TARGET_OS_OSX +- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event +{ + [_gestureHandler setCurrentPointerType:event]; + [super touchesBegan:touches withEvent:event]; + + [self interactionsBegan:touches withEvent:event]; +} + +- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event +{ + [super touchesMoved:touches withEvent:event]; + [self interactionsMoved:touches withEvent:event]; +} + - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event { [super touchesEnded:touches withEvent:event]; - [_gestureHandler.pointerTracker touchesEnded:touches withEvent:event]; + [self interactionsEnded:touches withEvent:event]; } - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event @@ -60,6 +84,26 @@ - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)ev [self reset]; } +#else + +- (void)mouseDown:(NSEvent *)event +{ + [_gestureHandler setCurrentPointerTypeToMouse]; + [self interactionsBegan:[NSSet setWithObject:event] withEvent:event]; +} + +- (void)mouseDragged:(NSEvent *)event +{ + [self interactionsMoved:[NSSet setWithObject:event] withEvent:event]; +} + +- (void)mouseUp:(NSEvent *)event +{ + [self interactionsEnded:[NSSet setWithObject:event] withEvent:event]; +} + +#endif + - (void)reset { [_gestureHandler.pointerTracker reset]; @@ -71,11 +115,7 @@ - (void)reset - (BOOL)shouldFail { - if (_gestureHandler.shouldCancelWhenOutside && ![_gestureHandler containsPointInView]) { - return YES; - } else { - return NO; - } + return _gestureHandler.shouldCancelWhenOutside && ![_gestureHandler containsPointInView]; } @end @@ -87,24 +127,8 @@ - (instancetype)initWithTag:(NSNumber *)tag if ((self = [super initWithTag:tag])) { _recognizer = [[RNManualRecognizer alloc] initWithGestureHandler:self]; } - return self; -} - -@end - -#else - -@implementation RNManualGestureHandler -- (instancetype)initWithTag:(NSNumber *)tag -{ - RCTLogWarn(@"ManualGestureHandler is not supported on macOS"); - if ((self = [super initWithTag:tag])) { - _recognizer = [NSGestureRecognizer alloc]; - } return self; } @end - -#endif