diff --git a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx index 49105f8955..a2a162abb5 100644 --- a/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx +++ b/src/view/com/lightbox/ImageViewing/components/ImageItem/ImageItem.ios.tsx @@ -88,10 +88,6 @@ const ImageItem = ({ : 1, ) - const needsReset = useSharedValue(false) - const lastValue = useSharedValue(null) - const weirdState = useSharedValue(0) - function computeInsets(zoom) { 'worklet' const screenSize = measureSafeArea() @@ -107,90 +103,36 @@ const ImageItem = ({ const finalZoomScale = screenSize.height / renderedHeight const currentZoomScale = zoom - console.log(currentZoomScale, finalZoomScale) - top = interpolate( currentZoomScale, [1, finalZoomScale], - [horizontalBarHeight, 0], - ) / currentZoomScale - bottom = top + [0, horizontalBarHeight], + ) * zoom + + bottom = renderedHeight - top } } return {top, bottom, left: 0, right: 0} } - const insets = useSharedValue(computeInsets(1)) - - const animatedProps = useAnimatedProps(() => { - console.log('setting', insets.value) - return { - contentInsets: insets.value, - } - }) - const scrollHandler = useAnimatedScrollHandler({ onScroll(e) { - console.log('scroll') - - if ( - lastValue.value && - e.contentOffset.x === lastValue.value.contentOffset.x && - e.contentOffset.y === lastValue.value.contentOffset.y && - e.zoomScale === lastValue.value.zoomScale && - weirdState.value === 1 - ) { - weirdState.value = 2 - } else { - weirdState.value = 0 - } - lastValue.value = e - // console.log('inside condition, set did nothing = true') - // // setNativeProps(scrollViewRef, { - // // scrollEnabled: false, - // // }) - // // setNativeProps(scrollViewRef, { - // // scrollEnabled: true, - // // }) - // } else { - // console.log('set did nothing = false') - // didNothing.value = false - // } - const nextIsScaled = e.zoomScale > 1 if (scaled !== nextIsScaled) { runOnJS(handleZoom)(nextIsScaled) } - }, - onBeginDrag() { - console.log('beg drag') - if (needsReset.value) { - console.log('reset!!') - needsReset.value = false - setNativeProps(scrollViewRef, { - scrollEnabled: false, - }) - setNativeProps(scrollViewRef, { - scrollEnabled: true, - }) - } - }, - onEndDrag(e) { - console.log('end drag') - insets.value = computeInsets(e.zoomScale) - }, - onMomentumBegin() { - console.log('beg mom') - weirdState.value = 1 - }, - onMomentumEnd() { - console.log('mom end') - if (weirdState.value === 2) { - weirdState.value = 3 - } + const insets = computeInsets(e.zoomScale) + console.log(e.contentOffset.y, insets.top, insets.bottom) + + setNativeProps(scrollViewRef, {}) + // const insets = computeInsets(e.zoomScale) + // setNativeProps(scrollViewRef, { + // contentInset: insets, + // }) }, + onEndDrag(e) {}, }) function handleZoom(nextIsScaled: boolean) { @@ -212,33 +154,6 @@ const ImageItem = ({ }) } - const manual = Gesture.Manual() - .onTouchesDown(() => { - console.log(' -- touch down') - if (weirdState.value === 3) { - weirdState.value = 0 - console.log('-- set needs reset') - needsReset.value = true - // setTimeout(() => { - // setNativeProps(scrollViewRef, { - // scrollEnabled: true, - // }) - // }, 100) - } - }) - .onTouchesUp(() => { - console.log(' -- touch up') - // setNativeProps(scrollViewRef, { - // scrollEnabled: true, - // }) - }) - .onTouchesCancelled(() => { - // setNativeProps(scrollViewRef, { - // scrollEnabled: true, - // }) - console.log(' -- touch can') - }) - const singleTap = Gesture.Tap().onEnd(() => { 'worklet' runOnJS(onTap)() @@ -268,17 +183,19 @@ const ImageItem = ({ runOnJS(zoomTo)(nextZoomRect) }) - const composedGesture = Gesture.Simultaneous( - manual, - Gesture.Exclusive(dismissSwipePan, doubleTap, singleTap), + const composedGesture = Gesture.Exclusive( + dismissSwipePan, + doubleTap, + singleTap, ) const containerStyle = useAnimatedStyle(() => { const {scaleAndMoveTransform, isHidden} = transforms.value return { - flex: 1, + // flex: 1, transform: scaleAndMoveTransform, opacity: isHidden ? 0 : 1, + backgroundColor: 'red', } }) @@ -336,9 +253,9 @@ const ImageItem = ({ maximumZoomScale={maxZoomScale} onScroll={scrollHandler} style={containerStyle} - bounces={scaled} - bouncesZoom={true} - animatedProps={animatedProps}> + contentContainerStyle={{ + flex: 1, + }}> {showLoader && ( )}