Snippet and alpha release

Question

I use FragmentTransitionalong with SharedElementTransitionbetween 2 Fragments.

The actual transition of the element and the transition Fragmentconsist of a set of different transitions to create the desired animation, I have no problems with the animation, but they include all the transitions used for clarity:

    val moveElementTransition: Transition  by lazy { TransitionInflater.from(context).inflateTransition(android.R.transition.move) }
    val noElementTransition:Transition by lazy { TransitionSet().addTransition(TransitionInflater.from(context).inflateTransition(android.R.transition.no_transition)) }
    val exitTransition: Transition by lazy { TransitionSet().addTransition(TransitionInflater.from(context).inflateTransition(android.R.transition.slide_left)).setDuration(200L).setStartDelay(0L) }
    val reenterTransition: Transition by lazy { TransitionSet().addTransition(TransitionInflater.from(context).inflateTransition(android.R.transition.slide_left)).setDuration(200L).setStartDelay(450L) }
    val enterTransition: Transition by lazy { TransitionSet().addTransition(TransitionInflater.from(context).inflateTransition(android.R.transition.slide_bottom)).setDuration(200L).setStartDelay(400L) }

Question

To clarify, all transitions "work" when moving from FragmentAto FragmentBand when I step back and drop the animation.

However, all alpha settings on the views (including CardViewangles and Viewalpha) are incorrect while the transition is in progress. The result is clearly ugly, while the transition occurs, any alpha appears incorrectly (a more multiplied effect than the overlay). It seems that alpha viewing is not supported correctly on fragment transitions?

An example of an alpha vignette that I use inside some types:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
    <gradient
        android:angle="0"
        android:endColor="@android:color/transparent"
        android:startColor="@color/colorWindowBackgroundTint"
        android:type="linear"/>
</shape>

Screengrab about how the vignette looks normal on the left, and how it looks during the fragmentation animation:

Has anyone else encountered this problem, and if so, does it fix them?

EDIT:

As requested, I created a small test application that replicates this behavior (tested on the api emulator 23/24/25) - link: https://github.com/TreeFrogApps/FragmentTransitionTest

Answer 1

, , B. -, , , . , , . :

, , , . , .

-, . - . , . .

shape_vignette_left.xml

<shape 
    android:shape="rectangle">
    <gradient
        android:angle="0"
        android:startColor="#FF303F9F"
        android:endColor="#00303F9F"
        android:type="linear" />
</shape>

, .

, . ( ) . , , :

shape_vignette_right.xml

<shape 
    android:shape="rectangle">
    <gradient
        android:angle="0"
        android:startColor="#00303F9F"
        android:endColor="#FF303F9F"
        android:type="linear" />
</shape>

:

fragment_b_layout.xml

<FrameLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <View
        android:layout_width="64dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="@drawable/shape_vignette_left" />

    <View
        android:layout_width="64dp"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:background="@drawable/shape_vignette_right" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="Fragment B"
        android:textColor="@android:color/white" />

</FrameLayout>

:

.

---

( ) / "# FF303F9F" "@android: /":

, / "# FF303F9F" "# 00303F9F". , , , ( "# FF303F9F" ) ( "# 00303F9F" ).