記一次Android共享元素動畫效果顯示有問題_GG_Jin

bug描述

設計同學想搞一個點選圖片item，item內的圖片移動到新頁面的圖片位置的效果，一想就是共享元素就能搞定啊。

``` companion object { fun gotoDetail( context: Activity, dynamicId: String?, jumpComment: Boolean = false, shareElement: Boolean = false, imageView: ImageView? = null, nameView: TextView? = null, avatarView: ImageView? = null, ) { LogUtils.w(shareElement) if (shareElement) { val intent = Intent(context, HomeDynamicDetailAcitvity::class.java) intent.putExtra("dynamicId", dynamicId ?: "") intent.putExtra("jumpComment", jumpComment) intent.putExtra("shareElement", shareElement) val options = ActivityOptions .makeSceneTransitionAnimation( context, UtilPair.create(imageView, context.getString(R.string.dynamic_start_top_image)), UtilPair.create(avatarView, context.getString(R.string.dynamic_start_avatar)), UtilPair.create(nameView, context.getString(R.string.dynamic_start_name)) ) // val options = ActivityOptions.makeSceneTransitionAnimation(context, imageView, context.getString(R.string.dynamic_start_top_image))

            // start the new activity
            ActivityCompat.startActivity(context, intent, options.toBundle())
        } else {
            val params = HashMap<String, Any>()
            params["dynamicId"] = dynamicId ?: ""
            params["jumpComment"] = jumpComment
            context.toActivity(RoutePath.HOME_DYNAMIC_DETAIL, params)

        }
    }
}

```

結果按照文件寫了一下，但是效果卻有問題。通過把動畫時長放到5x的情況下，發現不是正常的平移動畫，而是先顯示一個小的圖片然後再漸漸隱藏，然後新介面的大圖片再漸漸顯示，動畫效果明顯不對啊。

共享元素不正常.gif

官方文件

要在具有一個共享元素的兩個 Activity 之間新增螢幕過渡動畫，請執行以下操作：

在主題背景中啟用視窗內容過渡。
在樣式中指定共享元素過渡。

將過渡定義為 XML 資源。
使用 android:transitionName 屬性為兩個佈局中的共享元素指定一個通用名稱。

使用 ActivityOptions.makeSceneTransitionAnimation() 函式。

解決流程

百度了一下看看有沒有人遇到類似的問題，但是並沒有。也對應修改了一下style主題什麼的，也沒有什麼作用。最後想了想，又新建了一個專案，寫個demo測試了一下，上面的自己寫的程式碼並沒有上面問題，既然沒有問題，那就是專案程式碼裡面有問題了，和demo最大的區別就是專案裡有網路請求，以及圖片載入的操作。確定了不確定的地方那就試試看。

supportPostponeEnterTransition()

supportStartPostponedEnterTransition()

一個暫停的方法，一個開始動畫的方法，一進入就暫停動畫，網路請求或者圖片載入結束後開始動畫，搞定問題。最後看效果。

共享元素正常.gif

ok解決收工