[Android]动画

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6

1.理解


  • 动画有下面两种情况

同一个图形通过视图在界面上进行透明度缩放旋转平移的变化View动画

在界面的同一个位置上不断切换显示不同的图片Drawable动画

  • 动画的分类
  1. View Animation
  2. Drawable Animation
  • Android中提供了两种实现动画的方式
  1. 纯编码的方式
  2. xml配置的方式

2.使用动画


1View动画的分类

  • 单一动画
  1. 缩放动画ScaleAnimation)
  2. 旋转动画RotateAnimation
  3. 透明度动画AlphaAnimation)
  4. 平移动画TranslateAnimation
  • 复合动画
  1. 由多个单一动画组合在一起的动画

2View动画的使用

Animation的公用功能

  • setDuration(long durationMillis):设置持续时间单位ms
  • setStartOffset(long startOffset):设置开始的持续的时间单位ms
  • setFillBeforeboolean fillBefore):设置最终是否固定在起始状态
  • setFillAfterboolean fillAfter):设置最终是否固定在最后的状态
  • setAnimationListenerAnimationListener listener):设置动画监听
  • 坐标类型
  1. Animation.ABSOLUTE数值默认以px为单位
  2. Animation.RELATIVE_TO_SELF百分数如50%以当前视图的宽度和高度其为基数来计算
  3. Animation.RELATIVE_TO_PARENT百分数+p如50%p以父视图的宽度和高度其为基数来计算
  • 启动动画

view.startAnimation(animation)

  • 结束动画

view.clearAnimation()

  • 动画监听器AnimationListener
  1. onAnimationStart(Animation animation):动画开始的回调
  2. onAnimationEnd(Animation animation):动画结束的回调
  3. 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"/>

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6
标签: android