一、demo简介

1.效果展示如下图，我截了三个瞬间，但其实这是一个连续的动画，就是这个大圆不停地吞下小圆。

2.这个动画可以拆分为两部分，首先是大圆张嘴闭嘴的动画，相当于画一个圆弧，规定一下它的角度就好。小圆就是一个从右向左移动的动画。然后不停地刷新界面，让动画的持续时间为永恒，这样就会有一个持续的动态效果。

二、分析贪吃动画的尺寸比例

1.在制作动画之前，我们要先建一个模型，来确定一下大圆和小圆的比例。这个比例是自己设置的，可以自行修改。下图是画布的宽度大于高度的情况。

r = minheight /6

cx = (width - minwidth)/2 + 3r

cy = height/2

还有一种是画布宽度小于高度的情况，如下图所示：这个时候

6r+0.5r+2r = minwidth。 r = minwidth /8.5

cx = 3r

cy =height/2

2.确定了大圆圆心坐标之后，小圆的圆心坐标也可以知道了。

三、画圆

1.先创建一个类继承自view，并实现其对应的构造方法

2.定义一下大圆（嘴）的半径(3r)，小圆的半径(r)以及两圆之间的间距(0.5r)，还有嘴的圆心坐标

3. 在onsizechanged方法里面计算尺寸。

4.提供一个画笔

5.在ondraw方法里面画一个圆

6.在xml文件里面添加这个自定义类

7.如果用上面的方法来画圆，会出现一些bug，如下图所示

这是因为，当宽度大于高度时，r= height/6。如果r过小，那么圆心的坐标就会偏左，那么就会有一部份圆出界。为了避免这种情况发生，无论什么情况下，都把r设置为最小的那个/8.5。

8.重新计算一下半径

四、实现张嘴闭嘴动画

1.张嘴相当于画了一个弧，画弧需要确定一个矩形区域——即大圆所在的矩形。还需要设置一个角度，也就是弧度。绘制出来如下图所示。

image.png

2.这是一个静态的过程，想让它变成动态的话，只需要一直修改嘴张开的角度即可。所以我们定义一个动画因子，作为弧度

3.然后在ondraw方法里面，把死数据改为我们动画因子即可。

4.添加两个按钮，来显示动画和暂停动画。当点击按钮时，实现对应的点击事件。

5.所以在mouseloadingview类里面提供几个方法给外部调用

6.createanimator()是创建动画的函数。从0-45-0的是动画因子的变化，监听一下动画执行的过程，不断刷新动画因子的数值，然后刷新界面。

7.因为动画效果有很多，所以我们要用一个数组来保存所有的动画

8.添加几个启动和结束动画的方法

五、小球移动动画

1.创建一个小球，然后让它从右边向左边移动即可。小球圆心的x坐标在不断改变，y坐标与大圆一样。所以我们要给小球设置一个移动的动画因子。

2.然后在ondraw()方法里面绘制小球

3.之后，在createanimator()方法里面添加小球的动画。让小球移动的距离从4.5r到0，也就是直到小圆与大圆重合。

4.在mainactivity里面添加按钮的点击事件

差不多就这些内容。自定义加载动画的难点，主要在于找到动画因子。

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。