最近在一个项目中需要一个像QQ打开个人爱好那样的动画效果如下图:
![](https://camo.githubusercontent.com/05eaec2241b11fb3afb82a3babcf10d198e307a8472d992349c3a32e49efa17e/687474703a2f2f692e696d6775722e636f6d2f6b67614d4261732e676966)
可以看出每个小球都是以顺时针旋转出来的,说明像这样的曲线动画用Android中自带的平移动画是很难实现的。###
我们先来看看Android自带的绘制曲线的方式是怎样的:
android自定义View中画图经常用到这几个什么什么To
moveTo 不会进行绘制,只用于移动移动画笔,也就是确定绘制的起始坐标点。结合以下方法进行使用。
mPath.lineTo(300, 300);
canvas.drawPath(mPath, mPaint);
![](https://camo.githubusercontent.com/922be5e989d1e22da1a185d76d49b9d831076883b8df69f8fcf0ae53af6516d8/687474703a2f2f692e696d6775722e636f6d2f67766d6b7850742e706e67)
mPath.moveTo(100, 100);
mPath.lineTo(300, 300);
canvas.drawPath(mPath, mPaint);
把画笔移动(100,100)处开始绘制,效果如图:
![](https://camo.githubusercontent.com/f23737efc8793e7046b93718cad7f91525f172c9ef6a8a0a1af3fbd743bc2942/687474703a2f2f692e696d6775722e636f6d2f6c4d48614676442e706e67)
![](https://camo.githubusercontent.com/9208c05e2d8aa59973805dbd00e81a268078787dc80410599a94faa313addb6d/687474703a2f2f692e696d6775722e636f6d2f723079644b6b782e706e67)
cubicTo 同样是用来实现贝塞尔曲线的。mPath.cubicTo(x1, y1, x2, y2, x3, y3) (x1,y1) 为控制点,(x2,y2)为控制点,(x3,y3) 为结束点。那么,cubicTo 和 quadTo 有什么不一样呢?说白了,就是多了一个控制点而已。然后,我们想绘制和上一个一样的曲线,应该怎么写呢?
mPath.moveTo(100, 500);
mPath.cubicTo(100, 500, 300, 100, 600, 500);
![](https://camo.githubusercontent.com/8aabb8ed3c27659a9cbee1f4b4850e9da9c6a432284f4848e3af897462660b13/687474703a2f2f692e696d6775722e636f6d2f62575450736f5a2e706e67)
则以(0,0)为起点,(100,500)和(300,100)为控制点绘制贝塞尔曲线:
![](https://camo.githubusercontent.com/2aae04bb318024ed9cf3bdbee1cca32072bf9d21519068e7c81d80e2cb66fb13/687474703a2f2f692e696d6775722e636f6d2f617a48376455542e706e67)
受到上面的启发,我们也可以用同样的方法来实现一个曲线动画框架
在数学的数值分析领域中,贝塞尔曲线(英语:Bézier curve)是计算机图形学中相当重要的参数曲线。更高维度的广泛化贝塞尔曲线就称作贝塞尔曲面,其中贝塞尔三角是一种特殊的实例。
贝塞尔曲线于1962年,由法国工程师皮埃尔·贝塞尔(Pierre Bézier)所广泛发表,他运用贝塞尔曲线来为汽车的主体进行设计。贝塞尔曲线最初由Paul de Casteljau于1959年运用de Casteljau算法开发,以稳定数值的方法求出贝塞尔曲线。
给定点P0、P1,线性贝塞尔曲线只是一条两点之间的直线。这条线由下式给出:
![](https://camo.githubusercontent.com/8e4bee0e85f9d5072eba81494ca1cc6a7c5d15de88d7ff0e3b4a3fd490d4466c/687474703a2f2f692e696d6775722e636f6d2f70415145675a352e676966)
二次方贝塞尔曲线的路径由给定点P0、P1、P2的函数B(t)追踪:
![](https://camo.githubusercontent.com/9bf81890f9563ede1605c5a742e3f6daf5173ad7e3878b5398f3730fdfd00f23/687474703a2f2f692e696d6775722e636f6d2f326f6179626e712e676966)
P0、P1、P2、P3四个点在平面或在三维空间中定义了三次方贝塞尔曲线。曲线起始于P0走向P1,并从P2的方向来到P3。一般不会经过P1或P2;这两个点只是在那里提供方向资讯。P0和P1之间的间距,决定了曲线在转而趋进P2之前,走向P1方向的“长度有多长”。
![](https://camo.githubusercontent.com/7ad69c9edec2844210463baba20a0bc66a55f8c1c8a25031d142038a8cae5555/687474703a2f2f692e696d6775722e636f6d2f37515a5a6546592e676966)
以上都是维基百科给出的定义,以及不同曲线的公式和效果图; 如果不清楚可以自己百度搜索或者维基百科搜索,么么哒!
![](https://camo.githubusercontent.com/ac3804d7d25e0007ba49b65d7d73a8b455a0f7752e7a04a195168d6e5be4c89e/687474703a2f2f692e696d6775722e636f6d2f6b3444747636432e676966)
![](https://camo.githubusercontent.com/75cf3b50974dcf9cb5dd331054898eabf37b86669c044f2447389bab30ab43d4/687474703a2f2f692e696d6775722e636f6d2f596752466362522e706e67)
记录一下,方便以后使用,完事了额! 如果喜欢我的博客可以直接下面:##
http://blog.csdn.net/qq_23179075