1,概念:
补间动画,给出两个关键帧,通过一些算法将给定属性值在给定的时间内在两个关键帧间渐变。主要有为旋转、平移、放缩和渐变等动画
ViewAnimation又叫Tween动画在Android中分为4类,它们分别是:AlphaAnimation(透明度动画)、TranslateAnimation(平移动画)、ScaleAnimation(缩放动画)、RotateAnimation(旋转动画)。都继承自android.view.Animation类,它们都是表示从一个状态A向状态B变化的一个过程,所以英文名字叫Tween动画、中文名叫:“补间动画”、“中间动画”。
2,实现方式:
它们总的说来有两种实现方式:java code(java源代码)、xml(xml配置文件)
3,四个类的构造函数:
AlphaAnimation(透明度动画)
AlphaAnimation有两个构造函数,分别是:
—— AlphaAnimation(Context context, AttributeSet attrs):第二个参数是个属性集
——AlphaAnimation(float fromAlpha, float toAlpha):第一个参数是初始透明度,第二个参数是终止透明度
TranslateAnimation(平移动画)
TranslateAnimation有三个构造函数,分别是:
——TranslateAnimation(Context context, AttributeSet attrs)
——TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta):
分别对应x轴的起始、终点坐标,与y轴的起始、终点坐标
——TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue):
第一个参数是x轴方向的值的参照(Animation.ABSOLUTE, Animation.RELATIVE_TO_SELF, or Animation.RELATIVE_TO_PARENT);
第三个参数与第四个参数是x轴方向的
终点参照与对应值;后面四个参数就不用解释了。如果全部选择Animation.ABSOLUTE,其实就是第二个构造函数。
以x轴为例介绍参照与对应值的关系
如果选择参照为Animation.ABSOLUTE,那么对应的值应该是具体的坐标值,比如100到300,指绝对的屏幕像素单位
如果选择参照为Animation.RELATIVE_TO_SELF或者 Animation.RELATIVE_TO_PARENT指的是相对于自身或父控件,
对应值应该理解为相对于自身或者父控件的几倍或百分之多少。一定要多试试这几个参数类型!
ScaleAnimation(缩放动画)
ScaleAnimation(缩放动画)有四个构造函数,分别是:
——ScaleAnimation(Context context, AttributeSet attrs)
——ScaleAnimation(float fromX, float toX, float fromY, float toY):同TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)
——ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY):
这里解释后面两个参数,pivot英文意思为“枢轴”,也就是支点。通过这两个参数可以控制缩放动画的放大方向,这个点不会随对象大小变化而变化
——ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue):
如果理解了前面所讲的,这个就不做多的说明,如果不清楚,请回头多用代码试试。
RotateAnimation(旋转动画)
RotateAnimation(旋转动画)同样有四个构造函数,分别是:
——RotateAnimation(Context context, AttributeSet attrs)
——RotateAnimation(float fromDegrees, float toDegrees)
——RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY)
——RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)
4,代码示例
MainActivity中的代码:
/**
* 帧动画
* 透明度alphaAnimation
* 缩放动画scaleAnimation
* 平移动画translateAnimation
* 旋转动画rotateAnimation
*/
public class MainActivity extends AppCompatActivity {
private ImageView img;
private ScaleAnimation scaleAnimation;
private RotateAnimation rotateAnimation;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img = (ImageView) findViewById(R.id.img_book);
}
public void onClick(View view) {
switch (view.getId()) {
//透明度
case R.id.bt_tmd:
//alphaAnimation();
/**
* 此处是实现按动画的另一种方式,通过布局文件,步骤如下:
* 1,在res目录下新建一个目录,命名为anim(必须是anim,规定),
* 2,然后在该目录下新建一个Animation文件,其根目录为set
* 3,然后再设置透明度标签【参考本博客插图】
* (注意透明度数值结尾不要带float的单位f)
* <alpha android:duration="2000"
* android:fromAlpha="0.0"
* android:toAlpha="0.6"/>
* (此处是透明度,若实现其他动画,直接修改标签,设置对应属性值,
* 模仿这个样式写,原理一毛一样)
* 4,获取Animation对象,通过动画工具类的下载方法获取,
* 获取对象方法的第一个参数是上下文,第二个参数布局文件id
* 5,启动动画。
*/
Animation animation = AnimationUtils.loadAnimation(this, R.anim.alphaanim);
img.startAnimation(animation);
break;
case R.id.bt_xz:
rotateAnim();
break;
case R.id.bt_jh:
animationSet();
break;
case R.id.bt_py:
translateAnim();
break;
case R.id.bt_sf:
scaleAnim();
break;
default:
break;
}
}
/**
* 透明度:
* 1,首先创建对象 透明度AlphaAnimation
* 2,设置对象属性(插值器
* 3,开启动画
*/
private void alphaAnimation() {
//透明度 改变动画效果
AlphaAnimation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);
//设置动画播放时间
alphaAnimation.setDuration(1000);
//设置重播方式,重新开始,或者反转
alphaAnimation.setRepeatMode(Animation.RESTART);
//设置动画结束后是否保持当前的位置,true表示不返回动画开始的位置
alphaAnimation.setFillAfter(true);
//设置重播次数
alphaAnimation.setRepeatCount(3);
//开启动画
img.startAnimation(alphaAnimation);
}
//旋转,步骤同透明度
private void rotateAnim() {
//默认控件以左上方为中心旋转
//RotateAnimation rotateAnimation = new RotateAnimation(0f, 360f);
//下面是构造函数的重载
rotateAnimation = new RotateAnimation(0f,//旋转角度
360, //目标旋转角度
Animation.RELATIVE_TO_PARENT,//旋转中心X点参照类型,
// 此处是相对于父控件,(也可以以自己或者像素为参照物),
// 推荐以父控件或者自身为参照物,不建议以像素为参照物
0.5f, //(0-1)X中心参照的百分比
Animation.RELATIVE_TO_PARENT,//旋转中心点Y参照类型
0.5f//(0-1)Y中心参照的百分比
);
rotateAnimation.setDuration(2000);
rotateAnimation.setRepeatCount(3);
rotateAnimation.setFillAfter(true);
img.startAnimation(rotateAnimation);
}
/**
* 1.首先创建一个ScaleAnimation对象(设置透明度改变的值)
* 2.设置动画对像的属性值(播放时间,播放状态,,,)
* 3.开启动画(需要设置动画的控件调用startAnimation(你设置的动画))
* 第一个参数fromX为动画起始时 X坐标上的伸缩尺寸 0.0表示收缩到没有
* 第二个参数toX为动画结束时 X坐标上的伸缩尺寸 1.0表示正常无伸缩
* 第三个参数fromY为动画起始时Y坐标上的伸缩尺寸 值小于1.0表示收缩
* 第四个参数toY为动画结束时Y坐标上的伸缩尺寸 值大于1.0表示放大
*/
private void scaleAnim() {
//ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f);
scaleAnimation = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scaleAnimation.setFillAfter(true);
scaleAnimation.setRepeatCount(2);
scaleAnimation.setDuration(2000);
img.startAnimation(scaleAnimation);
}
//平移动画
private void translateAnim() {
TranslateAnimation translateAnimation =
new TranslateAnimation(0.0f, 2.0f, 0.5f, 1.5f);
translateAnimation.setDuration(2000);
translateAnimation.setRepeatCount(2);
translateAnimation.setFillAfter(true);
img.startAnimation(translateAnimation);
}
//动画集合
private void animationSet() {
//设置一个动画集合
AnimationSet animationSet = new AnimationSet(true);
animationSet.addAnimation(scaleAnimation);
animationSet.addAnimation(rotateAnimation);
//两种动画效果间的时间间隔,
// 此处意思就是,先实现scaleAnimation动画,然后间隔1s,再实现rotateAnimation动画
animationSet.setStartOffset(1000);
img.startAnimation(animationSet);
/**另外调用该方法时候,
提前点击一下scaleAnimation和rotateAnimation,
进行初始化,否则会抛出空指针异常,
当然此处代码可以优化,本案例重点是讲解原理。*/
}
}
布局文件中的代码:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.myapplication.alpha.MainActivity"
>
<Button
android:id="@+id/bt_tmd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="透明度"
/>
<Button
android:id="@+id/bt_xz"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="旋转"
/>
<Button
android:id="@+id/bt_sf"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="缩放动画"
/>
<Button
android:id="@+id/bt_py"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="平移动画"
/>
<Button
android:id="@+id/bt_jh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="onClick"
android:text="动画集合"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:orientation="vertical"
>
<ImageView
android:id="@+id/img_book"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/emoji_3"
/>
</LinearLayout>
</LinearLayout>
通过设置xml文件实现动画的图示