帧动画
动态图的构成其实是有许多的图片组成的,就像电影我们也会说一帧画面
public class MainActivity extends Activity {
private ImageView imageView;
private AnimationDrawable background;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.iv_image);
imageView.setBackgroundResource(R.drawable.film_animotion);
background = (AnimationDrawable) imageView.getBackground();
background.start();
}
}
将要制作的图片放入图片资源,然后在 res 下的 drawable 新建一个android xml file ,选择animation-list
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="@drawable/dif"
android:duration="200"/>
<item
android:drawable="@drawable/q"
android:duration="200"/>
<item
android:drawable="@drawable/w"
android:duration="200"/>
<item
android:drawable="@drawable/queen"
android:duration="200"/> <!-- 每张图片播放时间 -->
</animation-list>
activity-main xml
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/iv_image"/>
补间动画
平移(translate);旋转(rotate);缩放(scale);透明化(alpha)
四种动作的介绍外加动作综合
布局五个按钮和一张图片
创建(res -----anim-------alpha.xml / scale.xml )等
translateX.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromYDelta="0"
android:toYDelta="100"
android:fillAfter="true"
android:duration="600">
</translate>
translateY.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0"
android:toXDelta="200"
android:duration="600"
android:fillAfter="true">
</translate>
rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%"
android:pivotY="50%"
android:fromDegrees="0"
android:toDegrees="50"
android:duration="600"
android:fillAfter="true"
android:repeatCount="infinite"
android:repeatMode="reverse">
</rotate>
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXScale="1.5"
android:toXScale="0.5"
android:fromYScale="1.5"
android:toYScale="0.5"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="true"
android:duration="600"
android:repeatCount="infinite"
android:repeatMode="reverse">
</scale>
alpha.xml
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="1"
android:toAlpha="0.5"
android:fillAfter="true"
android:duration="600"
android:repeatCount="infinite"
android:repeatMode="reverse">
</alpha>
set.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:shareInterpolator="false">
<scale
android:fromXScale="1.5"
android:toXScale="0.5"
android:fromYScale="1.5"
android:toYScale="0.5"
android:pivotX="50%"
android:pivotY="50%"
android:duration="600"
android:fillBefore="false"/>
<rotate
android:fromDegrees="0"
android:toDegrees="-50"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="700"
android:duration="600"
android:toYScale="0.0"/>
</set>
两种方法:
1结合xml代码实现
2.直接代码实现
以平移为例
public void translate(View view){
/* Animation loadAnimation = AnimationUtils.loadAnimation
(MainActivity.this, R.anim.translate_x);
// 开启动画
imageView.startAnimation(loadAnimation);*/
}
/**
* 在不使用XML的情况下,直接用代码实现
* @param view
*/
public void rotate(View view){
/* Animation loadAnimation = AnimationUtils.loadAnimation
(MainActivity.this, R.anim.rotate);
imageView.startAnimation(loadAnimation);*/
RotateAnimation rotateAni = new RotateAnimation
(0, 360,Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
rotateAni.setDuration(600);
rotateAni.setFillAfter(true);
rotateAni.setRepeatCount(Animation.INFINITE);
rotateAni.setRepeatMode(Animation.REVERSE);
imageView.startAnimation(rotateAni); //控件开启动画
}
动画动作集合
public void complex(View view){
Animation loadAnimation = AnimationUtils.loadAnimation
(MainActivity.this, R.anim.set);
imageView.startAnimation(loadAnimation);
/**
* 创建动画集合
*/
AnimationSet aniset = new AnimationSet(false); //false代表使用自己的动画植入工具
RotateAnimation rotateAni = new RotateAnimation
(0, 360,Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
rotateAni.setDuration(600);
rotateAni.setFillAfter(true);
rotateAni.setRepeatCount(Animation.INFINITE);
rotateAni.setRepeatMode(Animation.REVERSE);
//添加到动画集
aniset.addAnimation(rotateAni);
ScaleAnimation sa = new ScaleAnimation(1, 0.2f, 1, 0.2f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,
0.5f);
sa.setDuration(2000);
sa.setFillAfter(true);
sa.setRepeatCount(Animation.INFINITE);
sa.setRepeatMode(Animation.REVERSE);
//添加到动画集
aniset.addAnimation(sa);
AlphaAnimation aa = new AlphaAnimation(1, 0.2f);
aa.setDuration(2000);
aa.setFillAfter(true);
aa.setRepeatCount(Animation.INFINITE);
aa.setRepeatMode(Animation.REVERSE);
aniset.addAnimation(aa);
}
属性动画
比较于补间动画,补间动画的缺点是不能做出比较立体的动作来,就像补间动画呈现2D,而属性动画可以做出3D效果
这里利用了另一个控件ObjectAnimator
public void translate(View view){
ObjectAnimator animator = ObjectAnimator.ofFloat(imageq, "translationX", 10,180);
animator.setDuration(1000);
animator.setRepeatCount(ObjectAnimator.INFINITE);
animator.setRepeatMode(ObjectAnimator.REVERSE);
animator.start();
}
综合动作
public void complex(View view){
AnimatorSet set = new AnimatorSet();
ObjectAnimator animator = ObjectAnimator.ofFloat(imageq, "scaleX", 0,0.3f,1.5f);
animator.setDuration(1100);
animator.setRepeatCount(ObjectAnimator.INFINITE);
animator.setRepeatMode(ObjectAnimator.REVERSE);
ObjectAnimator animator2 = ObjectAnimator.ofFloat(imageq, "scaleY", 0,0.3f,1.5f);
animator2.setDuration(1100);
animator2.setRepeatCount(ObjectAnimator.INFINITE);
animator2.setRepeatMode(ObjectAnimator.REVERSE);
set.playTogether(animator,animator2);
set.start();
}