Animation 试图让动画在背景图像上方播放

Animation 试图让动画在背景图像上方播放,animation,flutter,dart,flutter-layout,Animation,Flutter,Dart,Flutter Layout,这是我的第一个颤振问题,我正在尝试在堆栈中的背景图像上方播放动画。如果我删除了图像,那么我可以看到动画播放,但是在图像中没有动画播放,并且在图像放入之前我可以看到它一瞬间,所以我猜动画在图像后面 return Stack( alignment: Alignment.center, children: <Widget>[ Positioned.fill(child: new Image.asset( colors[_

这是我的第一个颤振问题,我正在尝试在堆栈中的背景图像上方播放动画。如果我删除了图像,那么我可以看到动画播放,但是在图像中没有动画播放,并且在图像放入之前我可以看到它一瞬间,所以我猜动画在图像后面

return  Stack(
      alignment: Alignment.center,

      children: <Widget>[

        Positioned.fill(child: new Image.asset(
            colors[_Element.image],
            width: size.width,
            height: size.height,
            fit: BoxFit.fill),),
        Positioned.fill(child: Container(
          child: AnimatedBuilder(
            animation: CurvedAnimation(parent: _controller, curve: Curves.fastOutSlowIn),
            builder: (context, child){
              return Stack(
                alignment: Alignment.center,
                children: <Widget>[

                  _buildContainer(150 * _controller.value),
                  _buildContainer(200 * _controller.value),
                  _buildContainer(250 * _controller.value),
                  _buildContainer(300 * _controller.value),
                  _buildContainer(350 * _controller.value),
                ],
              );
            },
          ),
        ),),

Widget _buildContainer(double radius) {
    return Container(
      width: radius,
      height: radius,
      decoration: BoxDecoration(
        shape: BoxShape.circle,
        color: Colors.blue.withOpacity(1 - _controller.value),
      ),
    );

  }
返回堆栈(
对齐:对齐.center,
儿童:[
定位。填充(子项:new Image.asset(
颜色[_元素.图像],
宽度:size.width,
高度:size.height,
适合:BoxFit.fill),),
定位。填充(子项:容器(
子对象:动画生成器(
动画:曲线动画(父对象:_控制器,曲线:Curves.fastoutswowin),
生成器:(上下文,子对象){
返回堆栈(
对齐:对齐.center,
儿童:[
_buildContainer(150*_controller.value),
_buildContainer(200*_controller.value),
_buildContainer(250*_controller.value),
_buildContainer(300*_controller.value),
_buildContainer(350*_controller.value),
],
);
},
),
),),
小部件构建容器(双半径){
返回容器(
宽度:半径,
高度:半径,
装饰:盒子装饰(
形状:BoxShape.circle,
颜色:颜色。蓝色。不透明度(1-_控制器值),
),
);
}

感谢您抽出时间

嘿,您报告了一个bug问题,您可以在此处进行临时解决,您可以将图像小部件包装在重新绘制边界中。

嘿,我已使用来自web的随机图像测试了您的代码,运行正常。我已在initState中初始化了控制器,如下所示:_controller=AnimationController(vsync:this,duration:const duration(seconds:1)),然后调用_controller.repeat();您在web上测试过它吗?我一直在使用它