NavigationComponent recyclerview返回共享元素转换

时间:2019-04-13 12:18:23

标签: android android-recyclerview shared-element-transition android-architecture-navigation

我在项目中使用导航组件。尝试从回收站设置共享元素转换。在第二个片段中输入过渡效果很好,但是当我返回第一个片段时,没有返回过渡。

我试图像在第二个片段中那样在第一个片段中显式设置输入和返回转换

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

sharedElementEnterTransition = transition

sharedElementReturnTransition = transition

但这没有帮助。

还尝试删除输入和退出片段动画。对于第二个片段,Enter过渡可与动画一起使用,但谁知道呢。

也尝试使用此问题的解决方案,但在我看来,它没有用。 https://stackoverflow.com/a/52922835/10951565

mainFragment

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>

请与导航组件共享返回共享元素转换的方法

1 个答案:

答案 0 :(得分:2)

前几天我遇到了这个问题,从 MainFragment 项目到 DetailFragment 动画效果很好,但是按回时 sharedElementReturnTransition 不起作用。

对我来说,解决方法是推迟 MainFragment 上的过渡。起初,我试图在 onCreate 中这样做,但是返回时并不总是调用 onCreate,因此解决方法是在 onViewCreated 中推迟它(我猜 {{ 1}} 也可能工作),然后在 onCreateView 准备好后开始转换。

细节片段:

RecyclerView

主片段:

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