共享元素转换通过导航栏

Ell*_*lis 5 animation android shared-element-transition

我试图使用共享元素转换在两个屏幕之间设置动画.下面是我的代码的相关部分(可能更多也不相关)但我已经削减了一些以节省空间.

activity_main.xml中:

<android.support.v4.widget.DrawerLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true">

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

        <fragment 
            android:id="@+id/fragment"
            android:name=".MainFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            tools:layout="@layout/fragment_main" />

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

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

</android.support.v4.widget.DrawerLayout>
Run Code Online (Sandbox Code Playgroud)

fragment_main.xml:

<android.support.v7.widget.RecyclerView
    android:id="@+id/my_recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="8dp"
    android:scrollbars="vertical"
    tools:context=".MainFragment"
    tools:showIn="@layout/activity_main" />
Run Code Online (Sandbox Code Playgroud)

RecyclerView中的每个项目都包含一个CardView作为根视图:

card_item.xml:

<android.support.v7.widget.CardView  
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <com.google.android.gms.maps.MapView 
            android:id="@+id/map"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            map:liteMode="true" />

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/map"
            android:transitionName="@string/transition_title" />

        <TextView
            android:id="@+id/subtitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/job_title"
            android:transitionName="@string/transition_rate" />

        <TextView
            android:id="@+id/description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/job_rate"
            android:transitionName="@string/transition_description" />

    </RelativeLayout>

</android.support.v7.widget.CardView>
Run Code Online (Sandbox Code Playgroud)

在RecyclerView的ViewHolder中,我设置了onClickListener:

mCardView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        Intent intent = new Intent(mContext, SecondActivity.class);

        View title = mCardView.findViewById(R.id.title);
        View rate = mCardView.findViewById(R.id.rate);
        View description = mCardView.findViewById(R.id.description);

        // Use fancy animations for API 21+
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                mContext.startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(mActivity,
                        Pair.create(title, mContext.getString(R.string.transition_title)),
                        Pair.create(rate, mContext.getString(R.string.transition_rate)),
                        Pair.create(description, mContext.getString(R.string.transition_description))).toBundle()
                );
            } else {
                mContext.startActivity(intent);
            }
        }
    });
Run Code Online (Sandbox Code Playgroud)

问题是,如果我点击一个TextViews在屏幕上有点偏离的卡片,它们会在导航栏上方/上方显示动画:

文本重叠导航栏

如何防止这种情况发生,以便TextViews在导航栏下"动画"?

小智 13

您也可以将navigationBar添加为共享元素

View navigationBar = mContext.findViewById(android.R.id.navigationBarBackground);
Run Code Online (Sandbox Code Playgroud)

并使用Window.NAVIGATION_BAR_BACKGROUND_TRANSITION_NAME创建配对,

Pair.create(navigationBar, Window.NAVIGATION_BAR_BACKGROUND_TRANSITION_NAME)
Run Code Online (Sandbox Code Playgroud)