一手遮天 Android - Animation: 视图动画(View Animation)基础
一手遮天 Android - Animation: 视图动画(View Animation)基础
示例如下:
/animation/AnimationDemo1.java
/**
* 视图动画(View Animation)基础
* 视图动画只是改变了 View 的视觉效果,而并没有改变 View 的属性(比如 left, top, right, bottom 之类的都是不变的)
* View Animation(视图动画)即 Tween Animation(补间动画)
* 本例中定义动画的 xml 请参见 res/anim/set_animation_animationdemo1.xmlndemo1.xml
*
*
* AnimationSet - 动画集合,用于定义一组动画。继承自 Animation
* addAnimation(Animation a) - 添加动画
* TranslateAnimation, ScaleAnimation, AlphaAnimation, RotateAnimation - 位移动画,缩放动画,不透明度动画,旋转动画。均继承自 Animation
* 在构造函数中指定动画的参数,不同动画的不同参数的解释看 res/anim/set_animation_animationdemo1.xmlndemo1.xml 中的说明吧
* Animation - 动画(在 xml 定义的各种视图动画均需要放在 res/anim 目录下)
* setDuration(), setStartOffset(), setFillAfter(), setFillBefore(), setRepeatCount(), setRepeatMode() - 具体解释看 res/anim/set_animation_animationdemo1.xmlndemo1.xml 中的说明吧
* setAnimationListener() - 设置动画监听器
* onAnimationStart - 动画开始
* onAnimationEnd - 动画结束
* onAnimationRepeat - 动画重复
* AnimationUtils.loadAnimation(Context context, int id) - 获取 xml 中定义的 Animation 对象
*
*
* View - 视图
* startAnimation(Animation animation) - 开始动画
* clearAnimation() - 取消动画
*/
package com.webabcd.androiddemo.animation;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.TextView;
import com.webabcd.androiddemo.R;
public class AnimationDemo1 extends AppCompatActivity {
private TextView _textView1;
private TextView _textView2;
private Button _button1;
private Button _button2;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_animation_animationdemo1);
_textView1 = findViewById(R.id.textView1);
_textView2 = findViewById(R.id.textView2);
_button1 = findViewById(R.id.button1);
_button2 = findViewById(R.id.button2);
sample();
}
private void sample() {
// AnimationUtils.loadAnimation() - 从 xml 中加载 Animation
final Animation animation = AnimationUtils.loadAnimation(AnimationDemo1.this, R.anim.set_animation_animationdemo1);
_button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 开始动画
_textView1.startAnimation(animation);
}
});
_button2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 取消动画
_textView1.clearAnimation();
}
});
animation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
// 动画开始
_textView2.append("onAnimationStart\n");
}
@Override
public void onAnimationEnd(Animation animation) {
// 动画结束
_textView2.append("onAnimationEnd\n");
}
@Override
public void onAnimationRepeat(Animation animation) {
// 动画重复
_textView2.append("onAnimationRepeat\n");
}
});
}
}
/layout/activity_animation_animationdemo1.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textColor="#FFFF0000" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="200dp" />
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="false"
android:text="startAnimation"/>
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAllCaps="false"
android:text="clearAnimation"/>
</LinearLayout>
/anim/set_animation_animationdemo1.xml
<?xml version="1.0" encoding="utf-8"?>
<!--
set - 用于定义一组动画,如果只需要某一个动画的话则根节点直接写 translate 或 scale 或 rotate 或 alpha 就好,另外 set 里是可以嵌套 set 的
duration - 动画的持续时间,单位:毫秒
startOffset - 动画启动后在此值指定的时间后再真正开始动画,单位:毫秒
fillAfter="true", fillBefore="false" - 动画结束后保持动画结束后的状态
fillAfter="false", fillBefore="true" - 动画结束后还原到动画开始之前的的状态
注1:
以上这些属性也适用于 translate, scale, rotate, alpha
如果在 set 中设置了这些属性,则其子控件们都会继承其值
如果在 set 中设置了这些属性,然后又在子控件中设置这些属性,则子控件中的设置是无效的
注2:
在 set 中设置 repeatMode, repeatCount 是无效的,需要在 translate, scale, rotate, alpha 中设置才能生效
-->
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:startOffset="1000"
android:fillAfter="true"
android:fillBefore="false">
<!--
位移动画
fromXDelta, toXDelta - 动画开始和结束时 x 轴方向上的位置(以左上角顶点为原点)
toXDelta, toYDelta - 动画开始和结束时 y 轴方向上的位置(以左上角顶点为原点)
repeatMode - 动画结束后的重复方式
restart - 重头播放(对应 java 中的 Animation.RESTART)
reverse - 来回播放(对应 java 中的 Animation.REVERSE)
repeatCount - 动画重复次数(-1 代表无限重复)
-->
<translate
android:fromXDelta="0%p"
android:fromYDelta="0%p"
android:toXDelta="10%p"
android:toYDelta="10%p" />
<!--
缩放动画
fromXScale, toXScale - 动画开始和结束时 x 轴方向上的缩放倍数
fromYScale, toYScale - 动画开始和结束时 y 轴方向上的缩放倍数
pivotX, pivotY - 缩放中心点坐标
repeatMode - 动画结束后的重复方式
restart - 重头播放(对应 java 中的 Animation.RESTART)
reverse - 来回播放(对应 java 中的 Animation.REVERSE)
repeatCount - 动画重复次数(-1 代表无限重复)
-->
<scale
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="1.2"
android:toYScale="1.2"
android:pivotX="50%"
android:pivotY="50%" />
<!--
旋转动画
fromDegrees, toDegrees - 动画开始和结束时的角度(顺时针方向为正)
pivotX, pivotY - 旋转中心点坐标
repeatMode - 动画结束后的重复方式
restart - 重头播放(对应 java 中的 Animation.RESTART)
reverse - 来回播放(对应 java 中的 Animation.REVERSE)
repeatCount - 动画重复次数(-1 代表无限重复)
-->
<rotate
android:fromDegrees="0"
android:toDegrees="30"
android:pivotX="50%"
android:pivotY="50%" />
<!--
不透明度动画
fromAlpha, toAlpha - 动画开始和结束时的不透明度
repeatMode - 动画结束后的重复方式
restart - 重头播放(对应 java 中的 Animation.RESTART)
reverse - 来回播放(对应 java 中的 Animation.REVERSE)
repeatCount - 动画重复次数(-1 代表无限重复)
-->
<alpha
android:fromAlpha="1.0"
android:toAlpha="0.7" />
</set>
<!--
注:以上 fromXDelta, fromYDelta, toXDelta, toYDelta, pivotX, pivotY 属性值支持的类型如下
1、数值:比如 20px,20dp 之类的。在 java 中对应的类型为 Animation.ABSOLUTE
2、百分数:比如 50%(相对于自身的百分比)。在 java 中对应的类型为 Animation.RELATIVE_TO_SELF
3、百分数p:比如 50%p(相对于父控件的百分比)。在 java 中对应的类型为 Animation.RELATIVE_TO_PARENT
-->