颤振loading_animations不停留在位置

Question

我想我的浮动按钮有自己的加载动画。但是，当我把动画给那个按钮后，动画就会转到屏幕的中央，而不是停留在他的位置上。但并不是所有的动画都是这样的。

这是我用的pubspec.yaml

loading_animations: ^2.2.0

这是我的代码

bool _isloading = false;

_startLoading() {
setState(() {
  _isloading = true;
});

Timer(Duration(seconds: 3), () {
  setState(() {
    _isloading = false;
  });
});}

floatingActionButton:_isloading?
          LoadingDoubleFlipping.circle(
            borderColor: Colors.deepPurpleAccent,
            borderSize: 0.0,
            size: 50.0,
            backgroundColor: Colors.deepPurpleAccent,
            duration: Duration(seconds: 1),
          ):FloatingActionButton( //Floating action button on Scaffold
            onPressed: (){
              _startLoading();
              CheckOut();
            },
            child: Icon(Icons.check_rounded),
            backgroundColor: Colors.deepPurpleAccent,
          ),
          floatingActionButtonLocation: FloatingActionButtonLocation.endDocked,
          bottomNavigationBar: BottomAppBar( //bottom navigation bar on scaffold
            color:Color.fromRGBO(86, 213, 198, 1),
            shape: CircularNotchedRectangle(), //shape of notch
            notchMargin: 5, //notche margin between floating button and bottom appbar
            child: Row( //children inside bottom appbar
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Container(
                  margin: EdgeInsets.only(top: 15,bottom: 15,right: 15,left: 30),
                  child: Text(
                    'Check Out',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 20,
                    ),
                  ),
                ),
              ],
            ),
          ),

但这是我得到的

在这里输入图像描述

这是我的按钮浮动看上去

在这里输入图像描述

但如果我用另一个动画，就像我想要的那样

在这里输入图像描述

我的代码错了吗？还是我的逻辑搞错了？

Answer 1

将LoadingDoubleFlipping.circle()动画包装为FloatingActionButton()，并将Colors.transparent交给FloatingActionButton()

 floatingActionButton: _isloading
        ? FloatingActionButton(
            onPressed: () {},
            backgroundColor: Colors.transparent,
            child: LoadingDoubleFlipping.circle(
              borderColor: Colors.deepPurpleAccent,
              borderSize: 0.0,
              size: 50.0,
              backgroundColor: Colors.deepPurpleAccent,
              duration: Duration(seconds: 1),
            ),
          )
        : FloatingActionButton(
            //Floating action button on Scaffold
            onPressed: () {
              _startLoading();
            },
            child: Icon(Icons.check_rounded),
            backgroundColor: Colors.deepPurpleAccent,
          ),