Splash screen to Home screen navigation - Flutter - flutter

Question

I'm working on a Flutter app and have decided to introduce a splash screen in the same. To navigate to the home screen from the splash screen, normally we use Navigator. But there is one issue that I find in the Navigator method. Whenever i'm popping or pushing a screen, there is a visible navigation, i.e. I can see the screen moving left, right, up or down. What I want to achieve, is that the splash screen should disappear instead of sliding away from the screen. How can I achieve this?

Answer 1

You have to add native splash screen, if you don't want that visible navigation. To add splash screen in your app properly. Please follow the guide: Creating native splash screen
If you are feeling lazy, you can just use the following package : Splash Screen Package. This package is easy to use just read the documentation before installing.

Answer 2

You can use this package flutter_native_splash: ^2.0.5
This package will provide you native splash screen for your apps.
But if you want to disappear your current screen and go to next screen you can use this class custom_route.dart. This class provide you an animation like disappear.
import 'package:flutter/material.dart';
class FadePageRoute<T> extends MaterialPageRoute<T> {
FadePageRoute({
required WidgetBuilder builder,
RouteSettings? settings,
}) : super(
builder: builder,
settings: settings,
);
#override
Duration get transitionDuration => const Duration(milliseconds: 600);
#override
Widget buildTransitions(
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,
) {
if (settings.name == "/auth") {
return child;
}
return FadeTransition(
opacity: animation,
child: child,
);
}
}
and finally
onPressed: () {
Navigator.of(context).push(FadePageRoute(
builder: (context) => YourScreen(),
));
},