Android 開發(八十三) Lolipop Activity Transition ShareElement

在android 5.0裡除了新增RecyclerView toolBar之外，另一個最特別的就是
Activity Transition，而且可以根據圖片的位置坐相對應的移動，如上圖，
假設我們的圖片在畫面底部，當點擊完成時，我們會導到另外的頁面，同時該圖片會從原本的位置移動到新的Activity放的位置. 這會增加很多的user experience. 當然個人也相當喜歡這個功能.

接下來要講如何實作

首先要先有兩個Activity(廢話..)
接著我們必須在Theme底下修改一些參數

 <style name="AppTheme" parent="android:Theme.Material.Light">
        <item name="android:windowSharedElementEnterTransition">
            @transition/change_image_transform</item>
        <item name="android:windowSharedElementExitTransition">
            @transition/change_image_transform</item>
    </style>

這是為了將動畫加入


接著必須在 res/transition/ 加入change_image_transform

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
    <changeBounds />
    <changeImageTransform/>
</transitionSet>

接著當圖片被點擊時

        Intent intent = new Intent(this,NextActivity.class);
        ActivityOptions options = ActivityOptions
                .makeSceneTransitionAnimation(this,
                        Pair.create(event.getView(),
                                NextActivity.VIEW_NAME));
        startActivity(intent, options.toBundle());

利用 view 以及 對應到下個view的參數 NextActivity.VIEW_NAME 產生ActivityOptions

接著在下個Activity裡
img.setTransitionName(VIEW_NAME);

這樣就大功告成了


最後附上github https://github.com/nightbear1009/LolipopActivityTransition