1.理解
- 动画有下面两种情况
同一个图形通过视图在界面上进行透明度，缩放，旋转，平移的变化（View动画）
在界面的同一个位置上不断切换显示不同的图片（Drawable动画）
- 动画的分类
- View Animation
- Drawable Animation
- Android中提供了两种实现动画的方式
- 纯编码的方式
- xml配置的方式
2.使用动画
1）View动画的分类
- 单一动画
- 缩放动画（ScaleAnimation)
- 旋转动画（RotateAnimation）
- 透明度动画（AlphaAnimation)
- 平移动画（TranslateAnimation）
- 复合动画
- 由多个单一动画组合在一起的动画
2）View动画的使用
Animation的公用功能
- setDuration(long durationMillis):设置持续时间（单位ms）
- setStartOffset(long startOffset):设置开始的持续的时间（单位ms）
- setFillBefore（boolean fillBefore):设置最终是否固定在起始状态
- setFillAfter（boolean fillAfter):设置最终是否固定在最后的状态
- setAnimationListener（AnimationListener listener):设置动画监听
- 坐标类型
- Animation.ABSOLUTE：数值（默认以px为单位）
- Animation.RELATIVE_TO_SELF：百分数，如50%（以当前视图的宽度和高度其为基数来计算）
- Animation.RELATIVE_TO_PARENT：百分数+p，如：50%p（以父视图的宽度和高度其为基数来计算）
- 启动动画
view.startAnimation(animation)
- 结束动画
view.clearAnimation()
- 动画监听器：AnimationListener
- onAnimationStart(Animation animation):动画开始的回调
- onAnimationEnd(Animation animation):动画结束的回调
- onAnimationRepeat(Animation animation)：动画重复执行
2.如何指定坐标（中心点，起始点，目标点）
a.坐标系的原点：视图的左上角
b.代码 n
绝对：n px
相对于自己：viewWidth*n px
相对于父亲：parentViewWidth*n px
c.xml
n：绝对类型，n px
n%：相对于自己类型，viewWidth*n% px
n%p：相对于父亲类型：parentViewWidth*n% px
使用Drawable动画
1.缩放动画（ScaleAnimation)
public ScaleAnimation(float fromX, float toX, float fromY, float toY,
int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) {
/*ScaleAimation缩放动画（代码） * 1.创建动画对象 * 2.设置 * 3.启动动画 * */ fun startCodeScale(){ textView.text="Code缩放动画：宽度从0.0到1.0，高度从0.0到1.0，缩放的圆心为顶部中心点，延迟1s开始，持续5s，最终还原" var animation=ScaleAnimation(0f,1f,0f,1f,Animation.ABSOLUTE, (img.width/2).toFloat(),Animation.ABSOLUTE,0f) animation.startOffset=1000 animation.duration=5000 animation.fillBefore=true img.startAnimation(animation) }
/*ScaleAimation缩放动画（xml文件方式） * 1.定义动画文件 * 2.加载动画文件得到动画对象 * 3.启动动画 * */ @SuppressLint("ResourceType") fun startXmlScale(){ textView.text="Xml缩放动画：宽度从0.0到1.0，高度从0.0到1.0，缩放的圆心为右下角，延迟1s开始，持续5s，最终还原" var animation:Animation=AnimationUtils.loadAnimation(this,R.xml.scale) img.startAnimation(animation) }
<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:fromXScale="0" android:fromYScale="0" android:toXScale="1" android:toYScale="1" android:startOffset="1000" android:duration="3000" android:pivotX="100%" android:pivotY="100%" android:fillAfter="true"> </scale> <!--Xml缩放动画：宽度从0.0到1.0，高度从0.0到1.0，缩放的圆心为右下角，延迟1s开始，持续2s，最终还原-->
2. 旋转动画（RotateAnimation）
public RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue,
int pivotYType, float pivotYValue) {
/* * RotateAnimation旋转动画（代码） * */ fun startCodeRotate(){ textView.text="Code旋转动画：以图片中心点为中心，从负90度到正90度，持续5s" var animation:RotateAnimation=RotateAnimation(-90f,+90f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f) animation.duration=5000 img.startAnimation(animation) } /* * RotateAnimation旋转动画（xml） * */ @SuppressLint("ResourceType") fun startXmlRotate(){ textView.text="Xml旋转动画：以左顶点为坐标，从负90度到正90度，持续5s" var animation:Animation=AnimationUtils.loadAnimation(this,R.xml.rotate) img.startAnimation(animation) }
<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:fromDegrees="90" android:toDegrees="-90" android:duration="5000" android:pivotX="0%" android:pivotY="0%" > </rotate> <!--Xml旋转动画：以左顶点为坐标，从负90度到正90度，持续5s-->
3. 透明度动画（AlphaAnimation)
public AlphaAnimation(float fromAlpha, float toAlpha)
/* * AlphaAnimation透明度动画（代码） * */ fun startCodeAlpha(){ textView.text="Code透明度动画：从完全透明到完全不透明，持续5s" var animation:Animation=AlphaAnimation(0f,1f) animation.duration=5000 img.startAnimation(animation) } @SuppressLint("ResourceType") fun startXmlAlpha(){ textView.text="Xml透明度动画：从完全不透明到完全透明，持续5s" var animation=AnimationUtils.loadAnimation(this,R.xml.alpha) img.startAnimation(animation) }
<?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:fromAlpha="1" android:toAlpha="0" android:duration="5000" > </alpha>
4. 平移动画（TranslateAnimation）
public TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue,
int fromYType, float fromYValue, int toYType, float toYValue)
/*TranslateAnimation平移动画(代码) * */ fun startCodeTranslate(){ textView.text="Code移动动画：向右移动一个自己的宽度，向下移动一个自己的高度，持续2s" var animation=TranslateAnimation(Animation.ABSOLUTE,0f,Animation.RELATIVE_TO_SELF,1f,Animation.ABSOLUTE,0f,Animation.RELATIVE_TO_SELF,1f) animation.duration=5000 img.startAnimation(animation) } /*TranslateAnimation平移动画(xml) * */ @SuppressLint("ResourceType") fun startXmlTranslate(){ textView.text="Xml移动动画：从屏幕的右边逐渐回到原来的位置，持续2s" var animation=AnimationUtils.loadAnimation(this,R.xml.translate) img.startAnimation(animation) }
<?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:fromXDelta="100%f" android:toXDelta="0f" android:fromYDelta="0f" android:toYDelta="0f" android:druation="2000" > </translate> <!--从屏幕的右边逐渐回到原来的位置，持续2s-->
5. 复合动画
/*AnimationSet复合动画(代码) * 1.创建透明动画并设置 * 2.创建旋转动画并设置 * 3.创建复合动画并设置 * 4.添加两个动画 * 5.启动复合动画对象 * */ private fun startCodeAnimationSet(){ textView.text="Code复合动画：通明度从透明到不透明，持续2s，接着进行旋转360度的动画，持续1s" var alphaAnimation=AlphaAnimation(0f,1f) alphaAnimation.duration=2000 var rotateAnimation=RotateAnimation(0f,360f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f) rotateAnimation.duration=1000 rotateAnimation.startOffset=2000 var animationSet=AnimationSet(true) animationSet.addAnimation(alphaAnimation) animationSet.addAnimation(rotateAnimation) img.startAnimation(animationSet) } @SuppressLint("ResourceType") fun startXmlAnimationSet(){ textView.text="Code复合动画：通明度从透明到不透明，持续2s，接着进行旋转360度的动画，持续1s" var animation=AnimationUtils.loadAnimation(this,R.xml.set) img.startAnimation(animation) }
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android"> <alpha android:druation="2000" android:fromAlpha="0.0" android:toAlpha="1.0" /> <rotate android:druation="1000" android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:toDegrees="360" /> </set>
6.动画监听
@SuppressLint("ResourceType") fun test(){ textView.text="Xml旋转动画：以左顶点为坐标，从负90度到正90度，持续5s" var animation:Animation=AnimationUtils.loadAnimation(this,R.xml.rotate) animation.repeatCount=3//重复三次 img.startAnimation(animation) }
7.在界面的同一个位置上不断切换显示不同的图片
<?xml version="1.0" encoding="utf-8"?> <animation_list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false" > <item android:drawable="@drawable/img1" android:duration="500"/> <item android:drawable="@drawable/img2" android:duration="500"/> <item android:drawable="@drawable/img3" android:duration="500"/> <item android:drawable="@drawable/img4" android:duration="500"/> </animation_list>
<ImageView android:id="@+id/nv_dv" android:layout_width="80dp" android:layout_height="80dp" android:layout_marginTop="160dp" android:background="@drawable/animation_list"/>
