Dart/Flutter not changing page with Inkwell and Gesture detector - flutter

Question

I am trying to use Inkwell or Gesture detector to navigate to page 2, but it is saying "Undefined name 'context'". Hope someone can help! :))
It is a google maps stack container and other group of containers on the top. When click on the containers on top, it redirects to the 2page.
Main.dart:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:geolocator/geolocator.dart';
import 'woocommerce/woocommerce_api.dart';
void main() {
runApp(Page1());
}
class Page1 extends StatelessWidget {
//********************************** GOOGLE MAPS *****************************************
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: MapView(),
);
}
}
class MapView extends StatefulWidget {
#override
_MapViewState createState() => _MapViewState();
}
class _MapViewState extends State<MapView> {
CameraPosition _initialLocation = CameraPosition(target: LatLng(0.0, 0.0));
GoogleMapController mapController;
final Geolocator _geolocator = Geolocator();
Position _currentPosition;
#override
void initState() {
super.initState();
_getCurrentLocation();
}
_getCurrentLocation() async {
await _geolocator
.getCurrentPosition(desiredAccuracy: LocationAccuracy.high)
.then((Position position) async {
setState(() {
// Store the position in the variable
_currentPosition = position;
print('CURRENT POS: $_currentPosition');
// For moving the camera to current location
mapController.animateCamera(
CameraUpdate.newCameraPosition(
CameraPosition(
target: LatLng(position.latitude, position.longitude),
zoom: 13.0,
),
),
);
});
}).catchError((e) {
print(e);
});
}
#override
Widget build(BuildContext context) {
// Determining the screen width & height
var height = MediaQuery.of(context).size.height;
var width = MediaQuery.of(context).size.width;
//********************************** GOOGLE MAPS SCREEN **********************************
return Container(
height: height,
width: width,
child: Scaffold(
body: Stack(
children: <Widget>[
GoogleMap(
initialCameraPosition: _initialLocation,
myLocationEnabled: true,
myLocationButtonEnabled: false,
mapType: MapType.normal,
zoomGesturesEnabled: true,
zoomControlsEnabled: false,
onMapCreated: (GoogleMapController controller) {
mapController = controller;
},
),
ClipOval(
child: Material(
color: Color(0xffeb5c68), // button color
child: InkWell(
splashColor: Color(0xffda1b2b), // inkwell color
child: SizedBox(
width: 56,
height: 56,
child: Icon(Icons.my_location),
),
onTap: () {
mapController.animateCamera(
CameraUpdate.newCameraPosition(
CameraPosition(
target: LatLng(
_currentPosition.latitude,
_currentPosition.longitude,
),
zoom: 13.0,
),
),
);
},
),
),
),
//********************************** ORDERS **********************************
Container(
padding: EdgeInsets.only(top: 550, bottom: 50),
child: ListView(
padding: EdgeInsets.only(left: 20),
children: getTechniciansInArea(),
scrollDirection: Axis.horizontal,
),
),
],
)
),
);
}
List<Technician> getTechies() {
List<Technician> techies = [];
//For esting...
// for (int i = 0; i < 10; i++) {
//Technician myTechy = Technician(name:'Apotheken', phoneNum: 'Address store');
Technician myTechy = Technician("Store name test", "Address store ", "Address costumer", 529.3, 4, "Available", "fdfd");
techies.add(myTechy);
//}
return techies;
}
List<Widget> getTechniciansInArea() {
List<Technician> techies2 = getTechies();
List<Widget> cards = [];
for (Technician techy in techies2) {
cards.add(technicianCard(techy));
}
return cards;
}
}
Widget technicianCard(Technician technician) {
return
InkWell( // when click...
child:
Container(
padding: EdgeInsets.all(10),
margin: EdgeInsets.only(right: 20),
width: 180,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(20)),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
blurRadius: 0.5,
),],
),
child:
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
SizedBox(height: 5,),
Text(technician.name, style: TextStyle(fontSize: 19,fontWeight: FontWeight.bold), textAlign: TextAlign.center),
SizedBox(height: 10,),
Text("AS: " + technician.phoneNum, style: TextStyle(fontSize: 15)),
SizedBox(height: 10,),
Text("AC: " + technician.address, style: TextStyle(fontSize: 15)),
SizedBox(height: 30,),
],
),
GestureDetector(
child:
Container(
alignment: Alignment.bottomCenter,
width: 120.0,
height: 40.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(10)),
color: Color(0xffeb5c68),
),
child:
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("REQUEST", textAlign: TextAlign.center,style: TextStyle(color: Colors.white),),
]
)
),
onLongPress: (){
Navigator.push(
context,
MaterialPageRoute(builder: (context) => Page2()),
);
},
)
]
)
),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => Page2()),
);
}
);
}
//********************************** PAGE 2 **********************************
class Page2 extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Your orders"),
),
);
}
Woocommerce_api.dart:
class Technician {
String name;
String phoneNum;
String address;
double rate;
String status;
int rating;
String occupation;
Technician(this.name, this.phoneNum, this.address, this.rate, this.rating, this.status, this.occupation);
//Technician({this.name, this.phoneNum, this.address, this.rate, this.rating, this.status, this.occupation});
}

Answer 1

You need to send BuildContexti to function. does not see the correct context. likewise, you need to add it to the top. Set the context no matter where you called.
Widget technicianCard(Technician technician, BuildContext context)//add here
{
.....
...
..
}