You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

求助:单Activity中两个Fragment的Shared Element转场失效

Fixing Shared Element Transition Between Fragments

Hey there! Let's troubleshoot why your Shared Element Fragment Transition isn't working. From the code snippet you shared, you've got the first piece (setting the transition name) in place, but there are several critical steps missing that are likely blocking the animation from running. Here's what you need to check and fix:

1. Complete the Fragment Transaction with Transition Setup

Your click listener code cuts off, so let's finish that with the necessary transition-enabled logic:

view.findViewById<Button>(R.id.go_button).setOnClickListener {
    val secondFragment = TwoFragment() // Replace with your actual second fragment class
    val fragmentTransaction = parentFragmentManager.beginTransaction()
    
    // Enable reordering - this is essential for transitions to work correctly
    fragmentTransaction.setReorderingAllowed(true)
    // Add the shared element using the same transition name you set earlier
    fragmentTransaction.addSharedElement(sharedView, "test")
    // Replace the current fragment in your container
    fragmentTransaction.replace(R.id.fragment_container, secondFragment)
    // Add to back stack so the user can navigate back with the reverse transition
    fragmentTransaction.addToBackStack(null)
    
    fragmentTransaction.commit()
}

Don't skip setReorderingAllowed(true) — this tells the system it can reorder operations in the transaction to properly execute the transition animation.

2. Match the Transition Name in the Target Fragment

You've set the transition name on the shared view in OneFragment, but you must set the exact same name on the corresponding view in your second fragment. For example, in TwoFragment:

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View {
    val view = inflater.inflate(R.layout.fragment_two, container, false)
    val sharedTargetView = view.findViewById<View>(R.id.shared_view_in_two) // Use your actual view ID
    ViewCompat.setTransitionName(sharedTargetView, "test") // Same name as the source!
    return view
}

If the system can't find a view with the matching transition name in the destination fragment, the shared element transition won't trigger at all.

3. Enable Window Transitions in Your Activity

Shared element transitions rely on window-level content transitions being enabled. You can do this either in code or via your app's theme:

Option 1: Code-based setup (in your Activity's onCreate method)

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    // Request content transitions before setting the content view
    window.requestFeature(Window.FEATURE_CONTENT_TRANSITIONS)
    setContentView(R.layout.activity_main)
    
    // Optional: Define specific transition animations (move is the default for shared elements)
    window.sharedElementEnterTransition = TransitionInflater.from(this).inflateTransition(android.R.transition.move)
    window.sharedElementExitTransition = TransitionInflater.from(this).inflateTransition(android.R.transition.move)
}

Option 2: Theme-based setup (in res/values/styles.xml)

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- Enable window content transitions -->
    <item name="android:windowContentTransitions">true</item>
    <!-- Set shared element transitions -->
    <item name="android:windowSharedElementEnterTransition">@android:transition/move</item>
    <item name="android:windowSharedElementExitTransition">@android:transition/move</item>
</style>

This is often easier to maintain across your app, but either approach works.

4. Verify Your Fragment Container Layout

Make sure your Activity's layout uses a valid ViewGroup (like FrameLayout) as the fragment container, and that you're using the same ID (R.id.fragment_container in the example above) when replacing fragments. Mismatched IDs will break the transaction and transition.

5. Avoid Using hide()/show() for Fragment Switches

Shared element transitions don't play nice with hide() and show() fragment transactions. Stick to replace() with addToBackStack() for transitions between fragments — this ensures the system properly handles the enter/exit states for the animation.

Once you've implemented all these steps, your shared element transition should work as expected. Test it out, and if you still run into issues, double-check that all transition names match exactly and that window transitions are enabled.

内容的提问来源于stack exchange,提问作者Евгений Кравцов

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.25 02:30:07