Dart/Flutter 不使用 Inkwell 和手势检测器更改页面
Posted
技术标签:
【中文标题】Dart/Flutter 不使用 Inkwell 和手势检测器更改页面【英文标题】:Dart/Flutter not changing page with Inkwell and Gesture detector 【发布时间】:2021-02-23 22:58:16 【问题描述】:我正在尝试使用 Inkwell 或手势检测器导航到第 2 页,但它显示“未定义名称‘上下文’”。希望有人能帮忙! :)) 它是一个谷歌地图堆栈容器和顶部的其他容器组。当点击顶部的容器时,它会重定向到 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);
【问题讨论】:
【参考方案1】:您需要将 BuildContexti 发送到函数。没有看到正确的上下文。同样,您需要将其添加到顶部。无论您在哪里调用,都可以设置上下文。
Widget technicianCard(Technician technician, BuildContext context)//add here
.....
...
..
【讨论】:
是的。我忘了:)以上是关于Dart/Flutter 不使用 Inkwell 和手势检测器更改页面的主要内容,如果未能解决你的问题,请参考以下文章