pinch example no longer resizing in v2

Author: relextm19

packages/docs-gesture-handler/versioned_docs/version-2.x/examples/PinchGestureBasic.js

@@ -97,33 +97,35 @@ export default function App() {
   return (
     <GestureHandlerRootView>
       <View ref={containerRef} style={styles.container}>
-        <GestureDetector gesture={pan}>
+        <View style={styles.innerContainer}>
+          <GestureDetector gesture={pan}>
+            <Animated.View
+              ref={boxRef}
+              style={[styles.box, boxAnimatedStyles]}></Animated.View>
+          </GestureDetector>
           <Animated.View
-            ref={boxRef}
-            style={[styles.box, boxAnimatedStyles]}></Animated.View>
-        </GestureDetector>
-        <Animated.View
-          style={[
-            styles.dot,
-            {
-              transform: [
-                { translateX: pointerPositionX },
-                { translateY: pointerPositionY },
-              ],
-              opacity: touchOpacity,
-            },
-          ]}></Animated.View>
-        <Animated.View
-          style={[
-            styles.dot,
-            {
-              transform: [
-                { translateX: negativePointerPositionX },
-                { translateY: negativePointerPositionY },
-              ],
-              opacity: touchOpacity,
-            },
-          ]}></Animated.View>
+            style={[
+              styles.dot,
+              {
+                transform: [
+                  { translateX: pointerPositionX },
+                  { translateY: pointerPositionY },
+                ],
+                opacity: touchOpacity,
+              },
+            ]}></Animated.View>
+          <Animated.View
+            style={[
+              styles.dot,
+              {
+                transform: [
+                  { translateX: negativePointerPositionX },
+                  { translateY: negativePointerPositionY },
+                ],
+                opacity: touchOpacity,
+              },
+            ]}></Animated.View>
+        </View>
       </View>
     </GestureHandlerRootView>
   );
@@ -141,6 +143,11 @@ const styles = StyleSheet.create({
     backgroundColor: '#b58df1',
     cursor: 'pointer',
   },
+  innerContainer: {
+    height: 100,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
   dot: {
     width: 24,
     height: 24,