CardView与半径的共享元素转换

Question

我一直在解决这个问题几个星期，我仍然无法解决这个问题。

所以，我有一个CardView，包含一个带有ImageView的LinearLayout。

没有这种半径共享元素转换无缝工作。但是，当我向该CardView添加半径（app：cardCornerRadius =“25dp”）时，共享元素转换看起来很难看，因为它先移除半径，然后开始动画。

1方法：ObjectAnimator

创建ObjectAnimator动画卡半径值，动画结束后开始它的过渡。

ObjectAnimator animator = ObjectAnimator 
      .ofFloat(view, "radius", AppUtil.dpAsPixel(this, 25), 0); 
animator.setDuration(150); 
animator.addListener(// start new Activity with Transition); 
animator.start(); 

这可行，但它看起来不太好，因为过渡等待动画在开始过渡之前完成。我需要的是在转换到新的Activity时，半径是动画效果（类似于TransitionSet中的ORDERING_TOGETHER）。

第二个方法 - ChangeImageTransform

我读过StackOverflow post使用变换类像ChangeImageTransform和ChangeBounds。

我做了定义我的应用程序的主题像有人建议（my_transition包含ChangeImageTransform transitionSet）

<item name="android:windowSharedElementEnterTransition">@transition/my_transition</item> 
<item name="android:windowSharedElementExitTransition">@transition/my_transition</item> 

但它不工作..

3方法 - 天真

我最后一次尝试是强制目标ImageView的半径为25dp。因为也许我的CardView被转换成方形，因为目标ImageView是方形的，但正如你猜测的那样，它不起作用。

第四届方法 - 不使用CardView

正如你所看到的，我使用的企鹅图像，并使用CardView做出的半径。我可以通过使用图像转换使图像四舍五入，但我仍然认为这不是创建共享元素过渡的正确方法。

这里是我的问题，有没有办法让共享元素过渡使用CardView半径无需先移除半径即可工作？

Answer 1

我终于能够解决它。对于那些有兴趣的人，这里是如何：

为什么它在开始转换之前删除半径？因为目标ImageView没有任何半径。

activity_detail。XML

<ImageView 
    android:id="@+id/iv_image_cover" 
    android:layout_width="match_parent" 
    android:layout_height="250dp" 
    android:scaleType="centerCrop" 
    android:src="@{animal.imageRes}" 
    android:transitionName="animalImage" 
    tools:src="@drawable/acat" 
/> 

当我使用CardView无半径，它不是noticable，但它居然成了目标共享视图。

1. 要实现半径到无半径转换，您必须将目标共享视图设置为四舍五入。我只是用卡片视图（半径）来包装它。

activity_detail.xml

<android.support.v7.widget.CardView 
    android:id="@+id/card" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:transitionName="card" 
    app:cardCornerRadius="25dp" 
> 

    <ImageView 
     android:id="@+id/iv_image_cover" 
     android:layout_width="match_parent" 
     android:layout_height="250dp" 
     android:scaleType="centerCrop" 
     android:src="@{animal.imageRes}" 
     android:transitionName="animalImage" 
     tools:src="@drawable/acat" 
    /> 

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

一定要改变你的makeSceneTransition使用 “一卡通”，而不是 “animalImage”

ListActivity.class

ActivityOptionsCompat option = ActivityOptionsCompat 
.makeSceneTransitionAnimation(ListActivity.this, cardView, "card"); 

startActivity(intent, option.toBundle()); 

1. 在DetailActivity中，您可以在转换开始时启动半径动画。

DetailActivity.java

@Override 
protected void onCreate(@Nullable Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    getWindow().getSharedElementEnterTransition() 
     .addListener(new Transition.TransitionListener() { 
      @Override 
      public void onTransitionStart(Transition transition) { 
       ObjectAnimator animator = ObjectAnimator 
        .ofFloat(activityDetailBinding.card, "radius", 0); 
       animator.setDuration(250); 
       animator.start(); 
      } 
     }); 
} 

享受平滑过渡

注：要旨为layout和activities