Android中Activity切换时共享视图元素的切换动画(5.0之上)

Android中Activity切换时共享视图元素的切换动画(5.0以上)

同时发布在我的博客

点此进入

背景

说来这个的背景非常简单,经常在使用图片列表的时候就会想,如果“列表中的图片放大到整个屏幕”作为 Activity 的补间动画,就非常完美了。就像这样:

Android中Activity切换时共享视图元素的切换动画(5.0之上)

Android 5.0 Lollipop 的 SDK 发布以后,这个新的主题包含在 AppCompat-v7 21了。

这里介绍的实现方法是 ActivityOptionsCompat.makeSceneTransitionAnimation , 缺点是只能在5.0上才可以看到效果,在5.0以下只能确保程序不出错。

实现

首先要在 AndroidManifest.xml 中为需要这种动画的 Activity 开启这个功能,为此我字节写了一个 style。

<style name="AnimationActivity">
<item name="android:windowContentTransitions">true</item>
</style>

先来造一个浏览界面,关键是设置共享的视图元素的两个地方

public class ViewerActivity extends AppCompatActivity {

    public static void launch(AppCompatActivity activity, View transitionView, int resId) {
        Intent intent = new Intent(activity, ViewerActivity.class);
        intent.putExtra("resId", resId);

        // 这里指定了共享的视图元素
        ActivityOptionsCompat options = ActivityOptionsCompat
                .makeSceneTransitionAnimation(activity, transitionView, "image");

        ActivityCompat.startActivity(activity, intent, options.toBundle());
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_viewer);
        ImageView imageView = (ImageView) findViewById(R.id.image);
        imageView.setImageResource(getIntent().getIntExtra("resId", R.mipmap.pic_1));

        // 这里指定了被共享的视图元素
        ViewCompat.setTransitionName(imageView, "image");
    }

}

然后启动上边写好的浏览界面

ViewerActivity.launch(MainActivity.this, v, data.get(position).resId);

我知道上面写得比较简单,所以我就准备了,

伸手党的福利:点我跳转代码地址

更多

上面的方法非常简单,但是却只能在 5.0 的版本上显示出效果,对于现在大部分手机还是 4.x 的情况来说,无疑是不能上线的。下一篇文章将会讨论如何在 4.x 上实现同样的效果,敬请期待。

版权声明:本文为博主原创文章,未经博主允许不得转载。