Olá o AppLoading foi descontinuado e no expo eles indicam a utilização do expo-splash-screen. Mas vendo o exemplo deles eles usam função assíncrona. Teria algo parecido com o AppLoading? Ou alguma ajuda para adaptar o splash-screen nesse projeto?
Olá o AppLoading foi descontinuado e no expo eles indicam a utilização do expo-splash-screen. Mas vendo o exemplo deles eles usam função assíncrona. Teria algo parecido com o AppLoading? Ou alguma ajuda para adaptar o splash-screen nesse projeto?
Tive o mesmo problema aqui, fiz uns teste de tentativa e erro seguindo a documentação (https://docs.expo.dev/versions/latest/sdk/splash-screen/) até conseguir.
Instalar a biblioteca:
expo install expo-splash-screen
Meu código ficou assim:
import React, { useEffect, useCallback } from 'react';
import { StatusBar, SafeAreaView } from 'react-native';
import {
useFonts,
Montserrat_400Regular,
Montserrat_700Bold,
} from '@expo-google-fonts/montserrat';
import Basket from './src/screens/Basket';
import mock from './src/mocks/basket';
import * as SplashScreen from 'expo-splash-screen';
export default function App() {
const [fontsLoaded] = useFonts({
MontserratRegular: Montserrat_400Regular,
MontserratBold: Montserrat_700Bold,
});
useEffect(() => {
async function prepare() {
try {
await SplashScreen.preventAutoHideAsync();
} catch (e) {
console.warn(e);
}
}
prepare();
}, []);
const onLayoutRootView = useCallback(async () => {
if (fontsLoaded) {
await SplashScreen.hideAsync();
}
}, [fontsLoaded]);
if (!fontsLoaded) {
return null;
}
return (
<SafeAreaView style={{ flex: 1 }} onLayout={onLayoutRootView}>
<StatusBar />
<Basket {...mock} />
</SafeAreaView>
);
}