Flutter FutureBuilder封面AnimatedSwitcher

uubf1zoe  于 2023-10-22  发布在  Flutter
关注(0)|答案(1)|浏览(125)

每个人。我有一个翻转动画,而点击按钮(它的工作正常。)。然而,当我用futurebuilder Package 它时,我的小部件将在点击按钮后显示新状态,没有动画(状态是正确的)。我真的很困惑。我的动画消失了!动画制作完成后,是否需要更新小部件?
这是我的代码

return FutureBuilder(
    future: _UIsetting(),
    builder: (BuildContext context, AsyncSnapshot<void> snapshot){
      if(snapshot.connectionState==ConnectionState.done){
        return Container(

                //flip animation
                AnimatedSwitcher(
                  duration: const Duration(seconds: 1),
                  transitionBuilder: (Widget widget, Animation<double> animation){
                    final rotateAnim = Tween(begin: pi, end: 0.0).animate(animation);
                    return AnimatedBuilder(
                      animation: rotateAnim,
                      child: widget,
                      builder: (context, widget) {
                        final isUnder = (ValueKey(flip) != widget);
                        final value = isUnder ? min(rotateAnim.value, pi / 2) : rotateAnim.value;
                        return Transform(
                          transform: Matrix4.rotationY(value),
                          alignment: Alignment.center,
                          child: widget,
                        );
                      },
                    );
                  },
                  child: flip?
                  Container(
                    key: const ValueKey(0),
                    width: MediaQuery.of(context).size.width,
                    margin: const EdgeInsets.symmetric(horizontal: 30),
                    child: Image.asset('assets/work1.png'),
                  ):
                  Container(
                    key: const ValueKey(1),
                    width: MediaQuery.of(context).size.width,
                    margin: const EdgeInsets.symmetric(horizontal: 30),
                    child: Image.asset('assets/work2.png'),
                  ),
                ),

                //determine clicking which button(if T, click Button1)
                flip?
                Row(
                  children: [
                    ElevatedButton(
                        onPressed: (){
                          setState(() {
                            _flipCheck();
                          });
                        },
                        child:Text("button1"),
                    ),
                    ElevatedButton(
                        onPressed: (){},                              
                        child:Text("button2"),
                    ),
                  ],                  
                 ):
                Row(
                  children: [
                    ElevatedButton(
                        onPressed: (){},                    
                        child:Text("button1"),
                    ),
                    ElevatedButton(
                         onPressed: (){
                          setState(() {
                            _flipCheck();
                          });
                        },                              
                        child:Text("button2"),
                    ),
                  ],                  
                 )
        );
      }else{
        return const CircularProgressIndicator();
      }
    }
);

这里是_UIsetting

Future _UIsetting() async{
SharedPreferences prefs = await SharedPreferences.getInstance();

flip=prefs.getBool('flip')!;  //condition
print("_UIsetting flip $flip");
id=prefs.getString("ID").toString();  //user id
}

@override
void initState() {
  super.initState();
  _UIsetting();
}

这里是_flipCheck

Future _flipCheck() async{

SharedPreferences prefs = await SharedPreferences.getInstance();
now=DateTime.now().millisecondsSinceEpoch;

if((now-previous)~/3600000>=7){
  //update time (in local)
  flip=true;
  prefs.setBool('flip', true);

  //upload data (in DB)
  _upload();
}else{
  flip=false;
  prefs.setBool('flip', false);
}

}
所有代码都是class myappState extends State<myapp>{}。我非常感谢您的所有反馈。

nafvub8i

nafvub8i1#

在future builder中使用future函数是一种错误的用法。当每次运行构建你未来函数的小部件树时,你的BRAC任务就会再次发生。所以你必须在类中创建一个Future对象,并在initState中用你的future函数赋值。
在类中创建未来对象:

Future<String>? idFuture;

赋值未来的值,而不是只调用函数:

@override
void initState() {
  super.initState();
  idFuture = _UIsetting();
}

make _IUSetting函数返回字符串的Future:

Future<String> _UIsetting() async {
  ...
  return prefs.getString("ID").toString();  //user id
}

使用FutureBuilder时,使用future对象创建FutureBuilder:

FutureBuilder<String>(
  future: idFuture,
  builder: (_, snapshot) {
    if (snapshot.hasData) {
      final String id = snapshot.data; // your id variable here
    }
  }
),

我不能运行你的代码,所以我不确定解决方案。但无论如何,期货在未来建筑商中的使用应该是这样的。

相关问题