I am trying to add floating action button that stick into another widget.. here is part of my code..
Container(
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height / 2,
child: GoogleMap(
mapType: MapType.normal,
initialCameraPosition: init,
markers: ...
circles: ...,
onMapCreated: (GoogleMapController controller) {
_controller = controller;
},
),
);
I put my Maps screen inside Container... but I want to add floating action button that stick into my maps screen.. is it possible to do that?
You can use a Stack
widget to achieve what you want.
Check the code below. It works perfectly fine:
// use a stack widget
body: Stack(
children: <Widget>[
GoogleMap(
mapType: MapType.normal,
initialCameraPosition: init,
markers: ...
circles: ...,
onMapCreated: (GoogleMapController controller) {
_controller = controller;
},
),
// align it to the bottom center, you can try different options too (e.g topLeft,centerLeft)
Align(
alignment: Alignment.bottomRight,
// add your floating action button
child: FloatingActionButton(
onPressed: () {},
child: Icon(Icons.map),
),
),
],
),
Output: