0

我希望我的浮动按钮有自己的加载动画。但是,在我为该按钮提供动画后,动画会转到屏幕中心而不是停留在他的位置。但并非所有动画都这样做。

这是我使用的 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,
                    ),
                  ),
                ),
              ],
            ),
          ),

但这就是我得到的

在此处输入图像描述

这是我的按钮浮动看起来像

在此处输入图像描述

但如果我与另一个动画一起使用,就像我想要的一样

在此处输入图像描述

我的代码错了吗?或者我只是错误的逻辑?

4

1 回答 1

0

包装你的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,
          ),
于 2022-02-04T04:39:20.840 回答