停止Flutter标度动画

wko9yo5t  于 2023-01-14  发布在  Flutter
关注(0)|答案(1)|浏览(176)

有人可以帮助一个规模的动画,正在试图执行。我想实现的是一个规模的图像动画,我已经设法规模动画,但我希望它停止一个图像是完全缩放。如果我使用停止方法的动画控制器上的图像不显示,我怎么能停止动画后,图像已完全缩放?

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
  late AnimationController controller;
  late Animation<double> animation;

  @override
  void initState() {
    // ignore: todo
    // TODO: implement initState
    super.initState();

    controller =
        AnimationController(vsync: this, duration: const Duration(seconds: 2));
    animation = CurvedAnimation(parent: controller, curve: Curves.easeIn);

    //controller.repeat(reverse: false); // with this line of code the image scales up and down
    controller.stop(canceled: true); //This line of code is failing to stop the animation
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.brown,
      // appBar: AppBar(title: const Text('Acsz Show'), centerTitle: true),
      body: Center(
        child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
          //Remove this constant
          const Text('Welcome',
              style: TextStyle(
                  color: Colors.white,
                  fontSize: 55,
                  fontWeight: FontWeight.bold)),
          // SizedBox(height: 20.0),
          const Text('To',
              style: TextStyle(
                  color: Colors.white,
                  fontSize: 35,
                  fontWeight: FontWeight.bold)),
          const SizedBox(height: 20.0),
          ScaleTransition(
              scale: animation,
              child:
                  SizedBox(child: Image.asset('images/logo.png', height: 200))),
          const SizedBox(height: 20.0),
          // Image.network('https://static.tvtropes.org/pmwiki/pub/images/popeye_logo.png')
          ElevatedButton(
              onPressed: () {},
              style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.white,
                  foregroundColor: Colors.red,
                  minimumSize: const Size(300, 40)),
              child: const Text('Show'))
        ]),
      ),
    );
  }
}

//------------------------------------------------------------------------------
klsxnrf1

klsxnrf11#

解决了!解决方案是只添加forward方法到控制器对象,如下所示:

controller.foward();

forward方法开始向前运行此动画(朝向结尾),因此动画在到达结尾时停止。

相关问题