Android 2.0之后可以通过overridePendingTransition()给Activity增加切换动画.而在Android5.X中,Google对动画效果进行了更深一步的诠释,为Activity的跳转设计了更加丰富的动画效果。
以下是效果图:
建议拖到 “效果图的具体实现代码”,将代码运行一遍,再重新看原理,速度就会快很多。
Android 5.X提供了三种Transition类型
- 进入:一个进入过渡动画决定Activity中的所有视图怎么进入屏幕
- 退出:一个退出的渡动画决定Activity中的所有视图怎么退出屏幕
- 共享元素:一个共享元素过渡动画决定两个Activity之间的过渡,怎么共享它们的视图
其中,进入效果和退出效果包括:
- explode(分解) ——从屏幕中间进或出,移动视图
- slide(滑动) ——从屏幕边缘进或出,移动视图
- fade(淡出) ——通过改变屏幕上视图的不透明度达到添加或移除视图
共享元素包括:
- changeBounds ——改变目标视图的布局边界
- changeClipBounds——裁剪目标视图边界
- changeTransform——改变目标视图的缩放比例和旋转角度
- changeImageTransform——改变目标图片的大小和缩放比例
以上元素属性配置时,系统会自动设置..
具体操作
首先先看进入与退出三种过渡动画##
例如从MainActivity跳转到Main2ActivityB,只需要在MainActivity中将基本的startActivity(intent)方法改成如下代码:
startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());
而在Main2Activity中,只需要设置如下所示代码:
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);//这句要写在setContentView()前,具体原因到时再补充
或
<!-- 允许使用transitions,放在主题Style里 -->
<item name="android:windowContentTransitions">true</item>
接下来就可以设置进入动画,在Main2Activity设置,代码如下:
//同样,都是要写在setContentView()前面
getWindow().setEnterTransition(new Explode());
getWindow().setEnterTransition(new Slide());
getWindow().setEnterTransition(new Fade());
退出动画设置为,代码如下:
//同样,都是要写在setContentView()前面
getWindow().setExitTransition(new Explode());
getWindow().setExitTransition(new Slide());
getWindow().setExitTransition(new Fade());
共享元素效果
第一章图片中的Android机器人就是共享元素,即Activity1与Activity2都拥有的元素,在Activity1跳转到Activity2的时候,其他元素消失,而共享元素——Android机器人通过动画效果直接显示到Activity2中。
所以,要想在程序中使用共享元素的动画效果,需要再Activity1的布局文件中设置共享元素,即给对应控件增加相关属性,代码如下:
android:transitionName="XXX"<!--该值任意-->
同时在Activity2的布局文件中,给要实现共享效果的元素也增加相同的属性,代码如下:
android:transitionName="XXX"<!--该值应与其相同,系统才能找到共享元素-->
如果只有一个共享元素,Activity1中只需要使用如下代码:
//view为共享元素,share为指定transitionName="XXX"对应的XXX
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this, view,"share")).toBundle());
如果有多个共享属性,可以通过Pair.create()来创建多个共享元素,代码如下:
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this,
Pair.create(view,"share"),Pair.create(fab,"fab")).toBundle());
到这里所有的步骤就完成。
效果图的具体实现代码
“跳转按钮”是Android2.0使用overridePendingTransition()的实现,所以以下代码不会给出..
MainActivity代码如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
//如果报错就在每个方法前加上@TargetApi(Build.VERSION_CODES.LOLLIPOP),主要是为了防止版本太低
public void explode(View v) {
Intent intent = new Intent(this, Main2Activity.class);
intent.putExtra("flag", 0);
startActivity(intent,
ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());
}
public void slide(View v) {
Intent intent = new Intent(this, Main2Activity.class);
intent.putExtra("flag", 1);
startActivity(intent,
ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());
}
public void fade(View view) {
Intent intent = new Intent(this, Main2Activity.class);
intent.putExtra("flag", 2);
startActivity(intent,
ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());
}
public void share(View view) {
Toast.makeText(MainActivity.this, "aaaaa", Toast.LENGTH_SHORT).show();
View fab = findViewById(R.id.fab_button);
Intent intent = new Intent(this, Main2Activity.class);
intent.putExtra("flag", 3);
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this, Pair.create(view,"share"),Pair.create(fab,"fab")).toBundle());
}
}
MainActivity的Xml代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:orientation="vertical"
tools:context=".activitys.MainActivity">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="explode"
android:onClick="explode"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="slide"
android:onClick="slide"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="fade"
android:onClick="fade"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="share"
android:transitionName="share"<!--设置共享元素属性share-->
android:onClick="share"/>
<Button
android:id="@+id/fab_button"
android:layout_width="80dp"
android:layout_height="80dp"
android:background="@drawable/aaa"
android:transitionName="fab"<!--设置共享元素属性fab-->
android:elevation="5dp"
/>
</LinearLayout>
但其实在MainActivity的xml中,transitionName其实不设置代码也是没问题的,有兴趣可以去试试。因为在MainActivity的代码的ActivityOptions.makeSceneTransitionAnimation(MainActivity.this, Pair.create(view,”share”),Pair.create(fab,”fab”)).toBundle())中,view与fab 其实就是那两个Button。
Main2Activity代码:
public class Main2Activity extends AppCompatActivity {
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
int flag = getIntent().getExtras().getInt("flag");
switch (flag){
case 0://explode
getWindow().setEnterTransition(new Explode());
getWindow().setExitTransition(new Explode());
break;
case 1://slide
getWindow().setEnterTransition(new Slide());
getWindow().setExitTransition(new Slide());
break;
case 2://fade
getWindow().setEnterTransition(new Fade());
getWindow().setExitTransition(new Fade());
break;
case 3://不用任何操作
break;
}
setContentView(R.layout.activity_main2);
}
}
Main2Activity的Xml代码:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".activitys.Main2Activity">
<View
android:id="@+id/holder_view"
android:layout_width="match_parent"
android:layout_height="300dp"
android:transitionName="share"<!--android:transitionName属性share-->
android:background="#4cA3D2"/>
<Button
android:transitionName="fab"<!--transitionName属性fab-->
android:layout_width="56dp"
android:layout_height="56dp"
android:background="@drawable/aaa"
android:elevation="5dp"
android:layout_below="@+id/holder_view"
android:layout_marginTop="-26dp"
android:layout_alignParentEnd="true"
android:layout_marginRight="20dp"
android:layout_alignParentRight="true" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/holder_view">
<Button
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginTop="10dp"
android:id="@+id/button4"
/>
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#4cA3D2"
android:layout_below="@+id/button4"
/>
</RelativeLayout>
</RelativeLayout>