如何用android制作动画（动画制作-架构师详解表白动画制作）

情人节过去有那么几天了，有些人在考虑，情人节那天应该赠送什么礼物才会让女神关注我了，才有机会约饭了，今天教大家一个小技能，能帮助大家在情人节或者其他的节日成功表白，约会；

同时，在给大家分享之前，这里推荐下我自己建的Android技术分享群 ：653961128，不管你是小白还是大牛，小编我都挺欢迎，不定期分享干货，包括2017最新的Android企业案例学习资料和零基础入门教程，欢迎初学和进阶中的小伙伴，大家一起交流学习，共同进步。

我们先看一下效果图：

那么这个效果是怎么样制作的，先给大家介绍一下原理

数据的准备

• getBranches()函数中，定义各个树枝的位置和形状，最终返回树干。

• 绘制的时候，先绘制树干，然后绘制其分支，最后绘制分支的分支（只有三层）。

封装Branch类

• 主要包含分支的构建（构造函数，addChild函数），以及绘制。

• 绘制分支时，不断地调用grow函数，绘制点（currLen)逐渐靠近末端（maxLen), 分支的半径逐渐变小；

• 最终控制点到达分支末端（currLen==maxLen), 绘制结束。

• 如果是绘制静态画面，while循环直到grow返回false;

• 如果是绘制动画， 可通过调用postInvalidate()，不断地对回调绘制函数, 每一帧树枝成长一截。

树干效果图如下：

二、花瓣

• 花瓣的绘制，是通过一条曲线实现的：本文的主角，自带爱情故事的心形线。

• 心形线有很多种，有的用普通方程表示，有的用参数方程表示。

• 对于绘制曲线来说，参数方程更方便一些。

• 在网站wolframalpha上，可以输入方程直接预览曲线。

计算心形线

• 因为要绘制很多花瓣，所以可以将其形状预先计算好，缓存起来。

• 或许是因为精度的原因， 如果直接采样上图的点，绘制时如果有scale(缩放）操作，可能会显示不平滑；

• 所以在采样心形线的点时我们放大一定比率(SCALE_FACTOR )。

• 就像一张图片，如果分辨率是200x200， 缩小到100x100显示，图片还是清晰的，如果放大到400x400，可能会模糊。

封装Bloom类

• 一片花瓣，除了形状之外，还有方位，颜色，方向，大小等参数。

• 故此，和Branch一样，封装了一个类。

• 花瓣的颜色和方向参数是随机初始化的。

• 颜色方面，ARGB中Red通道固定为最大值0xff, 效果就是花瓣的颜色为红，紫，黄，白等。

• 因为要适应移动设备的多分辨率，所以一些参数要根据分辨率来动态设置。

三、树冠

• 树冠是由数百片花瓣构成，关键点在于确定这些花瓣的位置。

• 这里用到另一条心形线(x^2 y^2 -1)^3 - x^2 * y^3 = 0。

• 我们需要做的，是在心形内部选取位置，而非绘制曲线，故此，普通方程相对于参数方程更合适。

• 坐标系中的点(x,y), 计算ax by, 大于0和小于0分别在直线的两侧， x^2 y^2 - r 则分别在圆外和圆内；

• 这个现象还蛮奇妙的，虽然我不知道这在数学中叫什么-_-。

• 类似的，在x=[-c, c], y=[-c,c]的范围内随机选取(x^2 y^2 -1)^3 - x^2 * y^3<0的点，即可使得花瓣的位置错落与心形线中。

绘制动画

• 简单地说，不断地触发onDraw(Canvas canvas)回调，在每一帧里面，变换绘制参数，就形动画了。

• 在这个例子中，划分了几个动画阶段，每个阶段各自变化自己的参数。

• 总之，就是分而治之，然后串联起来。

连接起来最后的效果图：