Android利用ScaleTransition实现吹气球动画
前言
这是最后一篇介绍如何使用基本动画组件的文章，我们继续 Transition 的动画，本篇来介绍 ScaleTransition。我们在之前的文章介绍过使用 Animation 和 AnimationController 来实现组件的缩放，那是通过更改图片的尺寸实现的，具体可以参考：Flutter 实现爱心三连动画。
而对于只需要放大或缩小的场合，可以直接使用 ScaleTransition 来完成，例如我们本篇实现了一个气球从小到大，感觉像被用力吹起来一样的动画效果。
balloon.gif
ScaleTransition 介绍
ScaleTransition 的使用非常简单，只有三个参数，构造方法定义如下。
const ScaleTransition({
Key? key,
required Animation<double> scale,
this.alignment = Alignment.center,
this.child,
})
参数对应的说明如下：
scale：即组件的缩放尺寸，为 Animation 对象，组件实际的尺寸等于组件的实际尺寸乘以该对象的值。。alignment：即缩放的起始对齐位置，通过这个参数可以控制组件的缩放方向，比如我们的气球就是从bottomCenter开始缩放的，这样气球嘴那边感觉没有动一样。child：要缩放的子组件。
应用
我们要实现的气球动画非常简单，找一张气球图片 (推荐一个找免费 png 图素材的国外网站：https://www.pngpix.com）。然后使用一个 Animation 对象控制缩放的时间和大小即可。因为气球后面越来越难吹，因此我们将曲线设置为 easeOut（先快后慢），源代码如下：
class ScaleTransitionDemo extends StatefulWidget {
ScaleTransitionDemo({Key? key}) : super(key: key);
@override
_ScaleTransitionDemoState createState() => _ScaleTransitionDemoState();
}
class _ScaleTransitionDemoState extends State<ScaleTransitionDemo>
with SingleTickerProviderStateMixin {
late AnimationController _controller =
AnimationController(duration: const Duration(seconds: 10), vsync: this)
..repeat();
//使用自定义曲线动画过渡效果
late Animation<double> _animation =
CurvedAnimation(parent: _controller, curve: Curves.easeOut);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('ScaleTransition'),
brightness: Brightness.dark,
backgroundColor: Colors.blue,
),
body: Center(
child: balloon(),
),
);
}
@override
void dispose() {
_controller.stop();
_controller.dispose();
super.dispose();
}
Widget balloon() {
return ScaleTransition(
alignment: Alignment.bottomCenter,
child: Image.asset(
'images/balloon.png',
),
scale: _animation,
);
}
}
总结
本篇介绍了使用 ScaleTransition 控制组件尺寸实现类似吹气球的动画。ScaleTransition 的实际应用有不少，例如点击图片查看大图、缩小转场切换、以及镜头从近拉到远或从远处走过来的那种感觉等等。有兴趣的可以自己尝试一些有趣的动画 —— 毕竟玩动画比单纯写界面更有趣一些！
以上就是Android利用ScaleTransition实现吹气球动画的详细内容，更多关于Android 吹气球动画的资料请关注脚本之家其它相关文
相关文章
这篇文章主要为大家详细介绍了Android使用广播发送消息，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
这篇文章主要介绍了HandlerThread的使用场景和用法详解,HandlerThread是Android中的一个线程类，它是Thread的子类，并且内部封装了Looper和Handler，提供了更方便的消息处理和线程操作,需要的朋友可以参考下2023-07-07
这篇文章主要为大家介绍了Compose 的 Navigation组件使用示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
okhttp3.4.1+retrofit2.1.0实现离线缓存的示例
本篇文章主要介绍了okhttp3.4.1+retrofit2.1.0实现离线缓存的示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-12-12
这篇文章主要介绍了Android应用开发中Activity类的用法,包括Activity间的数据传递以及Activity的创建方式等,需要的朋友可以参考下2016-02-02
Android App开发中使用RecyclerView实现Gallery画廊的实例
这篇文章主要介绍了Android App开发中使用RecyclerView实现Gallery画廊的实例,比普通的ListView实现的效果更为强大,需要的朋友可以参考下2016-04-04
Android通过自定义ImageView控件实现图片的缩放和拖动的实现代码
通过自定义ImageView控件，在xml布局里面调用自定的组件实现图片的缩放。下面给大家分享实现代码，感兴趣的朋友一起看看吧2016-10-10
这篇文章主要为大家介绍了Android 13的新功能及需要哪些适配工作详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-03-03
使用Android系统提供的DownloadManager来下载文件
本篇文章主要介绍了使用Android系统提供的DownloadManager来下载文件，可以将长时间的下载任务交给系统，完全由系统管理，有需要的可以了解下。2016-11-11
Android App中使用RatingBar实现星级打分功能的教程
这篇文章主要介绍了Android App中使用RatingBar实现星级打分功能的教程,文中举了一个使用SeekBar与RatingBar制作的应用内打分条的功能,非常简单,需要的朋友可以参考下2016-04-04
最新评论