有人可以帮助一个规模的动画,正在试图执行。我想实现的是一个规模的图像动画,我已经设法规模动画,但我希望它停止一个图像是完全缩放。如果我使用停止方法的动画控制器上的图像不显示,我怎么能停止动画后,图像已完全缩放?
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'))
]),
),
);
}
}
//------------------------------------------------------------------------------
1条答案
按热度按时间klsxnrf11#
解决了!解决方案是只添加forward方法到控制器对象,如下所示:
forward方法开始向前运行此动画(朝向结尾),因此动画在到达结尾时停止。