您的位置:首页 > 移动开发 > Android开发

Android加载动画系列——GearsTwoLoadingAnim

2016-07-30 20:06 459 查看
Android加载动画系列——GearsTwoLoadingAnim

前面我们实现过IOS升级的齿轮转动动画,今天就让我们来实现两个齿轮的传动动画吧~
让我们先来看看效果图:



1、GearsTwoLoadingAnim.java源码如下:

publicclassGearsTwoLoadingAnimextendsView{
privatefloatmWidth=0f;
privatePaintmPaint,mPaintAxle;
privatePaintmPaintRing;

privatefloatmPadding=0f;
privatefloatmWheelLength;//齿轮高度

privateintmWheelSmallSpace=10;
privateintmWheelBigSpace=8;

ValueAnimatorvalueAnimator=null;
floatmAnimatedValue=0f;
floathypotenuse=0f;
floatsmallRingCenterX=0f;
floatsmallRingCenterY=0f;
floatbigRingCenterX=0f;
floatbigRingCenterY=0f;

publicGearsTwoLoadingAnim(Contextcontext){
this(context,null);
}

publicGearsTwoLoadingAnim(Contextcontext,AttributeSetattrs){
this(context,attrs,0);
}

publicGearsTwoLoadingAnim(Contextcontext,AttributeSetattrs,intdefStyleAttr){
super(context,attrs,defStyleAttr);
initPaint();
}

@Override
protectedvoidonMeasure(intwidthMeasureSpec,intheightMeasureSpec){
super.onMeasure(widthMeasureSpec,heightMeasureSpec);
if(getMeasuredWidth()>getHeight())
mWidth=getMeasuredHeight();
else
mWidth=getMeasuredWidth();
}

privatevoiddrawSmallRing(Canvascanvas){
hypotenuse=(float)(mWidth*Math.sqrt(2));
smallRingCenterX=(float)((hypotenuse/6.f)*Math.cos(45*Math.PI/180f));
smallRingCenterY=(float)((hypotenuse/6.f)*Math.sin(45*Math.PI/180f));
mPaintRing.setStrokeWidth(dip2px(1.0f));
canvas.drawCircle(mPadding+smallRingCenterX,smallRingCenterY+mPadding,smallRingCenterX,mPaintRing);
mPaintRing.setStrokeWidth(dip2px(1.5f));
canvas.drawCircle(mPadding+smallRingCenterX,smallRingCenterY+mPadding,smallRingCenterX/2,mPaintRing);
}

privatevoiddrawSmallGear(Canvascanvas){
mPaint.setStrokeWidth(dip2px(1));
for(inti=0;i<360;i=i+mWheelSmallSpace){
intangle=(int)(mAnimatedValue*mWheelSmallSpace+i);
floatx3=(float)((smallRingCenterX)*Math.cos(angle*Math.PI
/180f));
floaty3=(float)((smallRingCenterX)*Math.sin(angle*Math.PI
/180f));
floatx4=(float)((smallRingCenterX+mWheelLength)*Math.cos(angle*Math.PI/180f));
floaty4=(float)((smallRingCenterX+mWheelLength)*Math.sin(angle*Math.PI/180f));
canvas.drawLine(mPadding+smallRingCenterX-x4,smallRingCenterY+mPadding-y4,
smallRingCenterX+mPadding-x3,smallRingCenterY+mPadding-y3,mPaint);
}
}

privatevoiddrawBigGear(Canvascanvas){
bigRingCenterX=(float)((hypotenuse/2.f)*Math.cos(45*Math.PI/180f));
bigRingCenterY=(float)((hypotenuse/2.f)*Math.sin(45*Math.PI/180f));
floatstrokeWidth=dip2px(1.5f)/4;
mPaint.setStrokeWidth(dip2px(1.5f));
for(inti=0;i<360;i=i+mWheelBigSpace){
intangle=(int)(360-(mAnimatedValue*mWheelBigSpace+i));
floatx3=(float)((bigRingCenterX-smallRingCenterX)*Math.cos(angle*Math.PI/180f));
floaty3=(float)((bigRingCenterX-smallRingCenterX)*Math.sin(angle*Math.PI/180f));
floatx4=(float)((bigRingCenterX-smallRingCenterX+mWheelLength)*Math.cos(angle*Math.PI/180f));
floaty4=(float)((bigRingCenterX-smallRingCenterX+mWheelLength)*Math.sin(angle*Math.PI/180f));
canvas.drawLine(
bigRingCenterX+mPadding-x4+mWheelLength*2+strokeWidth,
bigRingCenterX+mPadding-y4+mWheelLength*2+strokeWidth,
bigRingCenterX+mPadding-x3+mWheelLength*2+strokeWidth,
bigRingCenterX+mPadding-y3+mWheelLength*2+strokeWidth,
mPaint);
}
}

privatevoiddrawBigRing(Canvascanvas){
floatstrokeWidth=dip2px(1.5f)/4;
mPaintRing.setStrokeWidth(dip2px(1.5f));
canvas.drawCircle(bigRingCenterX+mPadding+mWheelLength*2+strokeWidth,
bigRingCenterY+mPadding+mWheelLength*2+strokeWidth,
bigRingCenterX-smallRingCenterX-strokeWidth,mPaintRing);
mPaintRing.setStrokeWidth(dip2px(1.5f));
canvas.drawCircle(bigRingCenterX+mPadding+mWheelLength*2+strokeWidth,
bigRingCenterY+mPadding+mWheelLength*2+strokeWidth,
(bigRingCenterX-smallRingCenterX)/2-strokeWidth,mPaintRing);
}

privatevoiddrawAxle(Canvascanvas){
for(inti=0;i<3;i++){
floatx3=(float)((smallRingCenterX)*Math.cos(i*(360/3)*Math.PI/180f));
floaty3=(float)((smallRingCenterX)*Math.sin(i*(360/3)*Math.PI/180f));
canvas.drawLine(mPadding+smallRingCenterX,
mPadding+smallRingCenterY,
mPadding+smallRingCenterX-x3,
mPadding+smallRingCenterY-y3,mPaintAxle);
}

for(inti=0;i<3;i++){
floatx3=(float)((bigRingCenterX-smallRingCenterX)*Math.cos(i*(360/3)*Math.PI/180f));
floaty3=(float)((bigRingCenterX-smallRingCenterX)*Math.sin(i*(360/3)*Math.PI/180f));
canvas.drawLine(bigRingCenterX+mPadding+mWheelLength*2,
bigRingCenterY+mPadding+mWheelLength*2,
bigRingCenterX+mPadding+mWheelLength*2-x3,
bigRingCenterX+mPadding+mWheelLength*2-y3,mPaintAxle);
}
}

@Override
protectedvoidonDraw(Canvascanvas){
super.onDraw(canvas);
canvas.save();
canvas.rotate(180,mWidth/2,mWidth/2);
drawSmallRing(canvas);
drawSmallGear(canvas);
drawBigGear(canvas);
drawBigRing(canvas);
drawAxle(canvas);
canvas.restore();
}

privatevoidinitPaint(){
mPaintRing=newPaint();
mPaintRing.setAntiAlias(true);
mPaintRing.setStyle(Paint.Style.STROKE);
mPaintRing.setColor(Color.WHITE);
mPaintRing.setStrokeWidth(dip2px(1.5f));

mPaint=newPaint();
mPaint.setAntiAlias(true);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setColor(Color.WHITE);
mPaint.setStrokeWidth(dip2px(1));

mPaintAxle=newPaint();
mPaintAxle.setAntiAlias(true);
mPaintAxle.setStyle(Paint.Style.FILL);
mPaintAxle.setColor(Color.WHITE);
mPaintAxle.setStrokeWidth(dip2px(1.5f));

mPadding=dip2px(5);
mWheelLength=dip2px(2f);
}

publicvoidstopAnim(){
if(valueAnimator!=null){
clearAnimation();
valueAnimator.setRepeatCount(0);
valueAnimator.cancel();
valueAnimator.end();
postInvalidate();
}
}

privateValueAnimatorstartViewAnim(floatstartF,floatendF,longtime){
valueAnimator=ValueAnimator.ofFloat(startF,endF);
valueAnimator.setDuration(time);
valueAnimator.setInterpolator(newLinearInterpolator());
valueAnimator.setRepeatCount(ValueAnimator.INFINITE);
valueAnimator.setRepeatMode(ValueAnimator.RESTART);
valueAnimator.addUpdateListener(newValueAnimator.AnimatorUpdateListener(){
@Override
publicvoidonAnimationUpdate(ValueAnimatoranimation){
mAnimatedValue=(float)valueAnimator.getAnimatedValue();
postInvalidate();
}
});

valueAnimator.addListener(newAnimatorListenerAdapter(){
@Override
publicvoidonAnimationEnd(Animatoranimation){
super.onAnimationEnd(animation);
}

@Override
publicvoidonAnimationRepeat(Animatoranimation){
super.onAnimationRepeat(animation);
}

@Override
publicvoidonAnimationStart(Animatoranimation){
super.onAnimationStart(animation);
}
});

if(!valueAnimator.isRunning()){
valueAnimator.start();
}
returnvalueAnimator;
}

publicvoidstartAnim(){
stopAnim();
startViewAnim(0f,1f,300);
}

publicintdip2px(floatdpValue){
finalfloatscale=getContext().getResources().getDisplayMetrics().density;
return(int)(dpValue*scale+0.5f);
}
}



2、接着在layout布局文件中使用我们自定义的动画控件

<com.cyril.loadinganim.GearsTwoLoadingAnim
android:id="@+id/geartwoloading"
android:layout_width="80dp"
android:layout_height="80dp"
/>


3、然后在Activity中实现动画的播放和停止,使用事例如下:


gearsTwoLoadingAnim=(GearsTwoLoadingAnim)findViewById(R.id.geartwoloading);
gearsTwoLoadingAnim.startAnim();


4、戳这里,小编带你去源码的下载地址:http://download.csdn.net/detail/zhimingshangyan/9582830
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息