React Pinch Gesture Handler Of react native not working properly

Question

I am working on react native the below is one of the code snippet which I currently working on. My issue is with Pinch Gesture Handler.

  <TapGestureHandler  
  numberOfTaps={2}
  maxDelayMs={250}
  ref={doubleTapRef}
  onActivated={handleDoubleTap}
  minPointers={5}
  >
      <Animated.View>
      <PinchGestureHandler
          onGestureEvent={onPinchEvent}
          onHandlerStateChange={onPinchStateChange} 
          
          >
          <Animated.Image
            source={{ uri: imageUrl }}
            style={{
                width: windowWidth,
                height: calculatedHeight,
                borderColor: AppColors.palette.black,
             
              transform: [{ scale: scale }]
            }}
            resizeMode='contain'
          />
        </PinchGestureHandler>
            <Animated.View style={[{
                
                opacity,
                borderRadius:100/2,
                position: 'absolute',
                alignItems: 'center',
                justifyContent: 'center',
                left: 0,
                right: 0,
                top: 0,
                bottom: 0,
              }]}>
               
      <Image style={{resizeMode:"center"}} source= 
     {require('../../res/assets/images/heart.png')}  fadeDuration={0}/>
      
     </Animated.View>
     </Animated.View>
 </TapGestureHandler>
            

I have added TapGestureHandler and PinchGestureHandler, my problem is PinchGestureHandler for image zooming is not working properly some times it work sometimes not can any one suggest how to solve this issue.