- 先放一个效果图
- Android共享元素属于Android 5.0的新属性
这里实现的是一个Imagview的缩放
我们先看一下RecycleView的Imageview的界面
<ImageView
android:id="@+id/abstract_item__img"
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_weight="1"
android:scaleType="centerCrop"
tools:src="@mipmap/ic_launcher_round"
android:transitionName="image"
/>
这个是扩大后的ImageView的内容
<ImageView
android:id="@+id/healthy_news_detali_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="@drawable/ic_account_info"
android:transitionName="image"
app:layout_collapseMode="parallax"/>
他们之间的共同点就是 android:transitionName="image" 代码
这时候我们只需要在启动Acitivity的时候加几行代码就可以实现了;
intent.putExtra("NewsBean", ((NewsBean) adapter.getItem(position)));
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
/*startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(getActivity()).toBundle());*/
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(getActivity(),
Pair.create(view.findViewById(R.id.abstract_item__img), "image"),
Pair.create(view.findViewById(R.id.abstract_item__title), "title"))
.toBundle());
} else {
startActivity(intent);
}
你以为就到此为止了吗 错了
有时候使用Glide加载Activity在第一次这张图片时候在图片周围会出现一些边界就是图片没有完全覆盖整个界面,而这个是因为动画加载完成了,Glide还没加载完成,就会出现以上情况,这时候解决只需要使用到Glide的Targe,在OnResourceReady的时候再去设置图片。
先暂停动画
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
postponeEnterTransition();
}
Glide加载图片
Glide.with(this)
.load(mImageUrl)
.asBitmap()
.centerCrop()
.diskCacheStrategy(DiskCacheStrategy.ALL)
.into(new SimpleTarget<Bitmap>() {
@Override
public void onResourceReady(Bitmap resource, GlideAnimation<? super Bitmap> glideAnimation) {
imageView.setImageBitmap(resource);
scheduleStartPostponedTransition(imageView);
}
});
scheduleStartPostponedTransition的代码如下
private void scheduleStartPostponedTransition(final View sharedElement) {
sharedElement.getViewTreeObserver().addOnPreDrawListener(
new ViewTreeObserver.OnPreDrawListener() {
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
@Override
public boolean onPreDraw() {
sharedElement.getViewTreeObserver().removeOnPreDrawListener(this);
startPostponedEnterTransition();
return true;
}
});
}