mirrors/BlueWallet
1
0
Fork 0
mirror of https://github.com/BlueWallet/BlueWallet.git synced 2024-11-20 10:12:01 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #6402 from BlueWallet/sldideup

Browse Source 
ADD: Slide up animation for FloatButton
This commit is contained in:
GLaDOS 2024-04-13 17:01:17 +00:00 committed by GitHub
commit a615135ac8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
components/FloatButtons.tsx
View File

@ -1,5 +1,5 @@
import React, { useState, useRef, forwardRef, ReactNode } from 'react';
import { View, Text, TouchableOpacity, StyleSheet, Dimensions, PixelRatio } from 'react-native';
import React, { useState, useRef, forwardRef, ReactNode, useEffect } from 'react';
import { View, Text, TouchableOpacity, StyleSheet, Dimensions, PixelRatio, Animated, useWindowDimensions } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { useTheme } from './themes';
@ -39,6 +39,18 @@ export const FContainer = forwardRef<View, FContainerProps>((props, ref) => {
const [newWidth, setNewWidth] = useState<number | undefined>(undefined);
const layoutCalculated = useRef(false);
const bottomInsets = { bottom: insets.bottom ? insets.bottom + 10 : 30 };
const { height } = useWindowDimensions();
const slideAnimation = useRef(new Animated.Value(height)).current;
useEffect(() => {
slideAnimation.setValue(height);
Animated.spring(slideAnimation, {
toValue: 0,
useNativeDriver: true,
speed: 100,
bounciness: 3,
}).start();
}, [height, slideAnimation]);
const onLayout = (event: { nativeEvent: { layout: { width: number } } }) => {
if (layoutCalculated.current) return;
@ -53,7 +65,7 @@ export const FContainer = forwardRef<View, FContainerProps>((props, ref) => {
};
return (
<View
<Animated.View
ref={ref}
onLayout={onLayout}
style={[
@ -61,6 +73,7 @@ export const FContainer = forwardRef<View, FContainerProps>((props, ref) => {
props.inline ? cStyles.rootInline : cStyles.rootAbsolute,
bottomInsets,
newWidth ? cStyles.rootPost : cStyles.rootPre,
{ transform: [{ translateY: slideAnimation }] },
]}
>
{newWidth
@ -82,7 +95,7 @@ export const FContainer = forwardRef<View, FContainerProps>((props, ref) => {
});
})
: props.children}
</View>
</Animated.View>
);
});