现在的位置: 首页 > 移动开发 > 正文

android开发中animation详解,rotate,translate,alpha属性分析

2019年03月06日 移动开发 ⁄ 共 7592字 ⁄ 字号 评论关闭

在Android中,Animation有四种动画效果,并且分为Tween Animation和Frame Animation两类。

先看分类:

一、Tween Animation(补间动画)

一般我们用的就是这种。补间动画又分为AlphaAnimation(透明度转换)、RotateAnimation(旋转转换)、ScaleAnimation(缩放转换)、TranslateAnimation 位置转换(移动)。
动画效果在anim目录下的xml文件中定义,在程序中用AnimationUtils.loadAnimation(Context context,int ResourcesId)载入成Animation对象,在需要显示动画效果时,执行需要动画的View的startAnimation方法,传入Animation即可。切换Activity也可以应用动画效果,在startActivity方法后,执行overridePendingTransition方法,两个参数分别是切换前的动画效果,切换后的动画效果。


定义:

对一张图片进行一系列的变换(包括缩放、透明度、移动、旋转),对应的类是Animation;

在XML中实现动画的方法:

资源访问方式:

   In Java: R.anim.filename

     In XML: @[package:]anim/filename

文件位置:

    res/anim/filename.xml

语法:

filename.xml 文件:

<?xml version="1.0" encoding="utf-8"?>
    <setxmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@[package:]anim/interpolator_resource"
        android:shareInterpolator=["true" | "false"] >
        <alpha
            android:fromAlpha="float"
            android:toAlpha="float"/>
        <scale
            android:fromXScale="float"
            android:toXScale="float"
            android:fromYScale="float"
            android:toYScale="float"
            android:pivotX="float"
            android:pivotY="float"/>
        <translate
            android:fromXDelta="float"
            android:toXDelta="float"
            android:fromYDelta="float"
            android:toYDelta="float"/>
        <rotate
            android:fromDegrees="float"
            android:toDegrees="float"
            android:pivotX="float"
            android:pivotY="float"/>
        <set>
            ...
        </set>
    </set>

详细说明:
set节点:对应AnimationSet类
    android:interpolator:是否为这个Animation定义一个Interpolator(负责定义Animation的变化速率)。
    android:shareInterpolator:是否让子节点这个Interpolator。
  alpha节点:对应AlphaAnimation类
    用于设置Animation的透明度。
      android:fromAlpha:起始时的透明度。0.0:透明;1.0:不透明。
      android:toAlpha:结束时的透明度。0.0:透明;1.0:不透明。
  scale节点:对应ScaleAnimation类
    用于设置Animation缩放。
      android:fromXScale:起始时X方向的缩放程度,使用百分比。
      android:toXScale:结束时X方向的缩放程度,使用百分比。
      android:fromYScale:起始时Y方向的缩放程度,使用百分比。
      android:toYScale:结束时Y方向的缩放程度,使用百分比。
      android:pivotX:缩放时的基准点在X方向的位置,可以使用浮点数或百分比
      android:pivotY:缩放时的基准点在Y方向的位置,可以使用浮点数或百分比
  translate节点:对应TranslateAnimation类
    用于设置Animation的移动。
      android:fromXDelta:起始位置的X方向的坐标,可以使用浮点数或百分比
      android:toXDelta:结束位置的X方向的坐标,可以使用浮点数或百分比
      android:fromYDelta:起始位置的Y方向的坐标,可以使用浮点数或百分比
      android:toYDelta:结束位置的Y方向的坐标,可以使用浮点数或百分比
  rotate节点:对应RotateAnimation类
    用于设置Animation的旋转。
      android:fromDegrees:开始旋转时的角度,使用浮点数
      android:toDegrees:结束旋转的角度,使用浮点数
      android:pivotX:旋转基准点的X方向的坐标,使用浮点数或百分比
      android:pivotY:旋转基准点的Y方向的坐标,使用浮点数或百分比
    如何确定旋转的方向:
      我们假设fromDegrees=A;toDegrees=B:
        如果A>B,则逆时针旋转;
        如果A<B,则顺时针旋转。
  注:在translate和rotate中使用百分比时能针对自身和父控件来确定位置:①距离自己左、上边界(右上角为基准点)的百分比,如:"5%";②距离父控件的左、上边界的百分比,如:"5%p".
  interpolators:
    请参考:http://developer.android.com/guide/topics/resources/animation-resource.html#Interpolators
  在定义Tween Animation时还有两个比较重要的属性是:android:duration(动作的持续时间)和android:startOffset(动作的开始时间).

二、Frame Animation

将几张图片按顺序进行显示。对应的类是AnimationDrawable;

  资源访问方式:

    In Java: R.drawable.filename

    In XML: @[package:]drawable.filename

  文件位置:

    res/drawable/filename.xml

  语法:

<?xml version="1.0" encoding="utf-8"?>

    <animation-listxmlns:android="http://schemas.android.com/apk/res/android"
        android:oneshot=["true" | "false"] >
        <item
            android:drawable="@[package:]drawable/drawable_resource_name"
            android:duration="integer"/>
    </animation-list>

详细说明:

