NavigationComponent recyclerview return 共享元素转换

Question

我在项目中使用了导航组件。尝试设置来自回收器的共享元素转换。并在第二个片段中输入过渡效果很好，但是当我 return 到第一个片段时 - 没有 return 过渡。

我试图在第一个片段中明确设置输入和 return 转换，就像我在第二个片段中所做的那样

val transition = TransitionInflater.from(context).inflateTransition(android.R.transition.move)

sharedElementEnterTransition = transition

sharedElementReturnTransition = transition

但没有用。

还尝试删除进入和退出片段动画。对于第二个片段，进入过渡可以使用动画，但谁知道呢。

也尝试使用这个问题的解决方案，但在我的情况下它没有用。

主要片段

stickyAdapter.onItemClick = { event, imageView, textView ->
            val args = bundleOf(EventDetailFragment.EVENT to event)
            val extras = FragmentNavigatorExtras(
                imageView to imageView.transitionName,
                textView to textView.transitionName
            )
            findNavController().navigate(R.id.action_global_eventDetailFragment, args, null, extras)
        }

在适配器 onClick 中，我为视图设置了唯一的转换名称： mainFragmentAdapter

eventImageView.setOnClickListener {
            titleTextView.transitionName = "${event.title}$TRANSITION_TITLE"
            eventImageView.transitionName = "${event.title}$TRANSITION_IMAGE" 
            onItemClick?.invoke(event, eventImageView, titleTextView) 
        }

在 detailsFragment 中，我从参数中获取转换名称（复制粘贴它们以确保没有错误并且对于输入转换它有效）我在 OnCreate 方法中调用 postponeEnterTransition() 等到我可以在 onViewCreated 中设置转换名称、sharedElementEnterTransition 和 sharedElementReturnTransition，然后调用 startPostponedEnterTransition()


    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        postponeEnterTransition()
    }

override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? = inflater.inflate(R.layout.fragment_event_detail, container, false).apply {
        val event = arguments?.getSerializable(EVENT) as Event?
        toolbarImageView.transitionName = "${event?.title}$TRANSITION_IMAGE"
        titleTextView.transitionName = "${event?.title}$TRANSITION_TITLE"

        val transition = TransitionInflater.from(context).inflateTransition(android.R.transition.move)
        sharedElementEnterTransition = transition
        sharedElementReturnTransition = transition
        startPostponedEnterTransition()

        toolbar.setupWithNavController(findNavController())

        event?.let {
            Picasso.get()
                .load("${EventGroupAdapter.BASE_SMALL_IMAGE_URL}${event.smallimage}")
                .into(toolbarImageView)
        }
    }
}

main_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".view.activity.MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_width="match_parent"
        android:layout_height="256dp"
        android:background="?android:colorBackground"
        android:fitsSystemWindows="true">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true">

                <androidx.viewpager.widget.ViewPager
                    android:id="@+id/viewPager"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:fitsSystemWindows="true" />

                <com.rd.PageIndicatorView
                    android:id="@+id/pageIndicatorView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignBottom="@id/viewPager"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="7dp"
                    app:piv_dynamicCount="true"
                    app:piv_interactiveAnimation="true"
                    app:piv_radius="3.5dp"
                    app:piv_selectedColor="@color/colorIndicatorSelected"
                    app:piv_unselectedColor="@color/colorIndicatorUnselected"
                    app:piv_viewPager="@id/viewPager" />

                <include
                    android:id="@+id/horizontalScrollView"
                    layout="@layout/fragment_main_horizontal_scroll_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@id/viewPager" />

            </RelativeLayout>

        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

        <RelativeLayout
            android:id="@+id/relativeLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <LinearLayout
                android:id="@+id/emptyMessage"
                android:layout_marginTop="40dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layoutAnimation="@anim/layout_animation_from_bottom"
                android:orientation="vertical">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_empty_events"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:text="@string/empty_events_message"
                    android:textSize="18sp" />
            </LinearLayout>

            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/recyclerView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="10dp"
                android:layout_marginEnd="10dp"
                android:layout_marginBottom="48dp"
                android:nestedScrollingEnabled="true"

                tools:listitem="@layout/fragment_main_event_item" />

        </RelativeLayout>

    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/programTextView"
        android:layout_gravity="center"
        android:visibility="gone"
        tools:visibility="visible" />

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/bottomNavigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="?android:colorBackground"
        app:menu="@menu/bottom_navigation" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

请分享您的 return 与导航组件共享元素转换的秘诀

Answer 1

我运行前几天从 MainFragment 项目到 DetailFragment 动画很好，但是 sharedElementReturnTransition 在按下时不起作用.

我的解决方法是推迟 MainFragment 上的 t运行sition。起初，我试图在 onCreate 中这样做，但是返回时并不总是调用 onCreate，所以修复是在 onViewCreated 中推迟它（我猜 onCreateView 也可能有效），然后在 RecyclerView 准备就绪后开始 t运行sition。

细节片段：

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val transition = TransitionInflater.from(context).inflateTransition(android.R.transition.move)
    sharedElementEnterTransition = transition
    sharedElementReturnTransition = transition
}

主要片段：

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    postponeEnterTransition()
    recycler_view.post { startPostponedEnterTransition() }
}

NavigationComponent recyclerview return 共享元素转换

NavigationComponent recyclerview return shared element transition

android

shared-element-transition

android-recyclerview

android-architecture-navigation