為什么AnimationTween總是從0.0運行到1.0？

我想使用顫振制作影片

  late AnimationController controller1;
  late Animation<double> animation1;

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

   controller1 = AnimationController(
      duration: const Duration(milliseconds: 700),
      vsync: this,
    );
    animation1 = Tween(begin: 50.0, end: 0.0).animate(controller1)
      ..addListener(() {
        setState(() {});
      });

    controller1.forward();
}

無論我把哪些值作為“開始”和“結束”——

controller1.value

總是從 0.0 到 1.0。我在這里有什么錯誤？

謝謝！

uj5u.com熱心網友回復：

我認為你想使用animation1.value，而不是控制器1.value 您可以使用以下代碼進行驗證:)：

 @override
 void initState() {
  super.initState();
  controller =
      AnimationController(duration: const Duration(seconds: 2), vsync: this);

  animation = Tween<double>(begin: 50.0, end: 0.0).animate(controller)
    ..addListener(() {
      // #enddocregion addListener
      setState(() {
        print("Animation value: ${animation.value}");

        //TODO: you can uncomment this print to see the value of the controller
        //print("Controller value: ${controller.value}");
      });
    });
  controller.forward();
}

查看官方教程以獲取更多資訊:)

影片教程

順便說一句，由于controller.value從 0.0 到 1.0，您可以將其視為一種完成百分比:)

uj5u.com熱心網友回復：

您應該使用animation1.value而不是控制器值。

@override
  void initState() {
    super.initState();
    controller = AnimationController(
      vsync: this,
      duration: const Duration(milliseconds: 350),
    );
    animation = Tween<double>(begin:50, end:0.0).animate(controller);
    animation.addListener((){
      print(animation.value);
    });
    controller.forward();
  }

輸出

50 50 41.285714285714285 36.714285714285715 31.57142857142857 24.857142857142854 20.14285714285714 15.428571428571423 10.428571428571423 5.714285714285708 0.9999999999999929 0

代碼示例

uj5u.com熱心網友回復：

好吧伙計們。我設法使用SlideTransition和對此進行了排序FadeTransition。我想我們應該只將Transition小部件用于...過渡？而像Positioned和Opacity是用于更多靜態小部件的東西？沒有把握...

它的樣子：https : //youtu.be/hj7PkjXrgfg

無論如何，這是替換代碼，如果有人在尋找參考：

class WeatherCloudWidget extends StatefulWidget {
  final double sunSize;
  final CloudProperties properties;

  WeatherCloudWidget({Key key, this.properties, this.sunSize})
      : super(key: key);

  @override
  State<StatefulWidget> createState() => _WeatherCloudWidget();
}

class _WeatherCloudWidget extends State<WeatherCloudWidget>
    with TickerProviderStateMixin {
  AnimationController controller;
  Animation<Offset> position;
  Animation<double> opacity;

  final alphaTween = new Tween(begin: 0.0, end: 1.0);

  @override
  initState() {
    super.initState();
    _startAnimation();
  }

  @override
  Widget build(BuildContext context) {
    // screen width and height
    final screenWidth = MediaQuery.of(context).size.width;
    final screenHeight = MediaQuery.of(context).size.height;

    final properties = widget.properties;

    var vertical = (screenHeight * 0.5)  
        (widget.sunSize * properties.verticalOffset * -1);

    var horizontal =
        (screenWidth * 0.5)   (widget.sunSize * properties.tweenEnd);

    return Positioned(
      left: horizontal,
      top: vertical,
      child: SlideTransition(
          position: position,
          child: FadeTransition(
            opacity: opacity,
            child: Image.asset(
              properties.path,
              width: properties.getScaledWidth(widget.sunSize),
              height: properties.getScaledHeight(widget.sunSize),
            ),
          )),
    );
  }

  @override
  dispose() {
    controller.dispose();
    super.dispose();
  }

  void _startAnimation() {
    controller = AnimationController(
        duration: const Duration(milliseconds: 2000), vsync: this);

    position = new Tween<Offset>(
      begin: new Offset(widget.properties.tweenStart, 0.0),
      end: new Offset(0.0, 0.0),
    ).animate(new CurvedAnimation(parent: controller, curve: Curves.decelerate));

    opacity = alphaTween.animate(controller);

    controller.forward();
  }
}

我想這可能對你有幫助。

標籤：扑 动画片 颤动网

上一篇：帶有藥丸形狀UIButton擺動影片的奇怪行為

下一篇：斷斷續續的影片SwiftUI嵌套視圖