Shared element transition - animate only the visible part of the shared view

Question

I'm working in an app that is similar to Google Calendar...

1. There are events and when a user click one, the event grows and transforms into the detail view.
2. The shared views (the events) are inside a ScrollView, so at some point those views may be partially visible.
3. The problem is that when one partially visible View is selected, the full View appears above all and then the animation runs.

Here is a capture of the problem:

What can I do to make the Transition take only the visible part of the View to animate it?

This is my transition:

<changeBounds xmlns:android="http://schemas.android.com/apk/res/android">
   <arcMotion android:minimumHorizontalAngle="15"
       android:minimumVerticalAngle="0"
       android:maximumAngle="90"/>
</changeBounds>

Answer 1

Shared elements are drawn on top of the entire view hierarchy. You can disable this by setting Window#setSharedElementsUseOverlay(false) in your Activities, but this will result in undesired effects. More details here and on YouTube.

The better solution is to use shared elements transition between Fragments. More details here.