我一直在遵循有关克隆flutter uber应用程序的教程,并不断收到错误提示:
**错误:在此MapSample窗口小部件上方找不到正确的提供程序**,我正在尝试向我的应用添加地理位置,我在下面添加了我的代码和本教程的源代码,我有些不熟悉,因此请原谅问题,请,谢谢
,这是我的源代码:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'package:awesome/app_state.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return AnnotatedRegion<SystemUiOverlayStyle>(
value: SystemUiOverlayStyle(
statusBarColor: Colors.red,
),
child: MaterialApp(
title: 'Flutter Google Maps Demo',
home: MapSample(),
)
);
}
}
class MapSample extends StatefulWidget {
@override
State < MapSample > createState() => MapSampleState();
}
class MapSampleState extends State < MapSample > {
Completer<GoogleMapController> _controller = Completer();
static final CameraPosition _kGooglePlex = CameraPosition(
target: LatLng(-13.9875107, 33.768144),
zoom: 14.4746,
);
static final CameraPosition _kLake = CameraPosition(
bearing: 192.8334901395799,
target: LatLng(37.43296265331129, -122.08832357078792),
tilt: 59.440717697143555,
zoom: 19.151926040649414);
@override
Widget build(BuildContext context) {
GoogleMapController mapController;
final appState = Provider.of<AppState>(context);
return new Scaffold(
backgroundColor: Colors.transparent,
appBar: AppBar(
backgroundColor: Colors.transparent,
elevation: 0.0,
iconTheme: new IconThemeData(color: Colors.black),
),
extendBodyBehindAppBar: true,
drawer: Drawer(
// Add a ListView to the drawer. This ensures the user can scroll
// through the options in the drawer if there isn't enough vertical
// space to fit everything.
child: ListView(
// Important: Remove any padding from the ListView.
padding: EdgeInsets.zero,
children: <Widget>[
DrawerHeader(
child: Text('Drawer Header'),
decoration: BoxDecoration(
color: Colors.black,
),
),
ListTile(
title: Text('Trip History'),
onTap: () {
// Update the state of the app
// ...
// Then close the drawer
Navigator.pop(context);
},
),
ListTile(
title: Text('Payment'),
onTap: () {
// Update the state of the app
// ...
// Then close the drawer
Navigator.pop(context);
},
),
ListTile(
title: Text('Settings'),
onTap: () {
// Update the state of the app
// ...
// Then close the drawer
Navigator.pop(context);
},
),
],
),
),
body:
Stack(
children: <Widget>[
GoogleMap(
mapToolbarEnabled: false,
mapType: MapType.normal,
initialCameraPosition: CameraPosition(
target: appState.initialPosition, zoom: 10.0),
zoomControlsEnabled: false,
onMapCreated: (GoogleMapController controller) {
_controller.complete(controller);
mapController = controller;
mapController.setMapStyle('[ { "featureType": "administrative", "elementType": "geometry.fill", "stylers": [ { "color": "#d6e2e6" } ] }, { "featureType": "administrative", "elementType": "geometry.stroke", "stylers": [ { "color": "#cfd4d5" } ] }, { "featureType": "administrative", "elementType": "labels.text.fill", "stylers": [ { "color": "#7492a8" } ] }, { "featureType": "administrative.neighborhood", "elementType": "labels.text.fill", "stylers": [ { "lightness": 25 } ] }, { "featureType": "landscape.man_made", "elementType": "geometry.fill", "stylers": [ { "color": "#dde2e3" } ] }, { "featureType": "landscape.man_made", "elementType": "geometry.stroke", "stylers": [ { "color": "#cfd4d5" } ] }, { "featureType": "landscape.natural", "elementType": "geometry.fill", "stylers": [ { "color": "#dde2e3" } ] }, { "featureType": "landscape.natural", "elementType": "labels.text.fill", "stylers": [ { "color": "#7492a8" } ] }, { "featureType": "landscape.natural.terrain", "stylers": [ { "visibility": "off" } ] }, { "featureType": "poi", "elementType": "geometry.fill", "stylers": [ { "color": "#dde2e3" } ] }, { "featureType": "poi", "elementType": "labels.icon", "stylers": [ { "saturation": -100 } ] }, { "featureType": "poi", "elementType": "labels.text.fill", "stylers": [ { "color": "#588ca4" } ] }, { "featureType": "poi.park", "elementType": "geometry.fill", "stylers": [ { "color": "#a9de83" } ] }, { "featureType": "poi.park", "elementType": "geometry.stroke", "stylers": [ { "color": "#bae6a1" } ] }, { "featureType": "poi.sports_complex", "elementType": "geometry.fill", "stylers": [ { "color": "#c6e8b3" } ] }, { "featureType": "poi.sports_complex", "elementType": "geometry.stroke", "stylers": [ { "color": "#bae6a1" } ] }, { "featureType": "road", "elementType": "labels.icon", "stylers": [ { "saturation": -45 }, { "lightness": 10 }, { "visibility": "on" } ] }, { "featureType": "road", "elementType": "labels.text.fill", "stylers": [ { "color": "#41626b" } ] }, { "featureType": "road.arterial", "elementType": "geometry.fill", "stylers": [ { "color": "#ffffff" } ] }, { "featureType": "road.highway", "elementType": "geometry.fill", "stylers": [ { "color": "#c1d1d6" } ] }, { "featureType": "road.highway", "elementType": "geometry.stroke", "stylers": [ { "color": "#a6b5bb" } ] }, { "featureType": "road.highway", "elementType": "labels.icon", "stylers": [ { "visibility": "on" } ] }, { "featureType": "road.highway.controlled_access", "elementType": "geometry.fill", "stylers": [ { "color": "#9fb6bd" } ] }, { "featureType": "road.local", "elementType": "geometry.fill", "stylers": [ { "color": "#ffffff" } ] }, { "featureType": "transit", "elementType": "labels.icon", "stylers": [ { "saturation": -70 } ] }, { "featureType": "transit.line", "elementType": "geometry.fill", "stylers": [ { "color": "#b4cbd4" } ] }, { "featureType": "transit.line", "elementType": "labels.text.fill", "stylers": [ { "color": "#588ca4" } ] }, { "featureType": "transit.station", "elementType": "labels.text.fill", "stylers": [ { "color": "#008cb5" } ] }, { "featureType": "transit.station.airport", "elementType": "geometry.fill", "stylers": [ { "saturation": -100 }, { "lightness": -5 } ] }, { "featureType": "water", "elementType": "geometry.fill", "stylers": [ { "color": "#a6cbe3" } ] } ]');
//_controller.setMapStyle('');
},
),
Positioned(
top: 105.0,
right: 30.0,
left: 40.0,
child: Container(
height: 55,
width: 70.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(3.0),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
offset: Offset(1.0, 5.0),
blurRadius: 10,
spreadRadius: 3)
],
),
child: TextField(
cursorColor: Colors.black,
textInputAction: TextInputAction.go,
onSubmitted: (value) {
},
decoration: InputDecoration(
icon: Container(
margin: EdgeInsets.only(left: 20, top: 0,bottom: 6),
width: 10,
height: 10,
child: Icon(
Icons.local_taxi,
color: Colors.black,
),
),
hintText: "Hello, Where to?",
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 15.0, top: 10.0),
),
),
),
),
],
),
floatingActionButton: FloatingActionButton(
onPressed: _goToTheLake,
child: Icon(Icons.gps_fixed),
foregroundColor: Colors.black,
backgroundColor: Colors.white,
),
);
}
Future < void > _goToTheLake() async {
final GoogleMapController controller = await _controller.future;
controller.animateCamera(CameraUpdate.newCameraPosition(_kLake));
}
}
这是Visual Studio代码给我的错误
══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter ( 5872): The following ProviderNotFoundException was thrown building MapSample(dirty, state:
I/flutter ( 5872): MapSampleState#6cfd9):
I/flutter ( 5872): Error: Could not find the correct Provider<AppState> above this MapSample Widget
I/flutter ( 5872):
I/flutter ( 5872): This likely happens because you used a `BuildContext` that does not include the provider
I/flutter ( 5872): of your choice. There are a few common scenarios:
I/flutter ( 5872):
I/flutter ( 5872): - The provider you are trying to read is in a different route.
I/flutter ( 5872):
I/flutter ( 5872): Providers are "scoped". So if you insert of provider inside a route, then
I/flutter ( 5872): other routes will not be able to access that provider.
I/flutter ( 5872):
I/flutter ( 5872): - You used a `BuildContext` that is an ancestor of the provider you are trying to read.
I/flutter ( 5872):
I/flutter ( 5872): Make sure that MapSample is under your MultiProvider/Provider<AppState>.
I/flutter ( 5872): This usually happen when you are creating a provider and trying to read it immediatly.
I/flutter ( 5872):
I/flutter ( 5872): For example, instead of:
I/flutter ( 5872):
I/flutter ( 5872): ```
I/flutter ( 5872): Widget build(BuildContext context) {
I/flutter ( 5872): return Provider<Example>(
I/flutter ( 5872): create: (_) => Example(),
I/flutter ( 5872): // Will throw a ProviderNotFoundError, because `context` is associated
I/flutter ( 5872): // to the widget that is the parent of `Provider<Example>`
I/flutter ( 5872): child: Text(context.watch<Example>()),
I/flutter ( 5872): ),
I/flutter ( 5872): }
I/flutter ( 5872): ```
I/flutter ( 5872):
I/flutter ( 5872): consider using `builder` like so:
I/flutter ( 5872):
I/flutter ( 5872): ```
I/flutter ( 5872): Widget build(BuildContext context) {
I/flutter ( 5872): return Provider<Example>(
I/flutter ( 5872): create: (_) => Example(),
I/flutter ( 5872): // we use `builder` to obtain a new `BuildContext` that has access to the provider
I/flutter ( 5872): builer: (context) {
I/flutter ( 5872): // No longer throws
I/flutter ( 5872): return Text(context.watch<Example>()),
I/flutter ( 5872): }
I/flutter ( 5872): ),
I/flutter ( 5872): }
I/flutter ( 5872): ```
( 5872):
I/flutter ( 5872): If none of these solutions work, consider asking for help on StackOverflow:
I/flutter ( 5872): https://stackoverflow.com/questions/tagged/flutter
I/flutter ( 5872):
I/flutter ( 5872): The relevant error-causing widget was:
I/flutter ( 5872): MapSample
package:awesome/main.dart:29
I/flutter ( 5872):
I/flutter ( 5872): When the exception was thrown, this was the stack:
I/flutter ( 5872): #0 Provider._inheritedElementOf
package:provider/src/provider.dart:258
I/flutter ( 5872): #1 Provider.of
package:provider/src/provider.dart:210
I/flutter ( 5872): #2 MapSampleState.build
package:awesome/main.dart:72
I/flutter ( 5872): #3 StatefulElement.build
package:flutter/…/widgets/framework.dart:4619
I/flutter ( 5872): #4 ComponentElement.performRebuild
package:flutter/…/widgets/framework.dart:4502
I/flutter ( 5872): #5 StatefulElement.performRebuild
package:flutter/…/widgets/framework.dart:4675
I/flutter ( 5872): #6 Element.rebuild
package:flutter/…/widgets/framework.dart:4218
I/flutter ( 5872): #7 ComponentElement._firstBuild
package:flutter/…/widgets/framework.dart:4481
I/flutter ( 5872): #8 StatefulElement._firstBuild
package:flutter/…/widgets/framework.dart:4666
I/flutter ( 5872): #9 ComponentElement.mount
package:flutter/…/widgets/framework.dart:4476
I/flutter ( 5872): ... Normal element mounting (115 frames)
I/flutter ( 5872): #124 Element.inflateWidget
package:flutter/…/widgets/framework.dart:3446
I/flutter ( 5872): #125 MultiChildRenderObjectElement.mount
package:flutter/…/widgets/framework.dart:5947
I/flutter ( 5872): ... Normal element mounting (256 frames)
I/flutter ( 5872): #381 Element.inflateWidget
package:flutter/…/widgets/framework.dart:3446
I/flutter ( 5872): #382 Element.updateChild
package:flutter/…/widgets/framework.dart:3214
I/flutter ( 5872): #383 RenderObjectToWidgetElement._rebuild
package:flutter/…/widgets/binding.dart:1148
I/flutter ( 5872): #384 RenderObjectToWidgetElement.mount
package:flutter/…/widgets/binding.dart:1119
I/flutter ( 5872): #385 RenderObjectToWidgetAdapter.attachToRenderTree.<anonymous closure>
package:flutter/…/widgets/binding.dart:1061
I/flutter ( 5872): #386 BuildOwner.buildScope
package:flutter/…/widgets/framework.dart:2607
I/flutter ( 5872): #387 RenderObjectToWidgetAdapter.attachToRenderTree
package:flutter/…/widgets/binding.dart:1060
I/flutter ( 5872): #388 WidgetsBinding.attachRootWidget
package:flutter/…/widgets/binding.dart:941
I/flutter ( 5872): #389 WidgetsBinding.scheduleAttachRootWidget.<anonymous closure>
package:flutter/…/widgets/binding.dart:922
I/flutter ( 5872): (elided 11 frames from class _RawReceivePortImpl, class _Timer, dart:async, and dart:async-patch)
I/flutter ( 5872):
,这是原始教程源代码
import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:provider/provider.dart';
import 'package:uber_clone/states/app_state.dart';
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(body: Map());
}
}
class Map extends StatefulWidget {
@override
_MapState createState() => _MapState();
}
class _MapState extends State<Map> {
@override
Widget build(BuildContext context) {
final appState = Provider.of<AppState>(context);
return SafeArea(
child: appState.initialPosition == null
? Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SpinKitRotatingCircle(
color: Colors.black,
size: 50.0,
)
],
),
SizedBox(height: 10,),
Visibility(
visible: appState.locationServiceActive == false,
child: Text("Please enable location services!", style: TextStyle(color: Colors.grey, fontSize: 18),),
)
],
)
)
: Stack(
children: <Widget>[
GoogleMap(
initialCameraPosition: CameraPosition(
target: appState.initialPosition, zoom: 10.0),
onMapCreated: appState.onCreated,
myLocationEnabled: true,
mapType: MapType.normal,
compassEnabled: true,
markers: appState.markers,
onCameraMove: appState.onCameraMove,
polylines: appState.polyLines,
),
Positioned(
top: 50.0,
right: 15.0,
left: 15.0,
child: Container(
height: 50.0,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(3.0),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
offset: Offset(1.0, 5.0),
blurRadius: 10,
spreadRadius: 3)
],
),
child: TextField(
cursorColor: Colors.black,
controller: appState.locationController,
decoration: InputDecoration(
icon: Container(
margin: EdgeInsets.only(left: 20, top: 5),
width: 10,
height: 10,
child: Icon(
Icons.location_on,
color: Colors.black,
),
),
hintText: "pick up",
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 15.0, top: 16.0),
),
),
),
),
Positioned(
top: 105.0,
right: 15.0,
left: 15.0,
child: Container(
height: 50.0,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(3.0),
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.grey,
offset: Offset(1.0, 5.0),
blurRadius: 10,
spreadRadius: 3)
],
),
child: TextField(
cursorColor: Colors.black,
controller: appState.destinationController,
textInputAction: TextInputAction.go,
onSubmitted: (value) {
appState.sendRequest(value);
},
decoration: InputDecoration(
icon: Container(
margin: EdgeInsets.only(left: 20, top: 5),
width: 10,
height: 10,
child: Icon(
Icons.local_taxi,
color: Colors.black,
),
),
hintText: "destination?",
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 15.0, top: 16.0),
),
),
),
),
// Positioned(
// top: 40,
// right: 10,
// child: FloatingActionButton(onPressed: _onAddMarkerPressed,
// tooltip: "aadd marker",
// backgroundColor: black,
// child: Icon(Icons.add_location, color: white,),
// ),
// )
],
),
);
}
}
最佳答案
您必须在使用前致电提供商。您可以使用这样的多提供商。
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider<AppState>(
create: (_) => AppState()),
],
child: MaterialApp(
...
),
);
}
关于android - 在此MapSample小部件上方找不到正确的Provider <AppState>,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/62371625/