How to use snackbar, splash screen and navigator at once? - flutter

Question

I am trying to get next page using navigator since when I try to press sign in button it doesn't take me to next page. I am new in flutter.
class SignIn extends StatefulWidget {
const SignIn({super.key});
#override
State<SignIn> createState() => _SignInState();
}
class _SignInState extends State<SignIn> {
getanimatedscreen() {
MySplashScreen().getSplashScreen(HomePage());
}
#override
void initState() {
getanimatedscreen();
// TODO: implement initState
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
body: SingleChildScrollView(
child: SafeArea(
top: true,
bottom: true,
child: Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/background18.jpg'),
fit: BoxFit.cover,
),
),
//App Body Starts from here
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
//Using Gradient Text as Package in Pubsec
Container(
decoration: BoxDecoration(color: Colors.white),
child: GradientText("Sign In Page!",
style: TextStyle(fontSize: 50.0),
gradientType: GradientType.linear,
colors: const [
Color.fromARGB(255, 211, 24, 11),
Color.fromARGB(255, 3, 47, 83),
Color.fromARGB(255, 0, 0, 0),
]),
),
Column(
children: [
Center(
child: Padding(
padding: const EdgeInsets.all(25.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
//Field for Email
TextFormField(
maxLines: 1,
textInputAction: TextInputAction.next,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 15.0,
color: Colors.blue[900],
fontStyle: FontStyle.italic),
decoration: InputDecoration(
enabled: true,
filled: true,
hintText: "Enter Email",
fillColor: Colors.white,
label: Text("Email"),
labelStyle: TextStyle(letterSpacing: 2.0),
hintTextDirection: TextDirection.ltr,
),
keyboardType: TextInputType.emailAddress,
),
SizedBox(
height: 10.0,
),
//Field for Password
TextFormField(
textInputAction: TextInputAction.next,
textAlign: TextAlign.center,
maxLines: 1,
style: TextStyle(
fontSize: 15.0,
color: Colors.blue[900],
fontStyle: FontStyle.italic),
obscureText: true,
decoration: InputDecoration(
filled: true,
hintText: "Enter Password",
fillColor: Colors.white,
label: Text(
"Password",
),
labelStyle: TextStyle(letterSpacing: 2.0),
hintTextDirection: TextDirection.ltr,
),
keyboardType: TextInputType.visiblePassword,
),
SizedBox(
height: 20.0,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
SizedBox(
height: 40.0,
width: 120.0,
child: ElevatedButton(
onPressed: () {
final snackBar = SnackBar(
content: Text(
"You've been Successfully Signed In"),
duration: Duration(seconds: 2),
action: SnackBarAction(
label: "",
onPressed: () {
// Action to Undo or SnackBar Action
}),
);
ScaffoldMessenger.of(context)
.showSnackBar(snackBar);
getanimatedscreen();
},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.black,
shape: BeveledRectangleBorder(
borderRadius: BorderRadius.circular(
15), // <-- Radius
),
),
child: Text(
'Login',
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
fontStyle: FontStyle.italic),
),
),
),
OutlinedButton(
//SnackBar
onPressed: () {
final snackBar = SnackBar(
content: Text(
"Please Enter Your Email in Next Page"),
duration: Duration(seconds: 2),
action: SnackBarAction(
label: "",
onPressed: () {
// Action to Undo or SnackBar Action
}),
);
ScaffoldMessenger.of(context)
.showSnackBar(snackBar);
},
style: ButtonStyle(
backgroundColor:
MaterialStateProperty.all(
Colors.white,
),
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius:
BorderRadius.circular(10.0),
))),
child: Text(
"Forgot Password ?",
style: TextStyle(color: Colors.black),
),
),
],
),
SizedBox(
height: 15.0,
),
SizedBox(
height: 40.0,
width: 150.0,
child: ElevatedButton(
onPressed: () {
Navigator.pushNamed(context, 'firstRoute');
final snackBar = SnackBar(
content:
Text("Your Sign Up Page is Loading"),
duration: Duration(seconds: 2),
action: SnackBarAction(
label: "",
onPressed: () {
// Action to Undo or SnackBar Action
}),
);
ScaffoldMessenger.of(context)
.showSnackBar(snackBar);
},
style: ElevatedButton.styleFrom(
backgroundColor: Colors.black,
shape: BeveledRectangleBorder(
borderRadius:
BorderRadius.circular(15), // <-- Radius
),
),
child: Text(
'Sign-Up',
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
fontStyle: FontStyle.italic),
),
),
),
],
),
),
),
],
),
],
),
),
),
),
);
}
}`*
`
`Here you can see in image I am just getting an message only
Basically I am using Snackbar, Some Splash Screen Animations and Naviagtor function at a time. So when I try to fetch next page it only shows me the snackbar message.

Answer 1

First you'll want to declutter your "onPressed" create a reusable snack bar. Paste this code in your state class just above initState
Future showSnack(String msg) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(msg)));
}
Now replace the code in the login button onPressed with this
onPressed: () {
showSnack("You've been Successfully Signed In").whenComplete((){Navigator.pushNamed(context, 'loginScreen')});
}
The assumption here is you have set up your routes in main.dart file