80 篇文章 包含 "swiftUI"

什么是hero transition？还记得我们的商品列表有个图片，点击图片，然后图片慢慢变大，成为新界面顶部的header，我们称这种为hero transition。比如：appstroe中就很常见。

SwiftUI能够在view出现和消失时添加动画，我们称这个未transition。

本章，我们将演示如何创建自定义的出现和消失的transitions。

SwiftUI 允许 我们可以同时为多个属性设置动画，也可以使用不同的持续时间和不同的动画曲线对它们进行动画处理。

本章，我们将学习如何为两组特征设置动画，以及如何使结果看起来像一个单一的、平滑的动画。

创建动画有2中方式：

• 使用 .animation() 修饰符
• 使用 withAnimation 函数

上一章，我们介绍了用animation修饰符创建一组动画，本章我们将介绍用withAnimation函数结合delay创建一组动画。

目前已经是SwiftUI 3 了，但仍然无法将不同的动画连接在一起以创建一组动画。这肯定会在以后的 SwiftUI 版本中修复，但目前，我们可以使用延迟来实现一组动画。

我们知道，定义动画有两种方法：

• 使用.animation()修饰符
• 使用withAnimation函数

本章，我们将看到如何使用.animation()修饰符来创建一组动画，我们将在下一章中介绍withAnimation函数来创建一组动画。

我们将演示如何让一个banner做spring动画。

上一篇文章中我们知道了，Swiftui能够对一些通用属性进行动画，比如：位置、颜色、大小等。

但如果我们想要动画的东西不属于framework的一部分呢？

在这篇文章中，我们将创建一个三角形，其高度等于宽度乘以一个比例。当我们点击三角形时，我们将该比例设置为一个随机数，从而改变高度。

我们如何让SwiftUI 能够对比例的变化进行动画呢？我们将看到所需的代码很简单，但底层引擎却相当复杂。

我们来实现，将2个圆圈从顶部移动到底部。

我们知道饼图是一种通过使用形成圆圈的切片来表示比例数值的方法。饼图由一个切片和一个圆组成, 在 SwiftUI 中实现它们非常简单。

本章将显示用饼状图显示三个不同欧洲城市的宠物数量。

使用简单的形状，可以构建一些不错的功能。例如，只需使用一堆矩形，我们就可以创建一个柱状图。

本文，我们将创建一个条形图显示了三个欧洲城市的平均月降水量：都柏林、米兰和伦敦。