实现Android 转场动画：从Button点击到Activity，并返回时缩小
在开发Android应用时，转场动画可以使应用的用户体验更加流畅和美观。本篇文章旨在带领你实现一个简单的转场动画，点击Button进入新的Activity，返回时使原Activity中的Button逐渐缩小。我们将通过步骤表、代码示例、关系图和旅行图深入了解整个流程。
整体流程
在实现目标之前，我们先概述一下整个流程，以下是需要完成的步骤：
| 步骤 | 描述 |
|---|---|
| 1 | 创建布局文件，包括Button和Activity布局 |
| 2 | 实现点击Button的逻辑，启动新的Activity |
| 3 | 在第二个Activity中，定义返回时的动画 |
| 4 | 配置Activity转场动画的细节 |
每一步的实现细节
1. 创建布局文件
activity_main.xml（主界面布局）
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="点击我"
android:layout_centerInParent="true"/>
</RelativeLayout>
这个布局文件定义了一个简单的RelativeLayout，中央有一个Button。
activity_second.xml（第二个Activity布局）
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这是第一个Activity"
android:layout_centerInParent="true"/>
</RelativeLayout>
本例中，第二个Activity包含一个简单的TextView，表示它是另一个界面。
2. 实现点击Button的逻辑，启动新的Activity
在主Activity（MainActivity.java）中，我们将为Button设置点击事件，以便当用户点击时，启动SecondActivity。
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button button = findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 创建意图以启动SecondActivity
Intent intent = new Intent(MainActivity.this, SecondActivity.class);
// 开始Activity
startActivity(intent);
// 添加转场动画
overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out);
}
});
}
}
在这个代码中，我们使用Intent启动SecondActivity，并添加了简单的淡入淡出动画。
3. 在第二个Activity中，定义返回时的动画
在SecondActivity中，我们重写onBackPressed方法，并在其中添加动画。
public class SecondActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_second);
}
@Override
public void onBackPressed() {
super.onBackPressed();
// 返回时缩小动画
overridePendingTransition(0, R.anim.shrink);
}
}
在返回时，我们使用了重写的onBackPressed方法来添加一个缩小的动画。
4. 创建缩小动画资源文件
在res/anim/目录下创建shrink.xml动画文件。
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="
android:fromXScale="1"
android:toXScale="0"
android:fromYScale="1"
android:toYScale="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="300"/>
这个动画文件定义了一个缩小动画，从原始的大小缩放到0。
关系图示意
erDiagram
MAIN_ACTIVITY {
+Button button
}
SECOND_ACTIVITY {
+TextView textview
}
MAIN_ACTIVITY ||--o{ BUTTON : "click"
SECOND_ACTIVITY ||--o{ BACK : "back"
这个关系图描述了三个主要组件之间的关系：主Activity、Button以及第二个Activity。
旅行图示意
journey
title 用户点击Button转场
section 从MainActivity到SecondActivity
用户点击Button: 5: 用户
启动SecondActivity: 4: 应用
淡入动画: 3: 应用
section 从SecondActivity返回MainActivity
点击返回: 5: 用户
缩小动画: 4: 应用
返回MainActivity: 3: 应用
这个旅行图描绘了用户从MainActivity点击Button进入SecondActivity的过程，以及从SecondActivity返回的过程。
结尾
通过以上步骤，你应该能实现一个简单的动画转场效果。在Android应用中，为界面提供顺畅的过渡效果，可以显著提高用户的使用体验。希望本文能帮助您深入理解Android中的转场动画，以及如何在实际应用中进行实现。记得多加练习，并逐步探索更复杂的动画效果！
