Activate ios buttons on pointer up

Author: j-piasecki

packages/react-native-gesture-handler/apple/Handlers/RNNativeViewHandler.mm

@@ -275,11 +275,12 @@ - (void)handleTouchUpOutside:(UIView *)sender forEvent:(UIEvent *)event
 
 - (void)handleTouchUpInside:(UIView *)sender forEvent:(UIEvent *)event
 {
-  [self sendEventsInState:RNGestureHandlerStateEnd
-           forViewWithTag:sender.reactTag
-            withExtraData:[RNGestureHandlerEventExtraData forPointerInside:YES
-                                                       withNumberOfTouches:event.allTouches.count
-                                                           withPointerType:_pointerType]];
+  RNGestureHandlerEventExtraData *extraData = [RNGestureHandlerEventExtraData forPointerInside:YES
+                                                                           withNumberOfTouches:event.allTouches.count
+                                                                               withPointerType:_pointerType];
+
+  [self sendActiveStateEventIfChangedForView:sender extraData:extraData];
+  [self sendEventsInState:RNGestureHandlerStateEnd forViewWithTag:sender.reactTag withExtraData:extraData];
 }
 
 - (void)handleDragExit:(UIView *)sender forEvent:(UIEvent *)event

packages/react-native-gesture-handler/src/components/GestureButtons.tsx

@@ -50,7 +50,8 @@ class InnerBaseButton extends React.Component<BaseButtonWithRefProps> {
     nativeEvent,
   }: HandlerStateChangeEvent<NativeViewGestureHandlerPayload>) => {
     const { state, oldState, pointerInside } = nativeEvent;
-    const active = pointerInside && state === State.ACTIVE;
+    const active =
+      pointerInside && (state === State.BEGAN || state === State.ACTIVE);
 
     if (active !== this.lastActive && this.props.onActiveStateChange) {
       this.props.onActiveStateChange(active);

packages/react-native-gesture-handler/src/components/touchables/GenericTouchable.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Component } from 'react';
-import { Animated, Platform } from 'react-native';
+import { Animated } from 'react-native';
 
 import type {
   GestureEvent,
@@ -174,10 +174,7 @@ export default class GenericTouchable extends Component<
       // Need to handle case with external cancellation (e.g. by ScrollView)
       this.moveToState(TOUCHABLE_STATE.UNDETERMINED);
     } else if (
-      // This platform check is an implication of slightly different behavior of handlers on different platform.
-      // And Android "Active" state is achieving on first move of a finger, not on press in.
-      // On iOS event on "Began" is not delivered.
-      state === (Platform.OS !== 'android' ? State.ACTIVE : State.BEGAN) &&
+      state === State.BEGAN &&
       this.STATE === TOUCHABLE_STATE.UNDETERMINED
     ) {
       // Moving inside requires

packages/react-native-gesture-handler/src/v3/components/GestureButtons.tsx

@@ -69,16 +69,16 @@ export const BaseButton = (props: BaseButtonProps) => {
   };
 
   const onDeactivate = (e: EndCallbackEventType) => {
+    props.onDeactivate?.(e);
+  };
+
+  const onFinalize = (e: EndCallbackEventType) => {
     onActiveStateChange?.(false);
 
     if (!e.canceled && !longPressDetected.current) {
       onPress?.(e.pointerInside);
     }
 
-    props.onDeactivate?.(e);
-  };
-
-  const onFinalize = (e: EndCallbackEventType) => {
     if (longPressTimeout.current !== undefined) {
       clearTimeout(longPressTimeout.current);
       longPressTimeout.current = undefined;