浮動アクションボタンスタンドを使用した共有要素の移行

Question

RecyclerViewには、それぞれにミニフローティングアクションボタンが含まれています。カードがクリックされると、カードおよびファブ上の画像は共有エレメントの遷移に使用されます。

リターントランジションを実行するとき、フローティングアクションボタンは、想定通りにアニメーション化するのではなく、元の位置に「スナップ」します。相続人

問題を示しGIF：https://gfycat.com/SnappySeparateDeer

活動や移行を開始マイコード：

Intent intent = new Intent(mContext, PlayActivity.class); 

       Pair<View, String> p1 = Pair.create((View)holder.coverArt, "coverArt"); 
       Pair<View, String> p2 = Pair.create((View) holder.fab, "fab"); 
       ActivityOptionsCompat options = ActivityOptionsCompat. 
         makeSceneTransitionAnimation(mActivity, p1, p2); 

       mContext.startActivity(intent, options.toBundle()); 

カードのミニFAB：

<android.support.design.widget.FloatingActionButton 
      android:id="@+id/fab" 
      app:fabSize="mini" 
      android:layout_height="wrap_content" 
      android:layout_width="wrap_content" 
      app:layout_anchor="@id/coverArt" 
      app:layout_anchorGravity="bottom|right|end" 
      android:src="@drawable/ic_favorite" 
      android:layout_margin="16dp" 
      android:clickable="true" 
      android:transitionName="fab"/> 

と1でアクティビティ：

<android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab" 
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content" 
     app:layout_anchor="@id/coverArt" 
     app:layout_anchorGravity="bottom|right|end" 
     android:src="@drawable/ic_favorite" 
     android:layout_margin="16dp" 
     android:clickable="true" 
     android:transitionName="fab"/> 

EDIT：私は賞金を増やしたいと思いますが、それは何らかの理由でSOに実装されていないようです。私は正解に賞金ポイントを追加することができると確信しているので、別の+50を追加します。ありがとう！

Answer 1

手順：詳細レイアウトをカスタマイズし、アニメーションを完全に移行する必要があります。 like

<?xml version="1.0" encoding="utf-8"?> 
<FrameLayout 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"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="275dp"> 

     <ImageView 
      android:id="@+id/picture" 
      android:layout_width="match_parent" 
      android:layout_height="250dp" 
      android:fitsSystemWindows="true" 
      android:scaleType="centerCrop" 
      android:transitionName="picture" 
      app:layout_collapseMode="parallax" /> 

     <android.support.design.widget.FloatingActionButton 
      android:id="@+id/fabButton" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentBottom="true" 
      android:layout_alignParentRight="true" 
      android:layout_marginBottom="5dp" 
      android:layout_marginRight="16dp" 
      android:src="@mipmap/like" 
      android:transitionName="fabButton" 
      app:fabSize="normal" /> 

    </RelativeLayout> 

</FrameLayout> 

注：レイアウトと画像のサイズをカスタマイズします。

Answer 2

、以下のように推移を入力/窓とフラグメント出口を維持してみてくださいとして

<?xml version="1.0" encoding="utf-8"?> 
<fade xmlns:android="http://schemas.android.com/apk/res/" android:duration="500"/> 

、共有要素の移行：

<?xml version="1.0" encoding="utf-8"?> 
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android" 
      android:duration="500" 
      android:interpolator="@android:interpolator/decelerate_cubic"> 
    <changeBounds> 
    <arcMotion 
     android:maximumAngle="90" 
     android:minimumHorizontalAngle="90" 
     android:minimumVerticalAngle="0" /> 

    </changeBounds> 
</transitionSet> 

私はImageViewの以外のものが正しい移行を持っているかどうかわからないんだけど効果。私は前回作成したカスタムビューで試してみましたが、移行中に似た問題が発生していましたが、リターンは完璧でした。