zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

who the hell knows

zio/stable
Hailey 2023-12-31 16:05:07 -08:00
parent 4e9e92f976
commit 87245480d4
1 changed files with 45 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
src/Splash.tsx
View File

@ -2,6 +2,7 @@ import React, {useCallback, useEffect} from 'react'
import {View, StyleSheet, Image as RNImage} from 'react-native' import {View, StyleSheet, Image as RNImage} from 'react-native'
import * as SplashScreen from 'expo-splash-screen' import * as SplashScreen from 'expo-splash-screen'
import {Image} from 'expo-image' import {Image} from 'expo-image'
import {platformApiLevel} from 'expo-device'
import Animated, { import Animated, {
interpolate, interpolate,
runOnJS, runOnJS,
@ -136,34 +137,51 @@ export function Splash(props: React.PropsWithChildren<Props>) {
/> />
)} )}
<MaskedView {platformApiLevel && platformApiLevel <= 27 ? (
style={[StyleSheet.absoluteFillObject]} <>
maskElement={ {!isAnimationComplete && (
<Animated.View <View
style={[ style={[
StyleSheet.absoluteFillObject, StyleSheet.absoluteFillObject,
{ {backgroundColor: 'white'},
// Transparent background because mask is based off alpha channel. ]}
backgroundColor: 'transparent', />
flex: 1, )}
justifyContent: 'center', <Animated.View style={[{flex: 1}, appAnimation]}>
alignItems: 'center', {props.children}
transform: [{translateY: -(insets.top / 2)}, {scale: 0.1}], // scale from 1000px to 100px
},
]}>
<AnimatedLogo style={[logoAnimations]} />
</Animated.View> </Animated.View>
}> </>
{!isAnimationComplete && ( ) : (
<View <MaskedView
style={[StyleSheet.absoluteFillObject, {backgroundColor: 'white'}]} style={[StyleSheet.absoluteFillObject]}
/> maskElement={
)} <Animated.View
style={[
<Animated.View style={[{flex: 1}, appAnimation]}> {
{props.children} // Transparent background because mask is based off alpha channel.
</Animated.View> backgroundColor: 'transparent',
</MaskedView> flex: 1,
justifyContent: 'center',
alignItems: 'center',
transform: [{translateY: -(insets.top / 2)}, {scale: 0.1}], // scale from 1000px to 100px
},
]}>
<AnimatedLogo style={[logoAnimations]} />
</Animated.View>
}>
{!isAnimationComplete && (
<View
style={[
StyleSheet.absoluteFillObject,
{backgroundColor: 'white'},
]}
/>
)}
<Animated.View style={[{flex: 1}, appAnimation]}>
{props.children}
</Animated.View>
</MaskedView>
)}
</View> </View>
) )
} }