Could not find the correct Provider<RetailerProvider> above this EditRetailer Widget - flutter

Question

#override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
body: Column(
children: <Widget>[
_myAppBar(context),
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height - 80,
child: ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
return Stack(children: <Widget>[
// The containers in the background
Column(children: <Widget>[
Padding(
padding: EdgeInsets.only(left: 8.0, right: 8.0),
child: Container(
width: MediaQuery.of(context).size.width,
height: 80.0,
child: Padding(
padding: EdgeInsets.only(top: 8.0, bottom: 8.0),
child: Material(
color: Colors.white,
elevation: 14.0,
shadowColor: Color(0x802196F3),
child: Center(
child: GestureDetector(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
'${items[index].name}',
style: TextStyle(
color: Colors.black,
fontSize: 20.0),
),
],
),
),
onTap: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => EditRetailer(items[index])));
},
),
),
),
),
),
),
]),
]);
}),
),
],
),
floatingActionButton: FloatingActionButton(
backgroundColor: Color(0xFFFA7397),
child: Icon(
FontAwesomeIcons.listUl,
color: Color(0xFFFDDE42),
),
onPressed: () {
//Navigator.push(context,MaterialPageRoute(builder: (context) => TaskScreen()),
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => RetailerScreen(Retailer('', '', '', '')),
fullscreenDialog: true),
);
},
),
);
}
The problem occurred when i add this line of code into my above widget :
onTap: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => EditRetailer(items[index])));
},
My editRetailer.dart code
class EditRetailer extends StatefulWidget {
final Retailer retailer;
EditRetailer([this.retailer]);
#override
_EditRetailerState createState() => _EditRetailerState();
}
class _EditRetailerState extends State<EditRetailer> {
final nameController = TextEditingController();
final phoneController = TextEditingController();
final gstController = TextEditingController();
final addressController = TextEditingController();
#override
void dispose() {
nameController.dispose();
phoneController.dispose();
gstController.dispose();
addressController.dispose();
super.dispose();
}
#override
void initState() {
if (widget.retailer == null) {
//New Record
nameController.text = "";
phoneController.text = "";
gstController.text = "";
addressController.text = "";
new Future.delayed(Duration.zero, () {
final retailerProvider = Provider.of<RetailerProvider>(context,listen: false);
retailerProvider.loadValues(Retailer(null,null,null,null));
});
} else {
//Controller Update
nameController.text=widget.retailer.name;
phoneController.text=widget.retailer.phone;
gstController.text=widget.retailer.gst;
addressController.text=widget.retailer.address;
//State Update
new Future.delayed(Duration.zero, () {
final retailerProvider = Provider.of<RetailerProvider>(context,listen: false);
retailerProvider.loadValues(widget.retailer);
});
}
super.initState();
}
#override
Widget build(BuildContext context) {
final retailerProvider = Provider.of<RetailerProvider>(context);
return Scaffold(
appBar: AppBar(title: Text('Edit Retailer')),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: ListView(
children: <Widget>[
TextField(
controller: nameController,
decoration: InputDecoration(hintText: 'Retailer Name'),
onChanged: (value) {
retailerProvider.changeName(value);
},
),
TextField(
controller: phoneController,
decoration: InputDecoration(hintText: 'Retailer Phone'),
onChanged: (value) => retailerProvider.changePhone(value),
),
TextField(
controller: gstController,
decoration: InputDecoration(hintText: 'Retailer GST'),
onChanged: (value) => retailerProvider.changeGst(value),
),
TextField(
controller: addressController,
decoration: InputDecoration(hintText: 'Retailer Address'),
onChanged: (value) => retailerProvider.changeAddress(value),
),
SizedBox(
height: 20.0,
),
RaisedButton(
child: Text('Save'),
onPressed: () {
retailerProvider.saveRetailer();
Navigator.of(context).pop();
},
),
(widget.retailer !=null) ? RaisedButton(
color: Colors.red,
textColor: Colors.white,
child: Text('Delete'),
onPressed: () {
retailerProvider.removeProduct(widget.retailer.gst);
Navigator.of(context).pop();
},
): Container(),
],
),
),
);
}
}
This is the error im getting while running the app.
Error: Could not find the correct Provider<RetailerProvider> above this EditRetailer Widget
This likely happens because you used a `BuildContext` that does not include the provider
of your choice. There are a few common scenarios:
- The provider you are trying to read is in a different route.
Providers are "scoped". So if you insert of provider inside a route, then
other routes will not be able to access that provider.
- You used a `BuildContext` that is an ancestor of the provider you are trying to read.
Make sure that EditRetailer is under your MultiProvider/Provider<RetailerProvider>.
This usually happen when you are creating a provider and trying to read it immediatly.