【问题标题】:Irregular behavior of animation动画的不规则行为
【发布时间】:2020-07-28 08:55:43
【问题描述】:

我尝试在我的项目中加入动画,其中会有一堆蓝色容器和黄色容器,当点击屏幕时,上面的容器会向下滑动,再次点击时会向上滑动(上面的容器是黄色的),很像背景脚手架

代码

 AnimationController _animationController;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _animationController=AnimationController(
      duration: Duration(milliseconds: 250),
      vsync: this
    )..repeat();
  }

  void toggle()=>_animationController.isDismissed? _animationController.forward()
      :_animationController.reverse();


  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: (){
        toggle();
      },
      child: AnimatedBuilder(
       animation: _animationController,
       builder: (_,__){
         double slide=1.0-_animationController.value*0.3;
         double align=(MediaQuery. of(context). size. height-150.0
         )*_animationController.value;


         return Stack(
           children: <Widget>[
             Container(
               color: Colors.blue,
             ),
             Transform(
               transform: Matrix4.identity()
                 //..scale(slide)
                 ..translate(0.0,align),
               alignment: Alignment.bottomCenter ,
              
               child: Container(
                 width: double.infinity,
                 height: double.infinity,

                 decoration: BoxDecoration(
                     color: Colors.yellow,
                   borderRadius: BorderRadius.circular(12.0)
                 ),
               ),
             )
           ],
         );
       },
      ),
    );

@override
  void dispose() {
    // TODO: implement dispose
    _animationController.dispose();
    super.dispose();
  }

现在每当我重新启动应用程序或打开应用程序时,黄色容器只会上下上下而没有任何点击,只有在点击后才会停止

【问题讨论】:

    标签: flutter animationcontroller


    【解决方案1】:

    根据文档: .repeat 方法 Starts running the animation in the forward direction, and restarts the animation when it completes.

    要解决此问题,请删除附加到 animationControlller 对象的 ..repeat 方法。我添加了一个演示代码:

     @override
      void initState() {
        // TODO: implement initState
        super.initState();
        _animationController =
            AnimationController(duration: Duration(milliseconds: 250), vsync: this);
      }
          
    

    【讨论】:

      猜你喜欢
      • 2018-06-16
      • 2013-10-28
      • 2019-12-16
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-07-15
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多