🎬 跨平台动画开发
30章 · 从小白到专家
✨ 友好色系
01
动画基础与核心概念
动画原理、帧率(FPS)、补间动画与关键帧动画、动画曲线(Easing)基础。
02
跨平台方案选型
原生动画(Android/iOS)、Web动画(CSS/JS)、Flutter、React Native、Unity对比。
03
CSS动画入门
transition过渡、transform变换、animation、@keyframes、性能与硬件加速。
04
JavaScript动画基础
requestAnimationFrame、setTimeout/setInterval对比、性能监控、缓动函数。
05
Canvas 2D动画
Canvas基础绘图、坐标系、状态管理、逐帧动画循环、粒子系统入门。
06
SVG动画
SMIL动画、CSS动画+SVG、路径动画、stroke-dasharray、交互式SVG。
07
WebGL与Three.js入门
3D场景、相机与光照、基本几何体、动画循环、轨道控制器。
08
Flutter动画基础
AnimationController、Tween、AnimatedBuilder、隐式动画、Hero动画。
09
Flutter高级动画
Staggered动画、自定义Painter、物理模拟、Rive集成、性能优化。
10
React Native动画
Animated API、LayoutAnimation、reanimated、手势+动画、原生驱动。
11
iOS原生动画
UIView动画块、Core Animation、CAKeyframeAnimation、CASpringAnimation、UIKit Dynamics。
12
Android原生动画
View动画、属性动画(ObjectAnimator)、AnimatorSet、矢量动画、过渡动画。
13
Lottie动画
Lottie文件格式、AE导出流程、跨平台集成(iOS/Android/Web/Flutter)、性能优化、动态颜色。
14
Rive动画
Rive编辑器、State Machine、跨平台运行时、交互式动画、游戏引擎结合。
15
动画性能优化
渲染管线、图层合成、重绘回流、GPU加速、Profile工具(Chrome/Xcode)。
16
手势驱动动画
拖拽、缩放、旋转、惯性滑动、边界回弹、手势冲突处理。
17
滚动驱动动画
Scroll-driven animations、视差滚动、Sticky Header、滚动进度条、列表动画。
18
路径动画
贝塞尔曲线、Catmull-Rom曲线、沿路径运动、路径绘制、路径变形。
19
物理引擎动画
Matter.js、Box2D、刚体、碰撞检测、约束、力与扭矩、布娃娃系统。
20
粒子系统
粒子生命周期、发射器、力场、纹理、颜色渐变、性能优化(对象池)。
21
骨骼动画
Spine、DragonBones、骨骼绑定、蒙皮、插槽、换装、动画混合。
22
UI动画与微交互
按钮反馈、加载指示器、骨架屏、过渡动画、动效设计原则。
23
数据可视化动画
D3.js、ECharts、Chart.js、过渡动画、数据更新动画、交互式图表。
24
游戏动画基础
Unity Animator、状态机、Blend Tree、动画层、IK(反向动力学)。
25
Shader动画
GLSL基础、顶点/片元着色器、UV动画、溶解效果、流光效果。
26
音频可视化动画
音频频谱分析、波形绘制、FFT、节奏同步、粒子与音频结合。
27
3D模型动画
glTF/FBX格式、骨骼动画播放、Blend Shapes、Morph Targets、动画重定向。
28
动画状态机
有限状态机(FSM)、分层状态机、状态转换条件、动画蓝图(Unreal)、实战。
29
动画测试与调试
时间轴调试、慢动作回放、可视化调试工具、自动化测试、性能基准测试。
30
动画工程化
动画库封装、CI/CD集成、资源管理、版本控制、团队协作、未来趋势。