什么是共享元素呢?可以理解为当页面跳转是,看起来一个View属于界面A又属于界面B。 看一下下边这个效果:
![788873382-5a434d32c235f_articlex.gif](https://upload-images.jianshu.io/upload_images/5439590-ce599075474bb6d3.gif?imageMogr2/auto-orient/strip)
#####Step1:
1 2 3
| <style name="AppTheme" parent="Theme.AppCompat.Light"> <item name="android:windowContentTransitions">true</item> </style>
|
#####Step2:
为共享元素设置上transtionName。设置name的时候两个界面都要添加上,这样才可以检测到是哪两个元素共享。
1 2 3 4 5 6
| <ImageView android:id="@+id/image" android:layout_width="150dp" android:layout_height="100dp" android:transitionName="image" android:src="@drawable/default_image" />
|
也可以在代码中设置:
imageView.setTransitionName(“image”);
#####Step3:
设置好以上的参数后,就可以通过跳转来添加相应的动画了。是不是特别的简单。是的。没有错。只不过再跳转的时候还需要加点东西。看下代码:
1 2 3 4
| Intent i = new Intent(mContext, Main2Activity.class); ActivityOptionsCompat optionsCompat = ActivityOptionsCompat.makeSceneTransitionAnimation(mContext, holder.image, "image"); startActivity(i,optionsCompat.toBundle());
|
通过上面的代码就可以实现ImageView的共享了。类似文章开头的效果。设置多个元素共享的时候需要这样:
1 2 3 4 5 6
| Intent i = new Intent(mContext, Main2Activity.class); Pair<View, String> pair = new Pair<View, String>(holder.image,"image"); Pair<View,String> pairText = new Pair<View, String>(holder.text,"text"); ActivityOptionsCompat optionsCompat = ActivityOptionsCompat.makeSceneTransitionAnimation(mContext, pair,pairText); startActivity(i,optionsCompat.toBundle());
|
在上面的跳转代码中我们用到了ActivityOptionsCompat的两个静态方法。分别是
1 2
| makeSceneTransitionAnimation(Activity activity,View sharedElement,String sharedElementName) makeSceneTransitionAnimation(Activity activity,Pair<View, String>... sharedElements)
|
通过函数的参数我们应该就可以看的明白,就不解释了。这两个函数就是用来设置共享元素的。