Rashmi Gunawardana
Reputation: 29
error: Undefined name 'context' in flutter
I am a beginner with flutter, I had just started a few days ago. I want to go from one page to another page . But when I use the navigator it shows an error.
I've tried to solve it using some answers to similar problems on stack overflow, but I can't solve it. Also, I am not able to understand those properly.
These are some of them:
Undefined name 'context'
Undefined name 'context' in flutter navigation
import 'package:flutter/material.dart';
import 'package:origitive_app/main.dart';
import 'package:origitive_app/Productpage.dart';
void main() {
runApp(chooseCategory());
}
class chooseCategory extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
debugShowCheckedModeBanner: false,
home: new DefaultTabController(
length: 3,
child: new Scaffold(
appBar: new AppBar(
title: const Text('Collections'),
backgroundColor: Colors.grey[400],
actions: [
//list if widget in appbar actions
PopupMenuButton(
icon: Icon(Icons.menu),
//don't specify icon if you want 3 dot menu
color: Colors.blue,
itemBuilder: (context) =>
[
PopupMenuItem<int>(
value: 0,
child: Text(
"Home", style: TextStyle(color: Colors.white),),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"About", style: TextStyle(color: Colors.white),),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"Settings", style: TextStyle(color: Colors.white),),
),
],
onSelected: (item) => {print(item)},
),
],
bottom: new TabBar(isScrollable: true, tabs: [
new Tab(text: 'MEN',),
new Tab(text: 'WOMEN',),
new Tab(text: 'KIDS',),
]),
),
body: new TabBarView(
children: [
new ListView(
children: list1,
),
new ListView(
children: list2,
),
new ListView(
children: list3,
),
],
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(Icons.business),
title: Text('Business'),
),
BottomNavigationBarItem(
icon: Icon(Icons.computer),
title: Text('Technology'),
),
BottomNavigationBarItem(
icon: Icon(Icons.book),
title: Text('Education'),
),
],
),
),
));
}
List<Widget> list1 = <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('429 Castro St'),
leading: new Image.asset("assets/Images/men2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list2 = <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('85 W Portal Ave'),
leading: new Image.asset("assets/Images/women1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list3 = <Widget>[
new ListTile(
title: new Text('Boys Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage());
);
},
),
new ListTile(
title: new Text('Girls Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Boys Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: () {
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
);
},
),
new ListTile(
title: new Text('Girls Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl2.png"),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},trailing: Icon(Icons.arrow_forward),
),
];
}
}
tried adding a static build context but failed.it gave a null error.
Upvotes: 2
Views: 20964
Answers (4)
Rafi Muhd
Reputation: 1
Use- GlobalcontextService
Step-1
Create a class like this
class GlobalcontextServive{
static Globalkey <NavigatorState> navigatorKey =
GlobalKey <NavigatorState> ();
}
Step-2
Set navigatorkey in main method
Can be directly manipulated without first obtaining it from a BuildContext
MaterialApp(
navigatorKey: GlobalContextService.navigatorKey,
)
Step-3
Navigator.push(GlobalContextService.navigatorKey.currentContext!, MaterialPageRoute(builder: (context)=>const productpage()));
Upvotes: -1
CiriousJoker
Reputation: 582
In my case I had to convert the widget to a stateful widget to use context inside its state functions (ie outside of build())
Upvotes: 0
Ermiyas Kasahun
Reputation: 83
Here is a modified code
import 'package:flutter/material.dart';
import 'package:origitive_app/main.dart';
import 'package:origitive_app/Productpage.dart';
void main() {
runApp(chooseCategory());
}
class chooseCategory extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
debugShowCheckedModeBanner: false,
home: new DefaultTabController(
length: 3,
child: new Scaffold(
appBar: new AppBar(
title: const Text('Collections'),
backgroundColor: Colors.grey[400],
actions: [
//list if widget in appbar actions
PopupMenuButton(
icon: Icon(Icons.menu),
//don't specify icon if you want 3 dot menu
color: Colors.blue,
itemBuilder: (context) => [
PopupMenuItem<int>(
value: 0,
child: Text(
"Home",
style: TextStyle(color: Colors.white),
),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"About",
style: TextStyle(color: Colors.white),
),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"Settings",
style: TextStyle(color: Colors.white),
),
),
],
onSelected: (item) => {print(item)},
),
],
bottom: new TabBar(isScrollable: true, tabs: [
new Tab(
text: 'MEN',
),
new Tab(
text: 'WOMEN',
),
new Tab(
text: 'KIDS',
),
]),
),
body: new TabBarView(
children: [
new ListView(
children: list1(context),
),
new ListView(
children: list2(context),
),
new ListView(
children: list3(context),
),
],
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(Icons.business),
title: Text('Business'),
),
BottomNavigationBarItem(
icon: Icon(Icons.computer),
title: Text('Technology'),
),
BottomNavigationBarItem(
icon: Icon(Icons.book),
title: Text('Education'),
),
],
),
),
));
}
List<Widget> list1(BuildContext context) => <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('429 Castro St'),
leading: new Image.asset("assets/Images/men2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list2(BuildContext context) => <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('85 W Portal Ave'),
leading: new Image.asset("assets/Images/women1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list3(BuildContext context) => <Widget>[
new ListTile(
title: new Text('Boys Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage());
);
},
),
new ListTile(
title: new Text('Girls Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Boys Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: () {
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
);
},
),
new ListTile(
title: new Text('Girls Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl2.png"),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},trailing: Icon(Icons.arrow_forward),
),
];
}
Upvotes: 0
Ermiyas Kasahun
Reputation: 83
It is because you are trying to access context outside of its scope. Move list1 and list2 to the method build like this:-
import 'package:flutter/material.dart';
import 'package:origitive_app/main.dart';
import 'package:origitive_app/Productpage.dart';
void main() {
runApp(chooseCategory());
}
class chooseCategory extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
debugShowCheckedModeBanner: false,
home: new DefaultTabController(
length: 3,
child: new Scaffold(
appBar: new AppBar(
title: const Text('Collections'),
backgroundColor: Colors.grey[400],
actions: [
//list if widget in appbar actions
PopupMenuButton(
icon: Icon(Icons.menu),
//don't specify icon if you want 3 dot menu
color: Colors.blue,
itemBuilder: (context) =>
[
PopupMenuItem<int>(
value: 0,
child: Text(
"Home", style: TextStyle(color: Colors.white),),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"About", style: TextStyle(color: Colors.white),),
),
PopupMenuItem<int>(
value: 0,
child: Text(
"Settings", style: TextStyle(color: Colors.white),),
),
],
onSelected: (item) => {print(item)},
),
],
bottom: new TabBar(isScrollable: true, tabs: [
new Tab(text: 'MEN',),
new Tab(text: 'WOMEN',),
new Tab(text: 'KIDS',),
]),
),
body: new TabBarView(
children: [
new ListView(
children: list1,
),
new ListView(
children: list2,
),
new ListView(
children: list3,
),
],
),
bottomNavigationBar: BottomNavigationBar(
type: BottomNavigationBarType.fixed,
items: const <BottomNavigationBarItem>[
BottomNavigationBarItem(
icon: Icon(Icons.home),
title: Text('Home'),
),
BottomNavigationBarItem(
icon: Icon(Icons.business),
title: Text('Business'),
),
BottomNavigationBarItem(
icon: Icon(Icons.computer),
title: Text('Technology'),
),
BottomNavigationBarItem(
icon: Icon(Icons.book),
title: Text('Education'),
),
],
),
),
));
List<Widget> list1 = <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('429 Castro St'),
leading: new Image.asset("assets/Images/men2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/men3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list2 = <Widget>[
new ListTile(
title: new Text('Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
subtitle: new Text('85 W Portal Ave'),
leading: new Image.asset("assets/Images/women1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women2.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Accessories',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/women3.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
];
List<Widget> list3 = <Widget>[
new ListTile(
title: new Text('Boys Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage());
);
},
),
new ListTile(
title: new Text('Girls Shoes',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},
),
new ListTile(
title: new Text('Boys Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/boy1.png"),
trailing: Icon(Icons.arrow_forward),
onTap: () {
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
);
},
),
new ListTile(
title: new Text('Girls Clothing',
style: new TextStyle(fontWeight: FontWeight.w500, fontSize: 20.0)),
leading: new Image.asset("assets/Images/girl2.png"),
onTap: (){
Navigator.push(
context,//error
MaterialPageRoute(builder: (context) => Productpage()));
},trailing: Icon(Icons.arrow_forward),
),
];
}
Upvotes: 6
Related Questions
- Flutter: 'package get' has not been run; 'Pub get' has not been run
- Exception Caught By Widgets Library error in Flutter
- getting error when i run flutter app in android studio
- Undefined name 'context' in fuction
- Flutter - facing issue on defined context, build context
- context problem in flutter "Undefined name 'context'"
- Flutter Errors: Undefined name "context"
- Flutter Undefined name 'context'. Try correcting the name to one that is defined, or defining the name
- having trouble to run my first flutter app
- Flutter Giving error in running the test app