为什么场景过渡期间视图会被剪切？

Question

我有一个场景过渡，用于将一种布局动画化为另一种布局。 进入动画效果很好，而退出动画看起来好像视图被目标布局的边界所裁剪。 我该如何解决？

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)

    val sceneRoot = findViewById<ViewGroup>(R.id.scene_root)

    val fabCompactViewGroup = layoutInflater.inflate(R.layout.fab_menu_compact, sceneRoot, false) as ViewGroup
    val fabExpandedViewGroup = layoutInflater.inflate(R.layout.fab_menu_expanded, sceneRoot, false) as ViewGroup

    fabCompactScene = Scene(sceneRoot, fabCompactViewGroup)
    fabExpandedScene = Scene(sceneRoot, fabExpandedViewGroup)

    revealManager = TransitionInflater.from(this).inflateTransition(R.transition.fab_reveal_transition)
    dismissManager = TransitionInflater.from(this).inflateTransition(R.transition.fab_dismiss_transition)

    currentScene = fabCompactScene

    fabCompactScene?.let { TransitionManager.go(it, dismissManager) }

    fabCompactViewGroup.findViewById<FloatingActionButton?>(R.id.fab_compact)?.setOnClickListener(this)
    fabExpandedViewGroup.findViewById<FloatingActionButton?>(R.id.fab_compact)?.setOnClickListener(this)
    fabExpandedViewGroup.findViewById<FloatingActionButton?>(R.id.fab_expanded1)?.setOnClickListener {
        Toast.makeText(this, "Expanded 1 Clicked", Toast.LENGTH_SHORT).show()
    }
}

override fun onClick(v: View?) {
    if(currentScene == fabCompactScene) {
        currentScene = fabExpandedScene
        fabExpandedScene?.let { TransitionManager.go(it, revealManager) }
    } else {
        currentScene = fabCompactScene
        fabCompactScene?.let { TransitionManager.go(it, dismissManager) }
    }
}

FAB过渡GIF

Answer 1

发生这种情况是因为动画视图的父级ViewGroup 。 默认情况下， ViewGroup不会绘制超出父级边界的子级部分。 要解决此问题，请将此行添加到动画视图的父ViewGroup

android:clipChildren="false"
android:clipToPadding="false"

或以编程方式

viewGroup.setClipChildren(false);
viewGroup.setClipToPadding(false);