Mise en place d'un splash screen avec Flutter

Flutter
2

Salut @Tazooou, merci bonne année à toi aussi!

Pour la configuration du splash screen sur iOS et Android je te conseille effectivement d’utiliser le package flutter_native_splash (Flutter Favorite👍).

Voici une configuration basique à mettre dans pubspec.yaml :

flutter_native_splash:
  color: "#FFFFFF"
  image: assets/app_icon.png
  android_12:
    image: assets/app_icon.png'

Une fois la configuration effectuée, il suffit d’exécuter la commande suivante dans le terminal en étant dans le dossier de ton projet Flutter :

dart run flutter_native_splash:create

Une des possibilités intéressante de ce package est de pouvoir maintenir l’affichage du splash screen le temps de charger les données nécessaires au démarrage de l’app.
Pour cela il faut ajouter la ligne FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding) dans le main comme ceci:

import 'package:flutter_native_splash/flutter_native_splash.dart';

void main() async {
  WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized();
  FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding);
// Chargement des données nécessaires au lancement de l'app
  await loadDataBeforeRunningApp();
  runApp(const MyApp());
}

Ensuite dans le initState() de ton StatefulWidget principal de ton app tu peux relâcher le splash screen comme ceci:

class MyApp extends StatefulWidget {
  const MyApp({Key? key, required this.routerDelegate}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    FlutterNativeSplash.remove();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    ...
  }
}

J’espère que cette réponse t’aidera.

Bonne journée