Column 在颤动中改变了 FAB 的位置答案

【问题标题】：Column changes FAB's position in flutterColumn 在颤动中改变了 FAB 的位置
【发布时间】：2020-11-19 15:26:52
【问题描述】：

我有一个问题，如果我将我的 FAB 包装在一个底部导航栏的末尾，它会改变它们的位置。我不想将它包装在堆栈中，因为它无法点击，我尝试了各种方法来解决这个问题，但都没有奏效。

FAB 1：

Widget add(){
   return new FloatingActionButton(
    onPressed: (){Navigator.push(context, new MaterialPageRoute(builder: (context) => HomePage()));},
    heroTag: 'btnAdd',
    child: new Icon(Icons.add),
    backgroundColor: Colors.blue,
    elevation: 0.0,
    splashColor: Colors.redAccent,
  );
}

FAB 2：

  Widget floatMain(){
    return new FloatingActionButton(
      heroTag: 'btnMain',
      child: new AnimatedIcon(
        icon: AnimatedIcons.menu_close,
        progress: _animateIcon,
      ),
      tooltip: 'floatMain',
      onPressed: animate,
      backgroundColor: _buttonColor.value,
   );
 }

FAB 电话：

floatingActionButton: new Container(
    child: new Stack(
      children: <Widget>[
        new Container(
          child: new Transform(
            transform: Matrix4.translationValues(0.0, _translateButton.value - 56, 0.0),
            child: add(),
          ),
        ),
        floatMain(),
      ],
    ),
  ),
  floatingActionButtonLocation: FloatingActionButtonLocation.endDocked

所以，如果我将它包装在 Stack 中，它可以工作，但它不适用于 Column。

【问题讨论】：

标签： flutter dart floating-action-button

【解决方案1】：

如果您只需要 FAB 按钮按钮右对齐。内柱试试看。

Expanded(
 child: Align(
alignment:FractionalOffset.bottomRight,
child: Padding(
 padding: EdgeInsets.only(bottom: 10.0), 
child: floatMain()//Your FAB widget here,
 ), 
), 
),

【讨论】：

谢谢，这行得通，必须做一些额外的事情，但我明白了。