我正在尝试添加粘贴到另一个小部件中的浮动操作按钮。这是我的代码的一部分。
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;
},
),
);
我将我的地图屏幕放置在Container中...但是我想添加漂浮在我的地图屏幕中的浮动操作按钮。可以这样做吗?
您可以使用Stack
小部件实现所需的功能。
检查下面的代码。它工作得很好:
// 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),
),
),
],
),
输出
我希望这能回答您的问题。
使用Stack
Stack(
children: <Widget>[
Align(
alignment:Alignment.center,//change this as you need
child:MyGoogleMap()
),
Align(
alignment:Alignment.bottomCenter,//change this as you need
child:FloatingActionButton(...)
),
],
),