Spruce-iOS动画库：优雅实现多视图动画编排

薛曦旖Francesca

于 2025-06-11 09:14:05 发布

阅读量365

点赞数 3

本文链接：https://blog.csdn.net/gitblog_00264/article/details/148577654

版权

Spruce-iOS动画库：优雅实现多视图动画编排

spruce-ios Swift library for choreographing animations on the screen. 项目地址: https://gitcode.com/gh_mirrors/sp/spruce-ios

什么是Spruce-iOS？

Spruce是一个轻量级的iOS动画编排库，它能帮助开发者优雅地协调屏幕上多个视图的动画效果。在移动应用开发中，当设计师提出复杂的多视图动画需求时，开发者往往需要花费大量时间确保每个视图在正确的时间执行动画。Spruce正是为解决这个问题而生，它让开发者能够轻松实现设计师的动画构想。

核心特性

多视图动画编排：轻松协调多个视图的动画时序
丰富的预置动画：包含淡入淡出、缩放、滑动等常见动画效果
灵活的排序策略：提供8种内置的视图动画排序方式
高度可定制：支持自定义动画效果和排序逻辑
简洁的API设计：通过UIView扩展提供直观的调用方式

快速入门

基本使用示例

假设我们需要让一组视图执行淡入并轻微放大的动画效果：

// 定义动画组合
let animations: [StockAnimation] = [.fadeIn, .expand(.slightly)]

// 准备动画（设置初始状态）
yourView.spruce.prepare(animations)

// 执行动画
yourView.spruce.animate(animations)

使用排序函数

Spruce提供了多种排序函数(SortFunction)来控制子视图的动画顺序：

// 创建一个从上到下线性排序的函数，视图间延迟0.1秒
let sortFunction = LinearSortFunction(direction: .topToBottom, interObjectDelay: 0.1)

// 使用排序函数执行动画
yourView.spruce.animate([.fadeIn, .expand(.slightly)], sortFunction: sortFunction)

内置排序函数类型

Spruce提供了多种排序策略供选择：

LinearSortFunction：线性排序（上下左右四个方向）
RadialSortFunction：径向排序（圆形扩散）
InlineSortFunction：内联排序（类似文字排列）
CorneredSortFunction：从指定角落开始排序
RandomSortFunction：随机排序
ContinuousSortFunction：连续排序（基于视图位置）
ContinuousWeightedSortFunction：带权重的连续排序
DefaultSortFunction：默认排序（无特定顺序）

创建自定义动画

虽然Spruce提供了丰富的内置动画，但创建自定义动画也非常简单：

// 1. 定义准备处理程序（设置初始状态）
let prepareHandler = { view in
    view.transform = CGAffineTransform(scaleX: 0.1, y: 0.1)
}

// 2. 定义变化函数（设置动画目标状态）
let changeFunction = { view in
    view.transform = CGAffineTransform(scaleX: 1.5, y: 1.5)
}

// 3. 创建自定义动画
let animation = StockAnimation.custom(
    prepareFunction: prepareHandler,
    animateFunction: changeFunction
)

// 4. 执行动画
yourView.spruce.animate([animation])