Merge branch 'haileyok-fix/android-splash-hackfix' into main

src/Splash.tsx

@@ -2,6 +2,7 @@ import React, {useCallback, useEffect} from 'react'
 import {View, StyleSheet, Image as RNImage} from 'react-native'
 import * as SplashScreen from 'expo-splash-screen'
 import {Image} from 'expo-image'
+import {platformApiLevel} from 'expo-device'
 import Animated, {
   interpolate,
   runOnJS,
@@ -136,12 +137,27 @@ export function Splash(props: React.PropsWithChildren<Props>) {
         />
       )}
 
+      {platformApiLevel && platformApiLevel <= 25 ? (
+        // Use a simple fade on older versions of android (work around a bug)
+        <>
+          {!isAnimationComplete && (
+            <View
+              style={[
+                StyleSheet.absoluteFillObject,
+                {backgroundColor: 'white'},
+              ]}
+            />
+          )}
+          <Animated.View style={[{flex: 1}, appAnimation]}>
+            {props.children}
+          </Animated.View>
+        </>
+      ) : (
         <MaskedView
           style={[StyleSheet.absoluteFillObject]}
           maskElement={
             <Animated.View
               style={[
-              StyleSheet.absoluteFillObject,
                 {
                   // Transparent background because mask is based off alpha channel.
                   backgroundColor: 'transparent',
@@ -156,14 +172,17 @@ export function Splash(props: React.PropsWithChildren<Props>) {
           }>
           {!isAnimationComplete && (
             <View
-            style={[StyleSheet.absoluteFillObject, {backgroundColor: 'white'}]}
+              style={[
+                StyleSheet.absoluteFillObject,
+                {backgroundColor: 'white'},
+              ]}
             />
           )}
-
           <Animated.View style={[{flex: 1}, appAnimation]}>
             {props.children}
           </Animated.View>
         </MaskedView>
+      )}
     </View>
   )
 }