本文详细介绍了Android中的UI开发，重点讲解了帧动画和补间动画的实现。对于帧动画，包括如何准备资源、创建XML文件以及在代码中启动动画。补间动画部分，涵盖了透明度、缩放、旋转和位移四种类型的动画，通过XML实现和Java代码实现的方式进行了演示。此外，还提到了属性动画这一更强大的动画机制。
UI开发
目录
3.2.3.1 具体解释（例如各方法的属性值，方法构造的参数值）
3 动画
这期效果有点难展示，效果图需要搞成gif图才能直观反映，展示直接运行算了
3.1 帧动画
准备帧动画资源：在res目录下的drawable的文件夹中，将帧动画的每一帧以递增的命名方式放入文件夹中。确保所有帧的命名规则保持一致。创建动画资源文件：创建一个XML文件作为动画资源文件。创建一个名为frame_animation.xml的文件。在动画资源文件中定义帧动画：在frame_animation.xml文件中使用animation-list元素来定义帧动画序列。如下：
<?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/img_1" android:duration="500"/>
<item android:drawable="@drawable/img_2" android:duration="500"/>
<item android:drawable="@drawable/img_3" android:duration="500"/>
<item android:drawable="@drawable/img_4" android:duration="500"/>
<item android:drawable="@drawable/img_5" android:duration="500"/>
<item android:drawable="@drawable/img_6" android:duration="500"/>
</animation-list>android:drawable属性指定了每一帧的图像资源，android:duration属性指定了每一帧的持续时间（以毫秒为单位）。
在布局文件中添加控件：
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".MainActivity">
<!--一开始没动起来的图-->
<ImageView
android:id="@+id/img_show"
android:layout_width="300dp"
android:layout_height="300dp"
android:src="@drawable/img_1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.336" />
<ImageView
android:id="@+id/img_waitToShow"
android:layout_width="300dp"
android:layout_height="300dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.336" />
<Button
android:id="@+id/btn_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="**,启动！"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/img_waitToShow"
app:layout_constraintVertical_bias="0.281" />
</androidx.constraintlayout.widget.ConstraintLayout>在代码中加载并启动帧动画：在你的Java代码中，通过ImageView的实例来加载并启动帧动画。例如：
package com.gxy.animator_test;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity {
private Button button;
private ImageView imageView,imageView2;
private int cnt = 1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = findViewById(R.id.img_waitToShow);
imageView2 = findViewById(R.id.img_show);
button = findViewById(R.id.btn_start);
imageView.setBackgroundResource(R.drawable.frame_animation);
AnimationDrawable animationDrawable = (AnimationDrawable) imageView.getBackground();
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(cnt == 1){
animationDrawable.start();
imageView2.setVisibility(View.INVISIBLE);
//将最开始不动的图不可视
cnt--;
}else{
animationDrawable.stop();
cnt++;
}
}
});
}
}我们使用setBackgroundResource()方法将动画资源文件设置为ImageView的背景。然后，通过将背景转换为AnimationDrawable对象，并调用start()方法来启动帧动画。点击相应的按钮时，就会显示帧动画
3.2 补间动画
3.2.1 分类
透明度动画（AlphaAnimation）、缩放动画（ScaleAnimation）、旋转动画（RotateAnimation）、位移动画（TranslateAnimation）
3.2.2 用xml实现补间动画
基本步骤：在anim文件夹里面创建一个对应动画的xml文件，然后在Java文件里面使用loadAnimation()方法从XML文件加载动画
3.2.2.1 透明度动画
-
在
res目录下的anim文件夹中创建一个XML文件，用于定义透明度动画效果。创建一个名为fade_in.xml的文件。 -
在XML文件中定义透明度动画效果。使用
alpha标签来设置透明度的起始值、结束值和动画持续时间。以下是一个示例，展示了一个从完全透明到完全不透明的淡入效果：
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="1000" />在代码中加载并启动透明度动画。在你的Java代码中，通过加载XML文件来获取透明度动画对象，并将其应用到指定的视图上。：
//ImageView imageView = findViewById(R.id.imageView);
//Animation animation = AnimationUtils.loadAnimation(this, R.anim.fade);
//imageView.startAnimation(animation);
package com.gxy.animator_test;
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.ImageView;
public class alpha_test extends AppCompatActivity {
private ImageView imageView;
private Button btn1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_alpha_test);
imageView = findViewById(R.id.img_1);
btn1 = findViewById(R.id.btn_1);
btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this, R.anim.fade_in);
imageView.startAnimation(animation);
}
});
}
}3.2.2.2 缩放动画
-
在
res目录下的anim文件夹中创建一个XML文件，名为scale_animation.xml。 -
在
scale_animation.xml文件中定义缩放动画的属性和值。下面实现了一个从原始大小缩放到两倍大小的动画效果：
fromXScale：动画开始时的X轴缩放比例。fromYScale：动画开始时的Y轴缩放比例。toXScale：动画结束时的X轴缩放比例。toYScale：动画结束时的Y轴缩放比例。pivotX：缩放的中心点X坐标，可以使用百分比或具体数值。pivotY：缩放的中心点Y坐标，可以使用百分比或具体数值。duration：动画持续时间，以毫秒为单位。fillAfter：动画结束后是否保持最终状态。
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
android:fromXScale="1.0"
android:fromYScale="1.0"
android:toXScale="2.0"
android:toYScale="2.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:fillAfter="true" />
</set>在java代码使用loadAnimation()方法
btn2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this, R.anim.scale_animation);
imageView.startAnimation(animation);
}
});3.2.2.3 旋转动画
-
在
res目录下的anim文件夹中创建一个XML文件，rotate_animation.xml。 -
在
rotate_animation.xml文件中定义旋转动画的属性和值。下面实现了实现了一个沿着Z轴顺时针旋转360度的动画效果：
fromDegrees：动画开始时的旋转角度。toDegrees：动画结束时的旋转角度。pivotX：旋转的中心点X坐标，可以使用百分比或具体数值。pivotY：旋转的中心点Y坐标，可以使用百分比或具体数值。duration：动画持续时间，以毫秒为单位。interpolator：动画的插值器，用于控制动画的速度变化。在示例中，我们使用了默认的线性插值器。repeatCount：动画重复的次数
<?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:pivotX="50%"
android:pivotY="50%"
android:duration="1000"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="infinite" />
</set>在Java代码使用loadAnimation类
btn3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this,R.anim.rotate_animation);
imageView.startAnimation(animation);
}
});3.2.2.4 平移动画
-
在
res目录下的anim文件夹中创建一个XML文件，例如translate_animation.xml。 -
在
translate_animation.xml文件中定义平移动画的属性和值。下面实现了一个沿着X轴正方向平移200个像素的动画效果：
fromXDelta：动画开始时的X轴平移距离。toXDelta：动画结束时的X轴平移距离。duration：动画持续时间，以毫秒为单位。interpolator：动画的插值器，用于控制动画的速度变化。在示例中，我们使用了默认的加速减速插值器。
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0"
android:toXDelta="200"
android:duration="1000"
android:interpolator="@android:anim/accelerate_decelerate_interpolator" />
</set>Java代码中使用AnimationUtils.loadAnimation()方法加载并应用平移动画。
btn4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this,R.anim.translate_animation);
imageView.startAnimation(animation);
}
});综合上面几个：
xml文件：
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".alpha_test">
<Button
android:id="@+id/btn_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="透明度动画"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.034"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.083" />
<Button
android:id="@+id/btn_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="缩放动画"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.043"
app:layout_constraintStart_toEndOf="@+id/btn_1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.083" />
<Button
android:id="@+id/btn_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="旋转动画"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.072"
app:layout_constraintStart_toEndOf="@+id/btn_2"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.083" />
<Button
android:id="@+id/btn_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="位移动画"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.242"
app:layout_constraintStart_toEndOf="@+id/btn_3"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.083" />
<ImageView
android:id="@+id/img_1"
android:layout_width="200dp"
android:layout_height="200dp"
android:src="@drawable/img_1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.694" />
</androidx.constraintlayout.widget.ConstraintLayout>java代码：
package com.gxy.animator_test;
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.ImageView;
public class alpha_test extends AppCompatActivity {
private ImageView imageView;
private Button btn1,btn2,btn3,btn4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_alpha_test);
imageView = findViewById(R.id.img_1);
btn1 = findViewById(R.id.btn_1);
btn2 = findViewById(R.id.btn_2);
btn3 = findViewById(R.id.btn_3);
btn4 = findViewById(R.id.btn_4);
btn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this, R.anim.fade_in);
imageView.startAnimation(animation);
}
});
btn2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this,R.anim.scale_animation);
imageView.startAnimation(animation);
}
});
btn3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this,R.anim.rotate_animation);
imageView.startAnimation(animation);
}
});
btn4.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(alpha_test.this,R.anim.translate_animation);
imageView.startAnimation(animation);
}
});
}
}3.2.3 在Java代码中实现补间动画
当在Java代码中实现四种动画时，可以使用AnimationSet类结合AlphaAnimation、ScaleAnimation、RotateAnimation和TranslateAnimation来实现组合动画效果。
3.2.3.1 具体解释（例如各方法的属性值，方法构造的参数值）
（1）透明度动画 (AlphaAnimation)：
AlphaAnimation(float fromAlpha, float toAlpha)-
fromAlpha: 动画开始时的透明度，取值范围为0.0到1.0，其中0.0表示完全透明，1.0表示完全不透明。 -
toAlpha: 动画结束时的透明度，取值范围也为0.0到1.0。
（2）缩放动画 (ScaleAnimation)：
ScaleAnimation(float fromX, float toX, float fromY, float toY)设置动画的水平和垂直方向的缩放比例。fromX和fromY是起始缩放比例，toX和toY是结束缩放比例。例如，fromX = 1.0f, toX = 0.5f, fromY = 1.0f, toY = 0.5f表示从原始大小缩放到水平方向缩小一半，垂直方向缩小一半
ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)-
fromX: 动画开始时水平方向的缩放比例，1.0为原大小。 -
toX: 动画结束时水平方向的缩放比例。 -
fromY: 动画开始时垂直方向的缩放比例，1.0表示原大小。 -
toY: 动画结束时垂直方向的缩放比例。 -
pivotXType: 定义pivotXValue的类型，旋转中心点的X坐标类型，可以是以下三个常量之一：-
Animation.RELATIVE_TO_SELF：表示相对于自身的比例值（0表示视图顶边缘，1表示视图底边缘）。 -
Animation.ABSOLUTE：表示绝对坐标值。 -
Animation.RELATIVE_TO_PARENT表示相对于父容器的比例值（0表示父容器顶边缘，1表示父容器底边缘）。
-
-
pivotXValue: 旋转中心点的X坐标值，具体取值根据pivotXType来确定：如果pivotXType为Animation.RELATIVE_TO_SELF，则pivotXValue表示相对于视图宽度的比例值，例如，0.5表示视图的水平中心点。 -
pivotYType: 定义pivotYValue的类型，可选值为Animation.ABSOLUTE、Animation.RELATIVE_TO_SELF或Animation.RELATIVE_TO_PARENT。 -
pivotYValue: -
旋转中心点的Y坐标值，具体取值根据
pivotYType来确定：-
如果
pivotYType为Animation.RELATIVE_TO_SELF，则pivotYValue表示相对于视图高度的比例值，例如，0.5表示视图的垂直中心点。 -
如果
pivotYType为Animation.ABSOLUTE，则pivotYValue表示绝对的Y坐标值。
-
（3）旋转动画 (RotateAnimation)：
RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)-
fromDegrees：动画的起始旋转角度，单位为度（degrees）。 -
toDegrees：动画的结束旋转角度，单位为度（degrees）。剩下同上一个动画解释
（4）平移动画 (TranslateAnimation)：
TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)-
fromXDelta: 动画开始时X轴方向的平移距离，可以是正值表示向右平移，负值表示向左平移。 -
toXDelta: 动画结束时X轴方向的平移距离，同样可以是正值或负值。 -
fromYDelta: 动画开始时Y轴方向的平移距离，可以是正值表示向下平移，负值表示向上平移。 -
toYDelta: 动画结束时Y轴方向的平移距离，同样可以是正值或负值。
通过理解这些构造参数的含义，你可以根据需要调整每个动画的效果，创建出适合你的动画效果。
推荐博客：(18条消息) 【Android】补间动画用法最全详解android 补间动画Teacher.Hu的博客-CSDN博客
package com.gxy.animator_test;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.Button;
import android.widget.ImageView;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.AppCompatImageView;
public class java_animation extends AppCompatActivity {
private ImageView imageView;
private Button btnStart;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_java_animation);
imageView = findViewById(R.id.img_ii);
btnStart = findViewById(R.id.btn_start);
btnStart.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAnimation();
}
});
}
private void startAnimation() {
// 创建动画集合
AnimationSet animationSet = new AnimationSet(true);
// 创建透明度动画
Animation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
alphaAnimation.setDuration(1000);
alphaAnimation.setFillAfter(true);
// 创建缩放动画
Animation scaleAnimation = new ScaleAnimation(1.0f, 0.5f, 1.0f, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
scaleAnimation.setDuration(1000);
scaleAnimation.setFillAfter(true);
// 创建旋转动画
Animation rotateAnimation = new RotateAnimation(0, 180,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
rotateAnimation.setDuration(1000);
rotateAnimation.setFillAfter(true);
// 创建平移动画
Animation translateAnimation = new TranslateAnimation(0, 200, 0, 200);
translateAnimation.setDuration(1000);
translateAnimation.setFillAfter(true);
// 将四种动画添加到动画集合中
animationSet.addAnimation(alphaAnimation);
animationSet.addAnimation(scaleAnimation);
animationSet.addAnimation(rotateAnimation);
animationSet.addAnimation(translateAnimation);
// 启动动画集合
imageView.startAnimation(animationSet);
}
}上述代码创建了一个包含透明度、缩放、旋转和平移动画的动画集合AnimationSet。每个动画都有自己的设置，如起始值、结束值、持续时间和是否保持最后状态。然后，我们将这四种动画添加到动画集合中，并通过调用startAnimation()方法启动动画集合，将组合动画效果应用到imageView上。
3.3 属性动画
搁置一下下。。。。
学习：Android-Animation-Set/property-animation at master · OCNYang/Android-Animation-Set · GitHub
1 属性动画是Android中一种强大的动画机制，用于实现对任意对象的属性进行动画效果的修改。与传统的补间动画相比，属性动画可以对任意对象的属性进行动画操作，而不仅限于View对象。
2 属性动画使用ValueAnimator、ObjectAnimator等类来创建和管理动画，并通过AnimatorSet来组合多个动画一起播放。以下是属性动画的几个关键类：
-
ValueAnimator：用于在一定时间范围内对属性值进行平滑的动画过渡。 -
ObjectAnimator：是ValueAnimator的子类，用于对一个对象的指定属性进行动画效果的修改。 -
AnimatorSet：用于组合多个动画一起播放，并可以设置动画的播放顺序（顺序播放、同时播放、先后播放等）。
3 属性动画的使用步骤：
-
创建
ValueAnimator或ObjectAnimator对象：根据需求创建对应的动画对象，指定目标对象、属性、起始值和结束值等参数。 -
设置动画的监听器（可选）：通过设置动画的监听器来监听动画的状态变化，例如动画开始、结束、重复等。
-
启动动画：调用动画对象的
start()方法启动动画，动画系统会自动计算属性值的变化，并在动画时间内平滑地将属性值过渡到目标值，实现动画效果。
后面继续学习其他的动画，具体会参照这个学习GitHub - OCNYang/Android-Animation-Set: 📚 Android 所有动画系列详尽教程。 Explain all animations in Android.
786
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
