MaterialContainerTransform-基础使用

MaterialContainerTransform-基础使用

MaterialContainerTransform是google在 com.google.android,material:material 中提供的转场动效库。

这里对基础的使用做一个总结方便以后查阅。

对于A到B Activity专场的场景中

A-Activity

转场前需要先在onCreate做的设置

// 设置window transition
window.requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS)
// 设置回退的效果为MaterialContainerTransform
setExitSharedElementCallback(MaterialContainerTransformSharedElementCallback())
// Set up shared element transition and disable overlay so views don't show above system bars
window.sharedElementsUseOverlay = false

在点击的时候设置启动的ActivityOption

val intent = Intent(this, TransformSecActivity::class.java)
// 参数二指定共享的元素对象 参数三指定共享的元素关联名称
val options = ActivityOptions.makeSceneTransitionAnimation(
    this, gridCardView, "shared_element_end_root"
)
startActivity(intent, options.toBundle())

B-Activity

B-Activity的所有设置均在onCreate中完成

getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);
// Set up shared element transition
findViewById(android.R.id.content).setTransitionName("shared_element_end_root");
setEnterSharedElementCallback(new MaterialContainerTransformSharedElementCallback());
getWindow().setSharedElementEnterTransition(buildContainerTransform(true));
getWindow().setSharedElementReturnTransition(buildContainerTransform(false));
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

调整Transform的持续时间和曲线，及统一前后的Container颜色

private MaterialContainerTransform buildContainerTransform(boolean entering) {
    MaterialContainerTransform transform = new MaterialContainerTransform(this, entering);
    // Use all 3 container layer colors since this transform can be configured using any fade mode
    // and some of the start views don't have a background and the end view doesn't have a
    // background.
    transform.setAllContainerColors(MaterialColors.getColor(findViewById(android.R.id.content), com.google.android.material.R.attr.colorSurface));
    transform.addTarget(android.R.id.content);
    transform.setDuration(600);
    transform.setInterpolator(new FastOutSlowInInterpolator());
    //        transform.setFadeMode(getFadeMode());
    //        transform.setDrawDebugEnabled(isDrawDebugEnabled());
    return transform;
}