Material Animations 1:Content Transitions

項(xiàng)目地址:https://github.com/SherlockShi/AndroidMaterialAnimationPractise

一、前言

同overridePendingTransition()方法執(zhí)行效果類似

Content Transition也稱為Transitions between Activities,或Enter/Exit Transition,包括下圖4個(gè)部分(本圖截取自Udacity):

Content Transition執(zhí)行過程
  • 1. Exit A: 離開A界面時(shí)的轉(zhuǎn)換動畫
  • 2. Enter B: 進(jìn)入B界面時(shí)的轉(zhuǎn)換動畫
  • 3. Return B: 從B界面返回時(shí)的轉(zhuǎn)換動畫;可不設(shè)置,默認(rèn)執(zhí)行Enter B的逆過程
  • 4. Reenter A: 重新進(jìn)入A界面時(shí)的轉(zhuǎn)換動畫;可不設(shè)置,默認(rèn)執(zhí)行Exit A的逆過程

二、效果圖

三、實(shí)現(xiàn)方法

1. 編碼實(shí)現(xiàn)

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);
}

由于大部分相關(guān)API只支持API 19以上版本,甚至只支持API 21以上版本,因此需要添加如下判斷:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  ...
}

2. XML & Code實(shí)例化實(shí)現(xiàn)

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實(shí)例化

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聲明式實(shí)現(xiàn)(強(qiáng)烈推薦)

3.1 定義XML

如果沒有其它屬性要求,本步驟可跳過,直接在下一步使用系統(tǒng)定義好的XML

XML & Code實(shí)例化實(shí)現(xiàn)一樣,聲明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>

也可以直接使用系統(tǒng)提供的過渡效果:

<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(非必須)

如果上一個(gè)步驟繼承的父主題不是AppCompt相關(guān)主題,還需要在styles.xml文件中聲明:

<item name="android:windowContentTransitions">true</item>

4. 跳轉(zhuǎn)

startActivity(new Intent(ActivityA.this, ActivityB.class),
                ActivityOptionsCompat.makeSceneTransitionAnimation(ActivityA.this).toBundle());

5. 返回

finishAfterTransition();

四、參考資料

https://github.com/lgvalle/Material-Animations

PS:歡迎關(guān)注SherlockShi博客

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容