status-im/rn-emoji-keyboard
2
0
Fork 0
mirror of https://github.com/status-im/rn-emoji-keyboard.git synced 2025-01-27 00:29:04 +00:00
Code Issues Projects Releases Wiki Activity

refactor: close animation

Browse Source
This commit is contained in:
Jakub Grzywacz 2021-07-10 15:55:01 +02:00
parent af342a86f9
commit 095a1fda25
No known key found for this signature in database
GPG Key ID: 5BBB685871FF63C4
1 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/ModalWithBackdrop.tsx
View File

@ -23,24 +23,31 @@ export const ModalWithBackdrop = ({
children,
}: ModalWithBackdropProps) => {
const { height: screenHeight } = useWindowDimensions();
const translateY = React.useRef(new Animated.Value(0)).current;
const translateY = React.useRef(new Animated.Value(screenHeight)).current;
const ctx = React.useContext(KeyboardContext);
React.useEffect(() => {
Animated.timing(translateY, {
Animated.spring(translateY, {
toValue: isOpen ? 0 : screenHeight,
useNativeDriver: true,
duration: 500,
}).start();
}, [isOpen, screenHeight, translateY]);
const handleClose = () => {
Animated.spring(translateY, {
toValue: screenHeight,
useNativeDriver: true,
}).start();
setTimeout(() => backdropPress(), 200);
};
return (
<Modal visible={isOpen} animationType="fade" transparent={true}>
<GestureHandlerRootView style={styles.modalContainer}>
<TouchableOpacity
style={styles.modalContainer}
activeOpacity={1}
onPress={backdropPress}
onPress={handleClose}
>
<View
style={[