创新互联Flutter教程：Flutter动画

动画类型

动画分为两类：基于tween或基于物理的。以下部分解释了这些术语的含义，并列出了一些相关的资源。 在一些情况下，我们最好的文档就是Flutter gallery中的示例代码。

创新互联服务项目包括高县网站建设、高县网站制作、高县网页制作以及高县网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，高县网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到高县省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！

补间(Tween)动画

“介于两者之间”的简称。在补间动画中，定义了开始点和结束点、时间线以及定义转换时间和速度的曲线。然后由框架计算如何从开始点过渡到结束点。

上面列出的文档Flutter动画教程 并不是专门介绍补间动画的，但在其示例中使用了补间动画。

基于物理的动画

在基于物理的动画中，运动被模拟为与真实世界的行为相似。例如，当你掷球时，它在何处落地，取决于抛球速度有多快、球有多重、距离地面有多远。 类似地，将连接在弹簧上的球落下（并弹起）与连接到绳子上的球放下的方式也是不同。

• Flutter Gallery在 Material Components , Grid 示例中演示了一个动画。从网格中选择其中一个图像并放大，然后您可以甩手或拖动平移图像。
• 另外请参阅 AnimationController.animateWith 和 SpringSimulation的文档

常见的动画模式

大多数UX或交互设计师发现在设计UI时有一些会经常使用的动画模式。本节列出了一些常用的动画模式，并告诉您可以在哪里了解更多。

动画列表或网格

此模式涉及在网格或列表中添加或删除元素时应用动画。

• AnimatedList 示例此演示来自示例程序目录，演示如何将元素添加到列表或删除选定元素。 在用户使用加号（+）和减号（ - ）按钮时修该并同步列表。

共享元素转换

在这种模式中，用户从页面中选择一个元素（通常是一个图像），然后打开所选元素的详情页面，在打开详情页时使用动画。 在Flutter中，您可以使用Hero widget 轻松实现路由（页面）之间的共享元素过渡动画。

• Hero 动画如何创建两种风格的 Hero 动画：在改变位置和大小的同时，hero从一页飞到另一页hero的边界从一个圆形变成一个正方形，同时它从一个页面飞到另一个页面
• Flutter Gallery 您可以自己构建Gallery应用程序，也可以从Play商店下载(中国不行)。 其中 Shrine演示了包括hero动画的一个例子。
• 另外请参阅 Hero, Navigator 和 PageRoute 类的API文档。

交错动画

动画被分解为较小的动作，其中一些动作被延迟。较小的动画可以是连续的，或者可以部分或完全重叠。

• 交错动画（Staggered Animations）  NEW

其它资源

在以下链接中了解更多关于Flutter动画的信息：

• 动画: 技术概述查看动画库中的一些主要类，以及Flutter的动画架构。
• 动画和运动（Motion） WidgetsFlutter提供的一些动画widget的目录

当前题目：创新互联Flutter教程：Flutter动画
当前URL：http://www.shufengxianlan.com/qtweb/news40/245090.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联