項目地址:https://github.com/SherlockShi/AndroidMaterialAnimationPractise
一、前言
同overridePendingTransition()方法執行效果類似
Content Transition也稱為Transitions between Activities,或Enter/Exit Transition,包括下圖4個部分(本圖截取自Udacity):
Content Transition執行過程
- 1. Exit A: 離開A界面時的轉換動畫
- 2. Enter B: 進入B界面時的轉換動畫
-
3. Return B: 從B界面返回時的轉換動畫;可不設置,默認執行
Enter B
的逆過程 -
4. Reenter A: 重新進入A界面時的轉換動畫;可不設置,默認執行
Exit A
的逆過程
二、效果圖
三、實現方法
1. 編碼實現
ActivityA.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_a);
setupWindowAnimations();
}
private void setupWindowAnimations() {
Slide slide = new Slide();
slide.setDuration(500);
slide.setSlideEdge(Gravity.LEFT);
getWindow().setExitTransition(slide);
// getWindow().setReenterTransition(slide);
}
ActivityB.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_b);
setupWindowAnimations();
}
private void setupWindowAnimations() {
Fade fade = new Fade();
fade.setDuration(500);
getWindow().setEnterTransition(fade);
// getWindow().setReturnTransition(slide);
}
由于大部分相關API只支持API 19以上版本,甚至只支持API 21以上版本,因此需要添加如下判斷:
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
...
}
2. XML & Code實例化實現
2.1 定義XML
res/transition-v21/fade.xml
<?xml version="1.0" encoding="utf-8"?>
<fade xmlns:android="http://schemas.android.com/apk/res/"
android:duration="500"/>
res/transition-v21/slide.xml
<?xml version="1.0" encoding="utf-8"?>
<slide xmlns:android="http://schemas.android.com/apk/res/"
android:duration="500"/>
2.2 Code實例化
ActivityA.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_a);
setupWindowAnimations();
}
private void setupWindowAnimations() {
Slide slide = TransitionInflater.from(this).inflateTransition(R.transition.slide);
getWindow().setExitTransition(slide);
}
ActivityB.java
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_b);
setupWindowAnimations();
}
private void setupWindowAnimations() {
Fade fade = TransitionInflater.from(this).inflateTransition(R.transition.fade);
getWindow().setEnterTransition(fade);
}
3. XML & Style聲明式實現(強烈推薦)
3.1 定義XML
如果沒有其它屬性要求,本步驟可跳過,直接在下一步使用系統定義好的XML
同XML & Code實例化實現
一樣,聲明XML文件
res/transition-v21/fade.xml
<?xml version="1.0" encoding="utf-8"?>
<fade xmlns:android="http://schemas.android.com/apk/res/"
android:duration="500"/>
res/transition-v21/slide.xml
<?xml version="1.0" encoding="utf-8"?>
<slide xmlns:android="http://schemas.android.com/apk/res/"
android:duration="500"/>
3.2 Style文件聲明
res/values-v21/styles.xml
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<item name="android:windowExitTransition">@transition/slide</item>
<item name="android:windowReenterTransition">@transition/slide</item>
<item name="android:windowEnterTransition">@transition/slide</item>
<item name="android:windowReturnTransition">@transition/slide</item>
</style>
也可以直接使用系統提供的過渡效果:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<item name="android:windowExitTransition">@android:transition/slide_left</item>
<item name="android:windowReenterTransition">@android:transition/slide_left</item>
<item name="android:windowEnterTransition">@android:transition/slide_right</item>
<item name="android:windowReturnTransition">@android:transition/slide_right</item>
</style>
3.3 聲明打開Content Transitions(非必須)
如果上一個步驟繼承的父主題不是AppCompt相關主題,還需要在styles.xml文件中聲明:
<item name="android:windowContentTransitions">true</item>
4. 跳轉
startActivity(new Intent(ActivityA.this, ActivityB.class),
ActivityOptionsCompat.makeSceneTransitionAnimation(ActivityA.this).toBundle());
5. 返回
finishAfterTransition();
四、參考資料
https://github.com/lgvalle/Material-Animations
PS:歡迎關注SherlockShi博客