如何在颤动中添加粘在另一个小部件上的浮动操作按钮答案

【问题标题】：How to add floating action button that stick to another widget in flutter如何在颤动中添加粘在另一个小部件上的浮动操作按钮
【发布时间】：2020-08-26 14:11:31
【问题描述】：

我正在尝试添加悬浮在另一个小部件中的浮动操作按钮.. 这是我的代码的一部分..

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 中...但我想添加浮动操作按钮以粘贴到我的地图屏幕中.. 可以这样做吗？

【问题讨论】：

标签： flutter button maps floating-action-button

【解决方案1】：

您可以使用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),
              ),
            ),
          ],
        ),

输出

我希望这能回答你的问题。

【讨论】：

它工作得很好，就像我想要的一样。非常感谢你的帮助：D

【解决方案2】：

使用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(...)
         ),
        ],
      ),

【讨论】：