android - TextView 和工具栏标题之间​​的共享元素转换

Question

我有一个在回收站 View 中有名称的项目和一个带有显示项目名称的折叠工具栏的详细信息 Activity 。我想在项目名称和工具栏/折叠工具栏的标题之间添加共享元素转换。

item_subject.xml

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <FrameLayout
        android:id="@+id/frameLayoutSubjectColor"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:minWidth="20dp" />

    <TextView
        android:id="@+id/textViewSubjectName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:padding="10dp"
        android:text="Medium Text"
        android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

activity_subject_detail.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:id="@+id/appBarLayout"
    android:fitsSystemWindows="true"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin">

        </android.support.v7.widget.Toolbar>

    </android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>

<android.support.v4.widget.NestedScrollView
    android:id="@+id/subject_detail_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/activity_horizontal_margin"
        android:orientation="vertical">

        <TextView
            android:id="@+id/textViewSubjectShort"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="16dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <TextView
            android:id="@+id/textViewSubjectRoom"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="32dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <TextView
            android:id="@+id/textViewTeacher"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="16dp"
            android:text="@string/teacher"
            android:textAppearance="?android:attr/textAppearanceLarge" />

        <TextView
            android:id="@+id/textViewTeacherName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="16dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <TextView
            android:id="@+id/textViewTeacherPhone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="16dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <TextView
            android:id="@+id/textViewTeacherEmail"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingBottom="16dp"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />
    </LinearLayout>
</android.support.v4.widget.NestedScrollView>


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fabEdit"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical|start"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_menu_edit"
    app:layout_anchor="@+id/subject_detail_container"
    app:layout_anchorGravity="top|end" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fabPhone"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|start"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_menu_call"
    app:fabSize="normal" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fabEmail"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_dialog_email"
    app:fabSize="normal" />

Answer 1

嘿，我找到了一个解决方案，我将其发布在 kotlin 中，但我相信这没什么大不了的，但是它共享 fragment 转换，但想法有些相同

// from the start fragment init your end fragment whatever it is
val endFragment = EndFragment.newInstance(/*...*/)
val sharedView = view.findViewById<TextView>(R.id.mySharedTV)
val sharedTransitionName = "myTransition"

sharedView.transitionName = sharedTransitionName

// define your transition
val transition = TransitionInflater                
                     .from(context)
                     .inflateTransition(android.R.transition.move)
// define it as shared one
endFragment.sharedElementEnterTransition = transition

// pass the transition name to the endFragment
val bundle = endFragment.arguments ?: Bundle()
bundle.putString("sharedTransitionKey", sharedTransitionName)
endFragment.arguments = bundle

activity!!.supportFragmentManager
          .beginTransaction()
          .replace(R.id.myFragmentContainer, endFragment)          
          .addSharedElement(sharedView, sharedTransitionName)
          .addToBackStack(null) // or add it
          .commit()

在另一边

override fun onCreateView(inflater: LayoutInflater, 
       container: ViewGroup?, savedInstanceState: Bundle?): View? {

    val inflatedView = inflater.inflate(R.layout.myEndFragment, container, false)
    /* here is the spot... */
    return inflatedView
}

您有以下选择:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:titleTextColor="@android:color/white"
        android:background="@color/colorPrimary"        
        app:title="My Title" />

在某处使用这个定义的方法

fun getToolbarTitleAsTextView(toolbar: Toolbar) : TextView? {
    (0..toolbar.childCount).forEach {
        val view = toolbar.getChildAt(it)
        if (view is TextView)
            return view
    }

    return null
}

...并使用它

val toolbar = inflatedView.findViewById<Toolbar>(R.id.toolbar)
val toolbarTitle = getToolbarTitleAsTextView(toolbar)

或

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:minHeight="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:titleTextColor="@android:color/white"
        android:background="@color/colorPrimary">

        <TextView
            android:id="@+id/toolbarTitleTV"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
            android:text="My Title"/>
</android.support.v7.widget.Toolbar>

...和

val toolbarTitle =  inflatedView.findViewById<Toolbar>(R.id.toolbarTitleTV)

最后，当您在两种情况下都拥有 toolbarTitle 时

// read the passed transitionName 
val bundle = endFragment.arguments ?: Bundle()
val sharedTransitionName = bundle.getString("sharedTransitionKey")
toolbarTitle.transitionName = sharedTransitionName

……奇迹发生了