如何解决将示例数据转换为真实的 json 数据
尝试在我的应用程序中应用自定义信息窗口，我按照教程使用了他们的示例数据，但我无法将示例转换为我的真实应用程序，我需要用我自己的 json fetch 替换教程示例硬编码数据数据。
这是教程示例数据：
final Map<String,User> _userlist = {
"spiderman": User('spiderman','Integral II','assets/images/logo.png',LatLng(18.47272120045281,-69.89471245478768),4),"ironman": User('ironman','Centro Médico',LatLng(18.47790066554913,-69.89132199740789),};
如何使用我的 json 数据？这就是我现在的工作方式：
var myList = await ApiProvider().getData();
List jsonParsed = json.decode(myList.toString());
if (jsonParsed == null) {
return CircularProgressIndicator();
} else {
for (int i = 0; i < jsonParsed.length; i++) {
initMarker(jsonParsed[i],jsonParsed[i]['id']);
}
}
}
我的json文件结构：
{
"id":"KPb8KINubNlpJy8sTGFA","calle":"Av. John F. Kennedy","sector":"UNPHU"
"longitude":"-69.94830718763","latitude":"18.48567087776","location":{
"_latitude":18.48567087776,"_longitude":-69.94830718763
},}
我提供了完整的教程文件，以防您想查看：
import 'package:clippy_Flutter/clippy_Flutter.dart';
import 'package:Flutter/material.dart';
import 'package:provider/provider.dart';
import '../model/infowindow.dart';
import '../model/user.dart';
import 'package:google_maps_Flutter/google_maps_Flutter.dart';
class CustomInfowindow extends StatefulWidget {
@override
_CustomInfowindowState createState() => _CustomInfowindowState();
}
class _CustomInfowindowState extends State<CustomInfowindow> {
GoogleMapController mapController;
Set<Marker> _markers = Set<Marker>();
final LatLng _center = LatLng(18.47272120045281,-69.89471245478768);
final double _zoom = 15.0;
final Map<String,};
final double _infoWindowWidth = 250;
final double _markerOffset = 170;
@override
Widget build(BuildContext context) {
final providerObject = Provider.of<InfoWindowModel>(context,listen: false);
_userlist.forEach((key,value) {
_markers.add(
Marker(
markerId: MarkerId(value.username),position: value.location,onTap: () {
providerObject.updateInfowindow(context,mapController,value.location,_infoWindowWidth,_markerOffset);
providerObject.updateUser(value);
providerObject.updateVisibility(true);
providerObject.rebuildInfowindow();
}),);
});
return Scaffold(
appBar: AppBar(
title: Text('Sistema de Citas'),backgroundColor: Colors.blue,),body: Container(
child: Consumer<InfoWindowModel>(
builder: (context,model,child) {
return Stack(
children: [
child,Positioned(
left: 0,top: 0,child: Visibility(
visible: providerObject.showInfoWindow,child: (providerObject.user == null ||
!providerObject.showInfoWindow)
? Container()
: Container(
margin: EdgeInsets.only(
left: providerObject.leftMargin,top: providerObject.topMargin),child: Expanded(
child: Column(
children: [
Container(
decoration: Boxdecoration(
borderRadius:
BorderRadius.circular(5.0),gradient: LinearGradient(
colors: [
Colors.white,Color(0xfffceef5),],end: Alignment.bottomCenter,begin: Alignment.topCenter,BoxShadow: [
BoxShadow(
color: Colors.grey,offset: Offset(0.0,1.0),blurRadius: 6.0,)
]),height: 115,width: 250,padding: EdgeInsets.all(15.0),child: Row(
mainAxisAlignment:
MainAxisAlignment.start,children: [
Image.asset(
providerObject.user.image,height: 75,SizedBox(
width: 10.0,Column(
crossAxisAlignment:
CrossAxisAlignment.start,children: [
Text(
providerObject.user.name,style: TextStyle(
fontSize: 16,fontWeight: FontWeight.bold,color: Colors.black),IconTheme(
data: IconThemeData(
color: Colors.red,size: 18,child: Row(
children: List.generate(5,(index) {
return Icon(
index <
providerObject
.user.rating
? Icons.star
: Icons.star_border,);
})),// ignore: deprecated_member_use
FlatButton(
onpressed: () {},child: Text("Hacer Cita"),color: Colors.blue,textColor: Colors.white,)
],)
],Triangle.isosceles(
edge: Edge.BottOM,child: Container(
color: Color(0xfffceef5),width: 20.0,height: 15.0,)
],))
],);
},child: Positioned(
child: GoogleMap(
onTap: (position) {
if (providerObject.showInfoWindow) {
providerObject.updateVisibility(false);
providerObject.rebuildInfowindow();
}
},onCameraMove: (position) {
if (providerObject.user != null) {
providerObject.updateInfowindow(
context,providerObject.user.location,_markerOffset);
providerObject.rebuildInfowindow();
}
},onMapCreated: (GoogleMapController controller) {
mapController = controller;
},markers: _markers,initialCameraPosition: CameraPosition(
target: _center,zoom: _zoom,);
}
}
import 'dart:convert';
import 'package:Flutter/material.dart';
import 'package:gabinete/jsonProvider.dart';
import 'package:gabinete/screens/listar_centros.dart';
import 'package:gabinete/widget/header_widget.dart';
import 'package:geocoder/geocoder.dart';
import 'package:google_maps_Flutter/google_maps_Flutter.dart';
import 'package:location/location.dart';
class JsonPage extends StatefulWidget {
static const routeName = '/json';
@override
_JsonPageState createState() => _JsonPageState();
}
class _JsonPageState extends State<JsonPage>
with AutomaticKeepAliveClientMixin {
Future res;
GoogleMapController _mapController;
Map<MarkerId,Marker> markers = <MarkerId,Marker>{};
BitmapDescriptor myIcon;
@override
Widget build(BuildContext context) {
super.build(context);
return MaterialApp(
initialRoute: '/',routes: {
'/lista-centros': (context) => ListadoCentros(),},debugShowCheckedModeBanner: false,title: 'GABINETE SALUD',theme: ThemeData(
primaryColor: Colors.blue[900],home: SafeArea(
child: Scaffold(
body: Container(
//color: Colors.grey[200],color: Colors.white,child: Column(
children: <Widget>[
HeaderWidget(),SizedBox(height: 10),Expanded(
child: GoogleMap(
markers: Set<Marker>.of(markers.values),mapType: MapType.normal,initialCameraPosition: CameraPosition(
target: LatLng(18.5082205,-69.8240024),zoom: 12.0),onMapCreated: _onMapCreated,zoomControlsEnabled: true,myLocationEnabled: true,myLocationButtonEnabled: true,);
}
getMarkerData() async {
var myList = await ApiProvider().getData();
List jsonParsed = json.decode(myList.toString());
if (jsonParsed == null) {
return CircularProgressIndicator();
} else {
for (int i = 0; i < jsonParsed.length; i++) {
initMarker(jsonParsed[i],jsonParsed[i]['id']);
}
}
}
void initMarker(specify,specifyId) async {
var markerIdVal = specifyId;
final MarkerId markerId = MarkerId(markerIdVal);
double latitude = specify['location']['_latitude'];
double longitude = specify['location']['_longitude'];
final Marker marker = Marker(
icon: myIcon,markerId: markerId,position: LatLng(latitude,longitude),infoWindow: InfoWindow(
title: 'Centro',snippet: specify['calle'] + ' ' + specify['sector']));
setState(() {
markers[markerId] = marker;
});
_placeMyIcon();
}
void _onMapCreated(GoogleMapController controller) {
_mapController = controller;
_centerView();
}
void initState() {
BitmapDescriptor.fromAssetimage(
ImageConfiguration(size: Size(15,15)),'assets/images/logo.png')
.then((onValue) {
myIcon = onValue;
});
getMarkerData();
super.initState();
}
_placeMyIcon() async {
Location location = Location();
double lat;
double lon;
final MarkerId markerId = MarkerId('yo');
var locData = await location.getLocation();
lat = locData.latitude;
lon = locData.longitude;
final Marker marker = Marker(
markerId: MarkerId('SomeId'),position: LatLng(lat,lon),zIndex: 100,infoWindow: InfoWindow(title: 'Yo'));
setState(() {
markers[markerId] = marker;
});
}
_centerView() async {
Location location = Location();
double lat;
double lon;
var locData = await location.getLocation();
lat = locData.latitude;
lon = locData.longitude;
double zoomLevel = await _mapController.getZoomLevel();
var cameraUpdate = CameraUpdate.newCameraPosition(
CameraPosition(target: LatLng(lat,zoom: zoomLevel));
_mapController.animateCamera(cameraUpdate);
}
@override
bool get wantKeepAlive => true;
}
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
