我如何在Flutter的Google地图上添加标记，用户可以在其中更改标题和代码段。它应该是用户输入，但我不知道该怎么做。在此代码中，用户可以通过长按地图来设置标记。但是“信息”小部件只是我在代码中选择的文本。 （如何更改代码，即用户可以设置标记，而不是打开窗口，并且用户可以在其中键入标题和片段，所以请更改代码。关闭窗口后，标记具有来自窗口的标题和片段用户。）这只是一个想法！
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:location/location.dart';
GoogleMapController mapController;
class MapsDemo extends StatefulWidget {
MapsDemo() : super();
@override
MapsDemoState createState() => MapsDemoState();
}
class MapsDemoState extends State<MapsDemo> {
//
Completer<GoogleMapController> _controller = Completer();
static const LatLng _center = const LatLng(51, 10);
List<Marker> _markers = [];
LatLng _lastMapPosition = _center;
MapType _currentMapType = MapType.normal;
void _currentLocation() async {
final GoogleMapController controller = await _controller.future;
LocationData currentLocation;
var location = new Location();
try {
currentLocation = await location.getLocation();
} on Exception {
currentLocation = null;
}
controller.animateCamera(CameraUpdate.newCameraPosition(
CameraPosition(
bearing: 0,
target: LatLng(currentLocation.latitude, currentLocation.longitude),
zoom: 18.0,
),
));
}
_onMapCreated(GoogleMapController controller) {
_controller.complete(controller);
}
_onCameraMove(CameraPosition position) {
_lastMapPosition = position.target;
}
_onMapTypeButtonPressed() {
setState(() {
_currentMapType = _currentMapType == MapType.normal
? MapType.hybrid
: MapType.normal;
});
}
Future _addMarkerLongPressed(LatLng latlang) async {
setState(() {
final MarkerId markerId = MarkerId("RANDOM_ID");
Marker marker = Marker(
markerId: markerId,
draggable: true,
position: latlang, //With this parameter you automatically obtain latitude and longitude
infoWindow: InfoWindow(
title: 'This is a Marker',
snippet: 'This looks good',
),
icon: BitmapDescriptor.defaultMarker,
);
markers[markerId] = marker;
});
//This is optional, it will zoom when the marker has been created
GoogleMapController controller = await _controller.future;
controller.animateCamera(CameraUpdate.newLatLngZoom(latlang, 18.0));
}
Widget button(Function function, IconData icon) {
return FloatingActionButton(
onPressed: function,
materialTapTargetSize: MaterialTapTargetSize.padded ,
backgroundColor: Colors.blue,
child: Icon(
icon,
size: 36.0,
),
);
}
Map<MarkerId, Marker> markers = <MarkerId, Marker>{};
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
resizeToAvoidBottomPadding: false,
appBar: PreferredSize(
preferredSize: Size.fromHeight(40),
child: AppBar(
automaticallyImplyLeading: false,
centerTitle: true,
title: Column(
children: <Widget>[
const Text("Viewist", style: TextStyle(fontSize: 35.0),textAlign: TextAlign.center,),
const Text("", style: TextStyle(fontSize: 8.0),textAlign: TextAlign.center,),
],
),
flexibleSpace: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: <Color>[
Colors.greenAccent,
Colors.blueAccent
])
),
),
),
),
body:
Stack(
children: [Container(
padding: new EdgeInsets.all(0.0),
child: GoogleMap(
mapType: _currentMapType,
onMapCreated: _onMapCreated,
onCameraMove: _onCameraMove,
myLocationEnabled: true,
myLocationButtonEnabled: false,
initialCameraPosition: CameraPosition(
target: _center,
zoom: 6.0,
),
compassEnabled: true,
tiltGesturesEnabled: false,
onLongPress: (latlang) {
_addMarkerLongPressed(latlang); //we will call this function when pressed on the map
},
markers: Set<Marker>.of(markers.values), //all markers are here
),
),
Padding(
padding: EdgeInsets.all(20.0),
child: Align(
alignment: Alignment.topRight,
child: Column(
children: <Widget>[
button(_onMapTypeButtonPressed, Icons.map),
SizedBox(
height: 18.0,
),
button(_currentLocation, Icons.location_searching),
],
),
),
),
],
),
drawer: Drawer(
child: ListView(
padding: new EdgeInsets.all(0.0),
children: <Widget>[
DrawerHeader(
decoration: BoxDecoration(
gradient: LinearGradient(colors: <Color>[
Colors.green,
Colors.lightBlueAccent
])
),
child: Container(
child: Column(
children: <Widget>[
Material(
borderRadius: BorderRadius.all(Radius.circular(40.0)),
elevation: 10,
child: Padding(padding: EdgeInsets.all(8.0),
child: Image.asset('images/a.png',width: 80,height: 80,),
),
),
Padding(padding: EdgeInsets.all(2.0), child: Text ('Viewist', style: TextStyle(color: Colors.white, fontSize: 30.0,),
)
)],
),
)),
CustomListTile(Icons.person, 'Profile', ()=>{}),
CustomListTile(Icons.notifications, 'Notification', ()=>{}),
CustomListTile(Icons.settings, 'Settings', ()=>{}),
CustomListTile(Icons.lock, 'Log Out', ()=>{}),
],
),
),
),
);
}
}
class CustomListTile extends StatelessWidget {
IconData icon;
String text;
Function onTap;
CustomListTile(this.icon,this.text,this.onTap);
@override
Widget build(BuildContext context) {
// TODO: implement createState
return Padding(
padding: const EdgeInsets.fromLTRB(8.0, 0, 8.0, 0),
child: Container(
decoration: BoxDecoration(
border: Border(bottom: BorderSide(color: Colors.grey.shade400))
),
child: InkWell(
splashColor: Colors.lightBlueAccent,
onTap: onTap,
child: Container(
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Row(
children: <Widget>[
Icon(icon),
Padding(
padding: const EdgeInsets.all(8.0),
child: Text(text, style: TextStyle(
fontSize: 16.0
),),
),
],
),
Icon(Icons.arrow_right)
],
),
),
),
),
);
}
}
我如何在Flutter的Google地图上添加标记，用户可以在其中更改标题和代码段。它应该是用户输入，但我不知道该怎么做。在此代码中，用户可以设置...
当用户长按地图并要求他输入标记的标题时，您可以显示一个对话框。收到标题后，关闭对话框并添加标记。