Android实现纸飞机的简单操作
在项目中,我们要求做一个纸飞机的功能:就是当打开这个界面时,会有4架纸飞机从屏幕左侧飞入,然后到达自己的位置坐上下浮动,同时云彩也不断地从屏幕右侧飘到屏幕左侧。当你点击其中一个纸飞机时,这个纸飞机先向上飞出屏幕外,再从左侧飞入,当飞机回到原来位置时,弹出一个消息框。下面直接上代码:
一、首先自定义一个RelativeLayout,主要目的就是制作飞机的进入动画:
publicclassPaperPlaneLayoutextendsRelativeLayoutimplementsView.OnClickListener{
privateOnClickListenermOnClickListener;
//自定义布局的宽、高
privateintmHeight;
privateintmWidth;
privateLayoutParamslp;
privateDrawable[]drawables;
privateRandomrandom=newRandom();
//获取4架纸飞机的宽高
privateintdHeight;
privateintdWidth;
privateintmX;
privateintmY;
publicPaperPlaneLayout(Contextcontext){
super(context);
init();
}
publicPaperPlaneLayout(Contextcontext,
AttributeSetattrs){
super(context,attrs);
init();
}
publicPaperPlaneLayout(Contextcontext,
AttributeSetattrs,intdefStyleAttr){
super(context,attrs,defStyleAttr);
init();
}
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
publicPaperPlaneLayout(Contextcontext,
AttributeSetattrs,intdefStyleAttr,intdefStyleRes){
super(context,attrs,defStyleAttr,defStyleRes);
init();
}
privatevoidinit(){
//初始化显示的图片
drawables=newDrawable[4];
Drawablepink=
getResources().getDrawable(R.drawable.pl_pink);
Drawableyellow=
getResources().getDrawable(R.drawable.pl_yellow);
Drawablegreen=
getResources().getDrawable(R.drawable.pl_green);
Drawableblue=
getResources().getDrawable(R.drawable.pl_blue);
drawables[0]=blue;
drawables[1]=yellow;
drawables[2]=green;
drawables[3]=pink;
//获取图的宽高用于后面的计算
//注意我这里4张图片的大小都是一样的,所以我只取了一个
dHeight=UIUtility.dipTopx(getContext(),80);
dWidth=UIUtility.dipTopx(getContext(),80);
lp=newLayoutParams(dWidth,dHeight);
}
@Override
protectedvoidonMeasure(intwidthMeasureSpec,
intheightMeasureSpec){
super.onMeasure(widthMeasureSpec,heightMeasureSpec);
mWidth=getMeasuredWidth();
mHeight=getMeasuredHeight();
}
//真正动画开始的入口,从外部进行调用,x、y分别表示飞机进入之后所
//停留的位置坐标
publicvoidaddHeart(intx,inty,intposition){
mX=x;
mY=y;
ImageViewimageView=newImageView(getContext());
//随机选一个
imageView.setImageDrawable(drawables[position]);
imageView.setLayoutParams(lp);
addView(imageView);
//获取进入前后动画
Animatorset=getAnimator(imageView);
set.start();
imageView.setOnClickListener(this);
}
privateAnimatorgetAnimator(Viewtarget){
AnimatorSetset=getEnterAnimator(target);
AnimatorSetset2=getLineAnimation(target);
AnimatorSetfinalSet=newAnimatorSet();
finalSet.playSequentially(set,set2);
finalSet.setInterpolator(newLinearInterpolator());
finalSet.setTarget(target);
returnfinalSet;
}
privateAnimatorSetgetEnterAnimator(finalViewtarget){
ObjectAnimatoralpha=ObjectAnimator
.ofFloat(target,View.ALPHA,0.2f,1f);
ObjectAnimatortranslationX=ObjectAnimator
.ofFloat(target,View.TRANSLATION_X,
-2*mWidth,-mWidth);
AnimatorSetenter=newAnimatorSet();
enter.setDuration(500);
enter.setInterpolator(newLinearInterpolator());
enter.playTogether(translationX,alpha);
enter.setTarget(target);
returnenter;
}
privateAnimatorSetgetLineAnimation(finalViewiconView){
ObjectAnimatortransX=ObjectAnimator
.ofFloat(iconView,"translationX",-dWidth,mX);
ObjectAnimatortransY=ObjectAnimator
.ofFloat(iconView,"translationY",
(mHeight-dHeight)/2,mY);
transY.
setInterpolator(PathInterpolatorCompat
.create(0.7f,1f));
AnimatorSetflyUpAnim=newAnimatorSet();
flyUpAnim.setDuration(900);
flyUpAnim.playTogether(transX,transY);
flyUpAnim.setTarget(iconView);
returnflyUpAnim;
}
@Override
publicvoidonClick(Viewv){
if(mOnClickListener!=null){
mOnClickListener.onClick((ImageView)v);
}
}
//定义ImageView单击事件
publicinterfaceOnClickListener{
voidonClick(ImageViewv);
}
二、接下来就是布局文件的搭建了(只选取一部分控件)
三、接下来就可以在Activity中使用了:
publicclassPlaneActivityextendsAppCompatActivity{
@Bind(R.id.img_white_cloud)
ImageViewmImgWhiteCloud;
@Bind(R.id.plane_layout)
PaperPlaneLayoutmPlaneLayout;
privateContextmContext;
privateObjectAnimatorobjCloudAnim;
privateTranslateAnimationplaneAnimation;
privatefloaticonX,iconY;
//设置飞机是否已点击,如果为true,则另一个飞机不可点击
privatebooleanmIsClick=true;
@Override
protectedvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_plane_layout);
ButterKnife.bind(this);
mContext=getApplicationContext();
//初始化动画
initAnimation();
initListener();
}
privatevoidinitAnimation(){
//设定纸飞机进入的位置
initPlaneEnterAnimation();
//飞机进入后做上下浮动
initPlaneAnimation();
//云彩循环从屏幕右侧飘到屏幕左侧
initCloudAnimation();
}
//设定纸飞机进入的位置
privatevoidinitPlaneEnterAnimation(){
for(inti=0;i<4;i++){
finalinttemp=i;
mPlaneLayout.post(newRunnable(){
@Override
publicvoidrun(){
//下面的值根据用户自己设定
if(temp==0){
mPlaneLayout.addHeart(
100dp,140dp,0);
}
if(temp==1){
mPlaneLayout.addHeart(
屏宽-120dp,190dp,1);
}
if(temp==2){
mPlaneLayout.addHeart(
30dp,240dp,2);
}
if(temp==3){
mPlaneLayout.addHeart(
屏宽-210,290,3);
}
}
});
}
}
//飞机进入后做上下浮动
privatevoidinitPlaneAnimation(){
planeAnimation=newTranslateAnimation(0,0,-10,10);
planeAnimation.setDuration(1000);
planeAnimation.setRepeatCount(Animation.INFINITE);
planeAnimation.setRepeatMode(Animation.REVERSE);
mPlaneLayout.setAnimation(planeAnimation);
planeAnimation.start();
}
//云彩循环从屏幕右侧飘到屏幕左侧
privatevoidinitCloudAnimation(){
if(objCloudAnim==null){
objCloudAnim=ObjectAnimator
.ofFloat(mImgWhiteCloud,"translationX",
屏宽-50,-屏宽);
//设置持续时间
objCloudAnim.setDuration(5000);
//设置循环播放
objCloudAnim.setRepeatCount(
ObjectAnimator.INFINITE);
}
objCloudAnim.start();
}
privatevoidinitListener(){
mPlaneLayout.setOnClickListener(new
PaperPlaneLayout.OnClickListener(){
@Override
publicvoidonClick(ImageViewv){
if(mIsClick){
mIsClick=false;
iconX=v.getX();
iconY=v.getY();
//当点击某一个纸飞机时,飞机会有一个飞出动画
planeOutAnimation(v);
}
}
});
}
/**
*飞机飞出动画
*/
privatevoidplaneOutAnimation(finalViewiconView){
AnimatorSetflyUpAnim=newAnimatorSet();
flyUpAnim.setDuration(600);
ObjectAnimatortransX=ObjectAnimator
.ofFloat(iconView,"translationX",
iconView.getX(),
UIUtility.getScreenWidth(mContext)*2);
ObjectAnimatortransY=ObjectAnimator
.ofFloat(iconView,"translationY",
0,
-UIUtility.getScreenHeight(mContext)*2);
transY.setInterpolator(PathInterpolatorCompat
.create(0.7f,1f));
ObjectAnimatorrotation=ObjectAnimator
.ofFloat(iconView,"rotation",-45,0);
rotation.setInterpolator(newDecelerateInterpolator());
ObjectAnimatorrotationX=ObjectAnimator
.ofFloat(iconView,"rotationX",0,60);
rotationX.setInterpolator(
newDecelerateInterpolator());
flyUpAnim.playTogether(transX,transY,rotationX,
ObjectAnimator
.ofFloat(iconView,"scaleX",1,0.5f),
ObjectAnimator
.ofFloat(iconView,"scaleY",1,0.5f),
rotation
);
flyUpAnim.addListener(newAnimator.AnimatorListener(){
@Override
publicvoidonAnimationStart(Animatoranimation){
}
@Override
publicvoidonAnimationEnd(Animatoranimation){
//飞机飞入动画
downPlaneAnimation(iconView);
}
@Override
publicvoidonAnimationCancel(Animatoranimation){
}
@Override
publicvoidonAnimationRepeat(Animatoranimation){
}
});
flyUpAnim.start();
}
/**
*飞机飞入动画
*/
privatevoiddownPlaneAnimation(finalViewiconView){
finalintoffDistX=-iconView.getRight();
finalintoffDistY=-UIUtility.dipTopx(mContext,10);
AnimatorSetflyDownAnim=newAnimatorSet();
flyDownAnim.setDuration(500);
ObjectAnimatortransX1=ObjectAnimator
.ofFloat(iconView,"translationX",
UIUtility.getScreenWidth(mContext),offDistX);
ObjectAnimatortransY1=ObjectAnimator
.ofFloat(iconView,"translationY",
-UIUtility.getScreenHeight(mContext),
offDistY);
transY1.setInterpolator(
PathInterpolatorCompat.create(0.1f,1f));
ObjectAnimatorrotation1=ObjectAnimator
.ofFloat(iconView,"rotation",
iconView.getRotation(),0);
rotation1.setInterpolator(
newAccelerateInterpolator());
flyDownAnim.playTogether(transX1,transY1,
ObjectAnimator
.ofFloat(iconView,"scaleX",0.5f,0.9f),
ObjectAnimator
.ofFloat(iconView,"scaleY",0.5f,0.9f),
rotation1
);
flyDownAnim.addListener(
newAnimator.AnimatorListener(){
@Override
publicvoidonAnimationStart(Animatoranimation){
iconView.setRotationY(180);
}
@Override
publicvoidonAnimationEnd(Animatoranimation){
}
@Override
publicvoidonAnimationCancel(Animatoranimation){
}
@Override
publicvoidonAnimationRepeat(Animatoranimation){
}
});
AnimatorSetflyInAnim=newAnimatorSet();
flyInAnim.setDuration(500);
flyInAnim.setInterpolator(
newDecelerateInterpolator());
ObjectAnimatortranX2=ObjectAnimator
.ofFloat(iconView,"translationX",
offDistX,iconX);
ObjectAnimatortranY2=ObjectAnimator
.ofFloat(iconView,"translationY",
offDistY,iconY);
ObjectAnimatorrotationX2=ObjectAnimator
.ofFloat(iconView,"rotationX",30,0);
flyInAnim.playTogether(tranX2,tranY2,rotationX2,
ObjectAnimator.ofFloat(iconView,"scaleX",0.9f,1f),
ObjectAnimator.ofFloat(iconView,"scaleY",0.9f,1f));
flyInAnim.setStartDelay(100);
flyInAnim.addListener(newAnimator.AnimatorListener(){
@Override
publicvoidonAnimationStart(Animatoranimation){
iconView.setRotationY(0);
}
@Override
publicvoidonAnimationEnd(Animatoranimation){
}
@Override
publicvoidonAnimationCancel(Animatoranimation){
}
@Override
publicvoidonAnimationRepeat(Animatoranimation){
}
});
AnimatorSetmFlyAnimator=newAnimatorSet();
mFlyAnimator.playSequentially(flyDownAnim,flyInAnim);
mFlyAnimator.start();
}
这样一来纸飞机的进入和点击离开动画就完成了。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。