Home > Mobile >  splash screen contain video in flutter
splash screen contain video in flutter

Time:12-27

I am trying to add 3 second video in splash screen in FLUTTER. so how to remove white screen before splash screen while launcher screen or any other suggestion are welcome for this.

Here's what I've tried

class _MyAppState extends State<MyApp> {
late VideoPlayerController _controller;
@override
void initState() {
  super.initState();
  _controller = VideoPlayerController.asset("assets/video.mp4");
  _controller.addListener(() {
    if (!_controller.value.isPlaying &&
        _controller.value.position.inSeconds >=
            _controller.value.duration.inSeconds) {
      // completion
      _controller.dispose();
      Get.offAll(() => FirstScreen());
    }
  });
  controller.initialize().then(() => setState(() {}));
  _controller.play();
}
@override
void dispose() {
  _controller.dispose();
  super.dispose();
}
@override
Widget build(BuildContext context) {
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);

  return GetMaterialApp(
    debugShowCheckedModeBanner: false,
    home:  Scaffold(
      body: VideoPlayer(_controller),
    ),
  );
}
}

CodePudding user response:

You can't entirely remove this screen. Only thing you can do is altering it in some way that it matches your video playing screen. Use https://pub.dev/packages/flutter_native_splash package and make it like that user doesn't feel screen changing(make background same, etc)

CodePudding user response:

First create styles.xml file inside android/app/src/main/res/values.

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <!-- Show a Drawable splash screen on the activity. Automatically removed when Flutter draws its first frame -->
        <item name="android:windowBackground">@drawable/splash_screen</item>
    </style>
    <!-- Theme applied to the Android Window as soon as the process has started.
         This theme determines the color of the Android Window while your
         Flutter UI initializes, as well as behind your Flutter UI while its
         running.  -->
    <style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <item name="android:windowBackground">?android:colorBackground</item>
    </style>
</resources>

Now add your splash screen inside res/drawable folder.

AndroidManifest.xml

Inside activity tag create meta-data like this,

        <meta-data android:name="io.flutter.app.android.SplashScreenUntilFirstFrame" android:resource="@drawable/splash_screen" />
        <meta-data android:name="flutterEmbedding" android:value="2" />
  • Related