How to make dimming effect of Youtube when motionLayout transitions from start to end?

Viewed 28

I'm trying to make this effect but has no idea, how to achieve it:
enter image description here

My idea is to have a Frame Layout which wraps the video fragment, and the Video fragment has motion Layout as its root layout. So, Frame Layout is in main Activity, but motion Layout is inside a .xml file, which will soon be inflated as the Video fragment's layout. It looks something like this (The frag container will match parent in its width and height):
enter image description here

My questions are:

  1. Is this a good idea to make this transition?
  2. How to make the dimming effects that YouTube has? I'm planning to use this Listener for tracking the transition but has no idea how to make the slowly dimming effect :(. MotionLayout.TransitionListener

Any idea?

1 Answers

One way I can think of cover the screen with a a View that is #000000 and transition the views color to #FF000000 using a custom Attribute.

The View would need to be gone, Invisible, or translationZ = -1 at the start

Related