mirror of https://github.com/tooot-app/app
Prevent going back when zoomed
This commit is contained in:
parent
9863e13e43
commit
5c255ffa6d
|
@ -0,0 +1,41 @@
|
||||||
|
diff --git a/node_modules/react-native-reanimated-zoom/lib/typescript/zoom.d.ts b/node_modules/react-native-reanimated-zoom/lib/typescript/zoom.d.ts
|
||||||
|
index 38fb6f1..e93c288 100644
|
||||||
|
--- a/node_modules/react-native-reanimated-zoom/lib/typescript/zoom.d.ts
|
||||||
|
+++ b/node_modules/react-native-reanimated-zoom/lib/typescript/zoom.d.ts
|
||||||
|
@@ -6,6 +6,7 @@ declare type Props = {
|
||||||
|
minimumZoomScale?: number;
|
||||||
|
maximumZoomScale?: number;
|
||||||
|
simultaneousGesture?: GestureType;
|
||||||
|
+ isZoomed?: SharedValue<boolean>;
|
||||||
|
} & ViewProps;
|
||||||
|
export declare function Zoom(props: Props): JSX.Element;
|
||||||
|
export {};
|
||||||
|
diff --git a/node_modules/react-native-reanimated-zoom/src/zoom.tsx b/node_modules/react-native-reanimated-zoom/src/zoom.tsx
|
||||||
|
index e07b415..d57a1eb 100644
|
||||||
|
--- a/node_modules/react-native-reanimated-zoom/src/zoom.tsx
|
||||||
|
+++ b/node_modules/react-native-reanimated-zoom/src/zoom.tsx
|
||||||
|
@@ -7,6 +7,7 @@ import Animated, {
|
||||||
|
withTiming,
|
||||||
|
cancelAnimation,
|
||||||
|
runOnJS,
|
||||||
|
+ SharedValue,
|
||||||
|
} from 'react-native-reanimated';
|
||||||
|
import {
|
||||||
|
Gesture,
|
||||||
|
@@ -20,6 +21,7 @@ type Props = {
|
||||||
|
minimumZoomScale?: number;
|
||||||
|
maximumZoomScale?: number;
|
||||||
|
simultaneousGesture?: GestureType;
|
||||||
|
+ isZoomed?: SharedValue<boolean>;
|
||||||
|
} & ViewProps;
|
||||||
|
|
||||||
|
export function Zoom(props: Props) {
|
||||||
|
@@ -39,7 +41,7 @@ export function Zoom(props: Props) {
|
||||||
|
const originY = useSharedValue(0);
|
||||||
|
const scale = useSharedValue(1);
|
||||||
|
const isPinching = useSharedValue(false);
|
||||||
|
- const isZoomed = useSharedValue(false);
|
||||||
|
+ const isZoomed = props.isZoomed || useSharedValue(false);
|
||||||
|
const viewHeight = useSharedValue(0);
|
||||||
|
const viewWidth = useSharedValue(0);
|
||||||
|
|
|
@ -4,11 +4,12 @@ import { HeaderCenter, HeaderLeft, HeaderRight } from '@components/Header'
|
||||||
import { useActionSheet } from '@expo/react-native-action-sheet'
|
import { useActionSheet } from '@expo/react-native-action-sheet'
|
||||||
import { RootStackScreenProps } from '@utils/navigation/navigators'
|
import { RootStackScreenProps } from '@utils/navigation/navigators'
|
||||||
import { useTheme } from '@utils/styles/ThemeManager'
|
import { useTheme } from '@utils/styles/ThemeManager'
|
||||||
import React, { useCallback, useRef, useState } from 'react'
|
import React, { useCallback, useState } from 'react'
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import {
|
import {
|
||||||
Dimensions,
|
Dimensions,
|
||||||
FlatList,
|
FlatList,
|
||||||
|
Image,
|
||||||
PixelRatio,
|
PixelRatio,
|
||||||
Platform,
|
Platform,
|
||||||
Share,
|
Share,
|
||||||
|
@ -16,10 +17,9 @@ import {
|
||||||
View,
|
View,
|
||||||
ViewToken
|
ViewToken
|
||||||
} from 'react-native'
|
} from 'react-native'
|
||||||
import FlashMessage from 'react-native-flash-message'
|
|
||||||
import { Directions, Gesture, LongPressGestureHandler } from 'react-native-gesture-handler'
|
import { Directions, Gesture, LongPressGestureHandler } from 'react-native-gesture-handler'
|
||||||
import { LiveTextImageView } from 'react-native-live-text-image-view'
|
import { LiveTextImageView } from 'react-native-live-text-image-view'
|
||||||
import { runOnJS } from 'react-native-reanimated'
|
import { runOnJS, useSharedValue } from 'react-native-reanimated'
|
||||||
import { Zoom, createZoomListComponent } from 'react-native-reanimated-zoom'
|
import { Zoom, createZoomListComponent } from 'react-native-reanimated-zoom'
|
||||||
import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context'
|
import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context'
|
||||||
import saveImage from './ImageViewer/save'
|
import saveImage from './ImageViewer/save'
|
||||||
|
@ -48,8 +48,6 @@ const ScreenImagesViewer = ({
|
||||||
const initialIndex = imageUrls.findIndex(image => image.id === id)
|
const initialIndex = imageUrls.findIndex(image => image.id === id)
|
||||||
const [currentIndex, setCurrentIndex] = useState(initialIndex)
|
const [currentIndex, setCurrentIndex] = useState(initialIndex)
|
||||||
|
|
||||||
const messageRef = useRef<FlashMessage>(null)
|
|
||||||
|
|
||||||
const { showActionSheetWithOptions } = useActionSheet()
|
const { showActionSheetWithOptions } = useActionSheet()
|
||||||
const onPress = useCallback(() => {
|
const onPress = useCallback(() => {
|
||||||
analytics('imageviewer_more_press')
|
analytics('imageviewer_more_press')
|
||||||
|
@ -85,6 +83,8 @@ const ScreenImagesViewer = ({
|
||||||
)
|
)
|
||||||
}, [currentIndex])
|
}, [currentIndex])
|
||||||
|
|
||||||
|
const isZoomed = useSharedValue(false)
|
||||||
|
|
||||||
const renderItem = React.useCallback(
|
const renderItem = React.useCallback(
|
||||||
({
|
({
|
||||||
item
|
item
|
||||||
|
@ -102,10 +102,15 @@ const ScreenImagesViewer = ({
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Zoom
|
<Zoom
|
||||||
|
isZoomed={isZoomed}
|
||||||
maximumZoomScale={max > 8 ? 8 : max}
|
maximumZoomScale={max > 8 ? 8 : max}
|
||||||
simultaneousGesture={Gesture.Fling()
|
simultaneousGesture={Gesture.Fling()
|
||||||
.direction(Directions.DOWN)
|
.direction(Directions.DOWN)
|
||||||
.onStart(() => runOnJS(navigation.goBack)())}
|
.onStart(() => {
|
||||||
|
if (isZoomed.value === false) {
|
||||||
|
runOnJS(navigation.goBack)()
|
||||||
|
}
|
||||||
|
})}
|
||||||
children={
|
children={
|
||||||
<View
|
<View
|
||||||
style={{
|
style={{
|
||||||
|
@ -137,7 +142,7 @@ const ScreenImagesViewer = ({
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
[]
|
[isZoomed.value]
|
||||||
)
|
)
|
||||||
|
|
||||||
const onViewableItemsChanged = useCallback(
|
const onViewableItemsChanged = useCallback(
|
||||||
|
|
Loading…
Reference in New Issue