Android共享元素转场后第二个Activity中LayerList形状丢失求助

Hey there, I’ve faced this exact issue before when working with LayerList drawables in shared element transitions—total headache when the rounded corners (or whatever custom shape you’ve built) vanish right after the transition finishes! Let me break down what’s going on and how to fix it.

Why This Happens #

The default shared element transition works by taking a bitmap snapshot of the shared view in your first Activity, then animating that snapshot to match the position/size of the corresponding view in the second Activity. The problem? LayerList drawables are layered vector/shape assets, not static bitmaps. Once the transition ends, the second Activity’s ImageView gets stuck displaying the flat snapshot instead of reloading the original LayerList with its structural shape properties.

Step-by-Step Fixes #

1. Double-Check Transition Names (Basic but Critical)

First, make sure both ImageViews have the exact same transitionName in their layout files—this is easy to overlook and breaks transitions entirely if mismatched:

<!-- Activity 1 Layout -->
<ImageView
    android:id="@+id/shared_image"
    android:transitionName="shared_image_transition"
    android:background="@drawable/your_layer_list" />

<!-- Activity 2 Layout -->
<ImageView
    android:id="@+id/shared_image_second"
    android:transitionName="shared_image_transition"
    android:background="@drawable/your_layer_list" />

2. Manually Restore the LayerList Post-Transition

The core fix is to force the second Activity’s ImageView to reload the original LayerList once the transition finishes. We’ll use a SharedElementCallback to trigger this at the right moment:

In your second Activity’s onCreate method:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_second);

    // Set up a callback to fix the drawable after transition ends
    setEnterSharedElementCallback(new SharedElementCallback() {
        @Override
        public void onSharedElementEnd(List<String> sharedElementNames, List<View> sharedElements, List<View> sharedElementSnapshots) {
            super.onSharedElementEnd(sharedElementNames, sharedElements, sharedElementSnapshots);
            
            // Locate your shared ImageView
            ImageView sharedImageView = findViewById(R.id.shared_image_second);
            if (sharedImageView != null) {
                // Re-apply the original LayerList drawable
                Drawable originalLayerList = getResources().getDrawable(R.drawable.your_layer_list, getTheme());
                sharedImageView.setBackground(originalLayerList);
                
                // Force the view to redraw and apply the restored drawable
                sharedImageView.invalidate();
            }
        }
    });
}

3. Optional: Disable Bitmap Snapshotting (For Advanced Cases)

If the above fix doesn’t work (e.g., your LayerList has dynamic state changes like press/selected states), you can tell the transition to use the actual drawable instead of a snapshot. Add this to your first Activity when launching the second:

// When starting Activity 2
Intent intent = new Intent(this, SecondActivity.class);
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, sharedImageView, "shared_image_transition");

// Disable bitmap snapshot to preserve drawable structure
options.getSharedElementEnterTransition().setAllowSnapshotting(false);

startActivity(intent, options.toBundle());

Note: This might cause minor performance dips on older devices, but it ensures the drawable’s original structure stays intact throughout the transition.

Quick LayerList Configuration Check #

Make sure your LayerList doesn’t rely on uninitialized state properties that could get lost during the transition. For example, if you’re using a selector inside the LayerList, manually set the correct state post-transition (e.g., sharedImageView.setSelected(true); if your drawable uses a selected state).

Example LayerList for reference:

<!-- res/drawable/layer_list_bg.xml -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#E0E0E0"/>
            <corners android:radius="16dp"/>
        </shape>
    </item>
    <item android:top="2dp" android:left="2dp" android:right="2dp" android:bottom="2dp">
        <shape android:shape="rectangle">
            <solid android:color="#FFFFFF"/>
            <corners android:radius="14dp"/>
        </shape>
    </item>
</layer-list>

This should bring back your LayerList’s original shape once the transition wraps up! Let me know if you hit any edge cases that need tweaking.

内容的提问来源于stack exchange，提问作者john