When closed it is instant. Is there a way to fix this?

[GitPut]

`// / eslint-disable react-hooks/exhaustive-deps / import React, {useRef, useState} from 'react'; import { StyleSheet, View, Text, Dimensions, SafeAreaView, Animated, TouchableOpacity, Modal, } from 'react-native'; import ImageViewer from 'react-native-image-zoom-viewer';

const windowWidth = Dimensions.get('window').width; const windowHeight = Dimensions.get('window').height;

export default function ImageView({inputImage, style}) { const imageCenter = useRef(new Animated.ValueXY()).current; const currentImageY = useRef(0); const currentImageX = useRef(0); const [on, setOn] = useState('none'); const [visible, setVisible] = useState(false);

const image = [ { url: '', props: { // Or you can set source directory. source: inputImage, }, }, ];

const toCenter = () => { setVisible(true); setOn('auto'); const posY = windowHeight / 2 - currentImageY.current - 100; const posX = windowWidth / 2 - currentImageX.current - 100; // Animated.timing(imageCenter, { // toValue: {x: posX, y: posY}, // duration: 500, // useNativeDriver: false, // }).start(); }; const toOrigin = () => { setOn('none'); // Animated.timing(imageCenter, { // toValue: {x: 0, y: 0}, // duration: 500, // useNativeDriver: false, // }).start(); };

return (

{ setVisible(false); toOrigin(); }} imageUrls={image} />

); } `

When I open it the image it flashes and opens a bit slower which is good. But when I use the slide down to close it instantly closes and does not look good. So could someone please help me so I can make it close slower