Flutter Navigation undefined "context" - flutter

Question

I´m new to flutter and dart and I´m trying to build a Sign up for an app.
I got a start screen (StartPage) with options "login", "login FB", "sign up with email".
When I hit "login" I can navigate to the signup_email_screen. From there I want to navigate to the signup_email_screen_two but it throws "undefined name context".
class StartPage extends StatefulWidget {
#override
_StartPageState createState() => _StartPageState();
}
class _StartPageState extends State<StartPage> {
bool isAuth = false; //isAuth provides a bool if the user is already signed in
Widget buildAuthScreen() {
return Text('Angemeldet');
}
Scaffold buildUnAuthScreen() {
return Scaffold(
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/tenor.gif'),
fit: BoxFit.cover)),
alignment: Alignment.center,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(height: SizeConfig.blockSizeVertical * 10),
Container(
width: SizeConfig.blockSizeHorizontal * 65,
height: SizeConfig.blockSizeVertical * 20,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Insta_transparent.png'),
fit: BoxFit.scaleDown,
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 0),
Text(
'Nie mehr Langeweile',
style: TextStyle(
fontFamily: "Signatra",
fontSize: SizeConfig.blockSizeHorizontal *8,
color: Colors.white,
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 7),
GestureDetector(
onTap: () => _navigateToLogin(context),
child: Container(
width: SizeConfig.blockSizeHorizontal * 70,
height: SizeConfig.blockSizeVertical * 7,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Log_In_Button.png'),
fit: BoxFit.scaleDown,
),
),
)),
SizedBox(height: SizeConfig.blockSizeVertical * 2),
GestureDetector(
onTap: () => print('facebook signin'),
child: Container(
width: SizeConfig.blockSizeHorizontal * 70,
height: SizeConfig.blockSizeVertical * 7,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Log_In_Button_FB.png'),
fit: BoxFit.scaleDown,
),
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 2),
GestureDetector(
onTap: () => _navigateToEmailRegister(context),
child: Container(
width: SizeConfig.blockSizeHorizontal * 60,
height: SizeConfig.blockSizeVertical *7,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage(
'assets/images/button-email-registration.png'),
fit: BoxFit.scaleDown,
),
),
),
),
],
),
),
);
}
void _navigateToLogin(BuildContext context) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => LoginScreen(),
));
}
void _navigateToEmailRegister(BuildContext context) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SignupEmailScreen(),
));
}
#override
Widget build(BuildContext context) {
SizeConfig().init(context);
return isAuth ? buildAuthScreen() : buildUnAuthScreen();
}
}
class SignupEmailScreen extends StatelessWidget {
Scaffold signupEmailScreen() {
return Scaffold(
body: Stack(
children: [
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/StartPage_Background.jpg'),
fit: BoxFit.cover)),
alignment: Alignment.center,
),
//AppBar transparent and background full screen with Stack and Positioned
Positioned(
top: 0.0,
left: 0.0,
right: 0.0,
child: AppBar(
title: Text('Registrierung'),
backgroundColor: Colors.transparent, //transparent
elevation: 0.0, //Shadow gone
),
),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(height: SizeConfig.blockSizeVertical * 15),
//Insta image
Container(
width: SizeConfig.blockSizeHorizontal * 50,
height: SizeConfig.blockSizeVertical * 10,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Insta_transparent.png'),
fit: BoxFit.scaleDown,
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 7),
//Email text field
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.text,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Accountname",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
//Password text field
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.emailAddress,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Email",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.visiblePassword,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Passwort",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.visiblePassword,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Passwort wiederholen",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 10),
//log in button
GestureDetector(
onTap: () => _navigateToSignupEmailScreenTwo(context),
child: Container(
width: SizeConfig.blockSizeHorizontal * 70,
height: SizeConfig.blockSizeVertical * 7,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Log_In_Button.png'),
fit: BoxFit.scaleDown,
),
),
)),
],
),
],
),
);
}
//ACTIONS
void _navigateToSignupEmailScreenTwo(BuildContext context) {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SignupEmailScreenTwo(),
));
}
//BUILD
#override
Widget build(BuildContext context) {
return signupEmailScreen();
}
}
class SignupEmailScreenTwo extends StatelessWidget {
Scaffold signupEmailScreenTwo() {
return Scaffold(
body: Stack(
children: [
Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/StartPage_Background.jpg'),
fit: BoxFit.cover)),
alignment: Alignment.center,
),
//AppBar transparent and background full screen with Stack and Positioned
Positioned(
top: 0.0,
left: 0.0,
right: 0.0,
child: AppBar(
title: Text('Registrierung'),
backgroundColor: Colors.transparent, //transparent
elevation: 0.0, //Shadow gone
),
),
Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
SizedBox(height: SizeConfig.blockSizeVertical * 15),
Container(
width: SizeConfig.blockSizeHorizontal * 50,
height: SizeConfig.blockSizeVertical * 10,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Insta_transparent.png'),
fit: BoxFit.scaleDown,
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 7),
//Email text field
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.text,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Dein Vorname",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
//Password text field
Padding(
padding: EdgeInsets.symmetric(
horizontal: SizeConfig.safeBlockHorizontal * 5),
child: TextField(
keyboardType: TextInputType.datetime,
style: TextStyle(color: Colors.white, fontSize: 20.0),
decoration: InputDecoration(
labelText: "Dein Geburtsdatum",
labelStyle: TextStyle(
color: Colors.white,
),
hasFloatingPlaceholder: true,
enabledBorder: UnderlineInputBorder(
//Enables the border to change color
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
focusedBorder: UnderlineInputBorder(
borderSide:
BorderSide(color: Colors.white, width: 2.0)),
),
),
),
SizedBox(height: SizeConfig.blockSizeVertical * 10),
//log in button
GestureDetector(
onTap: () => print("Einlogggggeeeeeen"),
child: Container(
width: SizeConfig.blockSizeHorizontal * 70,
height: SizeConfig.blockSizeVertical * 7,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/Log_In_Button.png'),
fit: BoxFit.scaleDown,
),
),
)),
],
),
],
),
);
}
#override
Widget build(BuildContext context) {
return signupEmailScreenTwo();
}
}
Why is the context undefined?
Appreciate any help!

Answer 1

Because context undefined inside your function :)
**Edit: ** You cant reach context object inside StatelessWidget
These are what you can do:
1- Use StatefulWidget instead of StatelessWidget,
2- You can pass BuildContext context as a parameter into your functions.
3- You can write all widgets inside build method instead of extra function.