共享元素实现大图浏览,即recycleView到ViewPager共享动画setExitSharedElementCallback

废话不多说直接上图

共享元素实现大图浏览,即recycleView到ViewPager共享动画setExitSharedElementCallback共享元素实现大图浏览,即recycleView到ViewPager共享动画setExitSharedElementCallback共享元素实现大图浏览,即recycleView到ViewPager共享动画setExitSharedElementCallback



是不是大家都在找类似微信,微博大图浏览。viewpager左右滑动后,动画item跟着改变。

经过大量查阅,发现共享元素就能实现这个功能,非常方便。
主要是通过2个方法:

1、setExitSharedElementCallback()

2、setEnterSharedElementCallback()

具体怎么实现。和这些方法的作用大家自行百度。我只告诉你们实现方法。

需要注意:

这里可能会涉及到小图到大图,图片在大图的时候其实又加载了一次。所以共享元素,有个延迟加载。

但如果想要完美会有个问题,在网络缓慢的时候,延迟加载虽然实现,也会出现图片没加载出来,此效果实现不佳。

有个额外的解决方案是将要点击的那种图片 缓存到本地,在大图的时候直接拿出来用。这只是一个实现思路,如有更好希望告知


共享元素动画页是可以监听的,代码如下:

getWindow().getSharedElementEnterTransition().addListener(new Transition.TransitionListener() {
    @Override
    public void onTransitionStart(Transition transition) {
        LogUtils.i("共享元素动画的实现", "onTransitionStart");
        
    }

    @Override
    public void onTransitionEnd(Transition transition) {
        LogUtils.i("共享元素动画的实现", "onTransitionEnd");
        
    }

    @Override
    public void onTransitionCancel(Transition transition) {

    }

    @Override
    public void onTransitionPause(Transition transition) {

    }

    @Override
    public void onTransitionResume(Transition transition) {

    }
});

源码下载

下面是本人github地址,欢迎star

github传送门