Android Studio 实现动画 -- 补间动画

效果图

在这里插入图片描述

动画

  • 点击处理
 //平移
        but.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation translation= AnimationUtils.loadAnimation(getApplication(),R.anim.translate);
                fk.startAnimation(translation);
            }
        });
        //缩放
        but1.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation scale= AnimationUtils.loadAnimation(getApplication(),R.anim.scale);
                fk.startAnimation(scale);
            }
        });
        //旋转
        but2.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation rotate= AnimationUtils.loadAnimation(getApplication(),R.anim.rotate);
                fk.startAnimation(rotate);
            }
        });
        //透明度
        but3.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation alpha= AnimationUtils.loadAnimation(getApplication(),R.anim.alpha);
                fk.startAnimation(alpha);
            }
        });
        //上下循环
       but4.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation alpha= AnimationUtils.loadAnimation(getApplication(),R.anim.shangxia);
                fk.startAnimation(alpha);
            }
        });
        //缩放循环
        but5.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                Animation alpha= AnimationUtils.loadAnimation(getApplication(),R.anim.scale2);
                fk.startAnimation(alpha);
            }
        });
        //旋转动画
        but6.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
//                fk.setImageResource(R.mipmap.dong);
                Animation rotate= AnimationUtils.loadAnimation(getApplication(),R.anim.rotate2);
                //让旋转动画一直转,不停顿的重点(实际上是添加动画插值器)
                rotate.setInterpolator(new LinearInterpolator());//加上这一句,解决旋转停顿问题
                fk.startAnimation(rotate);
            }
        });
        //停止动画
        but7.setOnClickListener(new View.OnClickListener() {
    
    
            @Override
            public void onClick(View view) {
    
    
                fk.clearAnimation();
            }
        });

注意:让旋转动画一直转,不停顿的重点(实际上是添加动画插值器)

rotate.setInterpolator(new LinearInterpolator());//加上这一句,解决旋转停顿问题
  • anim
    在这里插入图片描述
  • translate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--平移-->
    <translate
        android:fromXDelta="0.0"
        android:fromYDelta="0.0"
        android:toXDelta="100"
        android:toYDelta="0.0"
        android:repeatMode="reverse"
        android:repeatCount="1"
        android:duration="500"
        />
    <!--
        android:repeatCount="infinite" 循环
        android:duration="500" 期间/速度
        android:fromXDelta="0.0" //开始 x 位置
        android:fromYDelta="0.0" //开始 y 位置
        android:toXDelta="100" //到达 x 位置
        android:toYDelta="0.0" //到达 y 位置
    -->
</set>
  • scale.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--缩放-->
    <scale
        android:repeatMode="reverse"
        android:repeatCount="1"
        android:duration="1000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:toXScale="0.5"
        android:toYScale="0.5"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>
  • rotate.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--旋转-->
    <rotate
        android:fromDegrees="0"
        android:toDegrees="360"
        android:interpolator="@android:anim/linear_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="0"
        android:duration="1000"
        />
    <!--
        android:repeatMode="reverse" //是模式 ,反方向也会走一遍
        android:fromDegrees="0" //开始是0 结束是360 就顺时针 - 开始是360 结束是 0 就是逆时针
        android:toDegrees="360"
        -->
</set>
  • alpha.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--改变透明度-->
    <alpha
        android:interpolator="@android:anim/linear_interpolator"
        android:repeatMode="reverse"
        android:repeatCount="1"
        android:duration="1000"
        android:fromAlpha="1.0"
        android:toAlpha="0.0"/>
</set>
  • shangxia.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <!--上下-->
    <translate
        android:fromXDelta="0.0"
        android:fromYDelta="100"
        android:toXDelta="0.0"
        android:toYDelta="0.0"
        android:repeatMode="reverse"
        android:repeatCount="infinite"
        android:duration="500"
        />

</set>
  • scale2.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <!--缩放-->
    <scale
        android:repeatMode="reverse"
        android:repeatCount="-1"
        android:duration="1000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:toXScale="0.5"
        android:toYScale="0.5"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>
  • rotate2.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!--旋转-->
    <rotate
        android:fromDegrees="0"
        android:toDegrees="360"
        android:interpolator="@android:anim/linear_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="-1"
        android:duration="1000"
        />
    <!--
        android:repeatMode="reverse" //是模式 ,反方向也会走一遍
        android:fromDegrees="0" //开始是0 结束是360 就顺时针 - 开始是360 结束是 0 就是逆时针
        android:toDegrees="360"
        -->
</set>
  • 布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ui.AnimationMessageActivity">
    <ImageView
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_centerInParent="true"
        android:layout_gravity="center"
        android:id="@+id/fk"
        android:src="@mipmap/huangguan"/>

    <LinearLayout
        android:layout_above="@+id/ll_button"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="平移"
            android:textSize="20sp"
            android:layout_weight="1"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:id="@+id/but"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="缩放"
            android:textSize="20sp"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:gravity="center"
            android:id="@+id/but1"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="旋转"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:id="@+id/but2"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="透明度"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:id="@+id/but3"/>
    </LinearLayout>
    
    <LinearLayout
        android:id="@+id/ll_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="上下"
            android:textSize="20sp"
            android:layout_weight="1"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:id="@+id/but4"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="缩放"
            android:textSize="20sp"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:gravity="center"
            android:id="@+id/but5"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="旋转"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:id="@+id/but6"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="停止"
            android:textSize="20sp"
            android:gravity="center"
            android:layout_gravity="bottom"
            android:layout_weight="1"
            android:id="@+id/but7"/>
    </LinearLayout>

</RelativeLayout>

猜你喜欢

转载自blog.csdn.net/afufufufu/article/details/125181428#comments_27348469