zoukankan      html  css  js  c++  java
  • Android中Activity切换时共享视图元素的切换动画(5.0以上)

    同一时候公布在我的博客

    点此进入

    背景

    说来这个的背景很easy,常常在使用图片列表的时候就会想,假设“列表中的图片放大到整个屏幕”作为 Activity 的补间动画。就很完美了。

    就像这样:

    preview

    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);

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

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

    很多其它

    上面的方法很easy。可是却仅仅能在 5.0 的版本号上显示出效果。对于如今大部分手机还是 4.x 的情况来说。无疑是不能上线的。

    下一篇文章将会讨论怎样在 4.x 上实现相同的效果。敬请期待。

  • 相关阅读:
    aaa
    记一次Vue实战总结
    Data too long for column 'xxx' at row 1MySql.Data.MySqlClient.MySqlPacket ReadPacket() 报错解决
    uni-app 监听返回按钮
    微信H5分享外部链接,缩略图不显示
    uni-app 动态控制下拉刷新
    vueX 的使用
    uni-app H5 腾讯地图无法导航
    uni-app支付功能
    hooks 与 animejs
  • 原文地址:https://www.cnblogs.com/yjbjingcha/p/7064287.html
Copyright © 2011-2022 走看看