animation-list节点:
    必需的,且必须是根节点,包含一个或多个item节点.
    android:oneshot:是否要循环显示该动画.
item节点:
    Frame Animation的一个frame.必须包含在animation-list节点.
    android:drawable:要显示的图片
    android:duration:显示时间,计算单位是毫秒.

四种动画效果:

一、AlphaAnimation——淡入淡出效果

在Activity中实现的代码如下:

ImageView imageView = (ImageView) findViewById(R.id.imageView1);
AnimationSet animationSet = new AnimationSet(true);
AlphaAnimation alphaAnimation = new AlphaAnimation(0, 1);
alphaAnimation.setDuration(1000);
alphaAnimation.setStartOffset(10000);
animationSet.addAnimation(alphaAnimation);
//animationSet.setStartOffset(10000);
animationSet.setFillBefore(false);
animationSet.setFillAfter(true);
imageView.startAnimation(animationSet);

在XML中实现动画效果的方法:

1、在res目录下创建一个anim文件夹,在里面添加一个alpha.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator"
	android:fillAfter="true"
	android:fillBefore="false">
	<alpha
		android:fromAlpha="1.0"
		android:toAlpha="0.0"
		android:startOffset="1000"
		android:duration="1000" />

</set>

2、在Activity中使用AnimationUtils获取Animation并进行设置:

Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.filename);
imageView.startAnimation(animation);

二、ScaleAnimation:缩放效果

在代码中实现动画效果:

ImageView imageView = (ImageView) findViewById(R.id.imageView1);
AnimationSet animationSet = new AnimationSet(true);
ScaleAnimation scaleAnimation = new ScaleAnimation(1, 0.5f, 1, 0.5f,
		Animation.RELATIVE_TO_SELF, 1f,
		Animation.RELATIVE_TO_SELF, 1f);
animationSet.addAnimation(scaleAnimation);
animationSet.setDuration(1000);
imageView.startAnimation(animationSet);

在XML文件中实现动画效果的方法:

1、在res的anim文件夹下,创建一个scale.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator">


	<scale android:fromXScale="1.0"
		android:toXScale="0.0"
		android:fromYScale="1.0"
		android:toYScale="0.0"
		android:pivotX="50%"
		android:pivotY="50%"
		android:duration="2000" />


</set>

2、 在Activity中使用AnimationUtils获取Animation并进行设置:

Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.scale);
imageView.startAnimation(animation);

三、Rotate:旋转效果

在代码中实现动画效果:

ImageView imageView = (ImageView) findViewById(R.id.imageView1);
AnimationSet animationSet = new AnimationSet(true);
RotateAnimation rotateAnimation = new RotateAnimation(0, 360,
		Animation.RELATIVE_TO_PARENT, 0.5f,
		Animation.RELATIVE_TO_PARENT, 0.5f);
rotateAnimation.setDuration(1000);
animationSet.addAnimation(rotateAnimation);
imageView.startAnimation(animationSet);

在XML文件中实现动画效果的方法:

1、 在res的anim文件夹下,创建一个rotate.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator">


	<rotate android:fromDegrees="0"
		android:toDegrees="+360"
		android:pivotX="50%"
		android:pivotY="50%"
		android:duration="1000" />
</set>

2、在Activity中使用AnimationUtils获取Animation并进行设置:

Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate);
imageView.startAnimation(animation);

四、Translate:移动效果

在代码中实现动画效果:

ImageView imageView = (ImageView) findViewById(R.id.imageView1);
AnimationSet animationSet = new AnimationSet(true);
TranslateAnimation translateAnimation = new TranslateAnimation(
		Animation.RELATIVE_TO_SELF, 0f,
		Animation.RELATIVE_TO_SELF, 1.0f,
		Animation.RELATIVE_TO_SELF, 0f,
		Animation.RELATIVE_TO_SELF, 1.0f);
translateAnimation.setDuration(1000);
animationSet.addAnimation(translateAnimation);
imageView.startAnimation(animationSet);

在XML文件中实现动画效果的方法:

1、 在res的anim文件夹下,创建一个translate.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator">


	<translate
		android:fromXDelta="0%p"
		android:toXDelta="100%p"
		android:fromYDelta="0%p"
		android:toYDelta="100%p"
		android:duration="1000" />


</set>

其中100%p表示相对于父空间的位置
2、在Activity中使用AnimationUtils获取Animation并进行设置:

Animation animation = (Animation) AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate);
imageView.startAnimation(animation);

如果需要控件停在动画后的位置,需要设置android:fillAfter属性为true,在set节点中。默认在动画结束后回到动画前位置。设置android:fillAfter后,我们看到了控件留在了动画后的位置,其实也只是看到在那个位置,真实位置还是在原来动画前那里,你会发现Button不能被点击,就是这个原因。所以我们可以在动画结束后,手动把控件移动到动画结束后的位置。这就需要根结点为AbsoluteLayout,因为LinearLayout不能通过x,y座标定位。具体方法:把布局换成AbsoluteLayout,使用Animation的setAnimationListener设置动画播放事件,在onAnimationEnd方法中,使用控件的setLayoutParams方法,设置动画后的位置。

抱歉!评论已关闭.