一、效果

二、知识点

CircularReveal动画、透明主题、转场动画(非必须)

三、方案

假设有两个Activity A和B。Reveal圆形Activity转场动画效果先从A到B,那么基本方案如下:

  1. 确定要显示的圆形动画中心起点位置
  2. 通过Intent将起点位置从Activity A传递B
  3. Activity B主题需要是透明的,同时先隐藏布局视图
  4. 在Activity A中启动Activity B,Activity A先不销毁
  5. Activity B启动之后开始动画,在动画启动时显布局视图
  6. 销毁Activity A,如果需要返回则不销毁

四、实现

4.1 初始界面Activity A

在Activity A中需要定义好主题、布局以及启动Activity B的方法。因为当不需要执行返回动画的时候,要把Activity A销毁,这时候一定是在后台销毁的,所以要把主题相关设置为透明,不然会在Activity B中显示Activity A销毁界面。

然后是布局设置,这一步比较简单,这里以启动界面为例,显示一张铺满全屏的图片,下面覆盖一个进度条。

<?xml version="1.0" encoding="utf-8"?>        

在Activity A中启动Activity B代码如下,使用转场动画API执行,当然也可以使用ActivityCompat.startActivity(this, intent, null); overridePendingTransition(0, 0);这种方式。在这段代码中,把Activity A中开始执行Reveal圆形动画的坐标点传递给Activity B,因为动画是在Activity B中执行的。

public void presentActivity(View view) {    ActivityOptionsCompat options = ActivityOptionsCompat.            makeSceneTransitionAnimation(this, view, "transition");    int revealX = (int) (view.getX() + view.getWidth() / 2);    int revealY = (int) (view.getY() + view.getHeight() / 2);    Intent intent = new Intent(this, MainActivity.class);    intent.putExtra(MainActivity.EXTRA_CIRCULAR_REVEAL_X, revealX);    intent.putExtra(MainActivity.EXTRA_CIRCULAR_REVEAL_Y, revealY);    ActivityCompat.startActivity(this, intent, options.toBundle());    //ActivityCompat.startActivity(this, intent, null);  overridePendingTransition(0, 0);}
4.2 动画界面Activity B

在Activity B中同样需要定义好主题、布局以及执行动画的方法。上面方案中也说到,Activity B需要是透明主题,而且布局文件不能为透明,随便设置一个背景即可。因为动画效果是从Activity A过度到Activity B,也就是启动Activity B一切准备就绪之后,显示其布局。同时开始执行ViewAnimationUtils.createCircularReveal动画,createCircularReveal会把根布局慢慢展开。这样就形成了上面的动画效果。

主题设置如下:

布局设置如下,注意根布局背景设置:

<?xml version="1.0" encoding="utf-8"?>    

最后就是执行动画的代码,先把根据不设置为不可见,然后在跟布局测量完毕之后开始执行动画。

if (savedInstanceState == null && Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP &&        intent.hasExtra(EXTRA_CIRCULAR_REVEAL_X) &&        intent.hasExtra(EXTRA_CIRCULAR_REVEAL_Y)) {    rootLayout.setVisibility(View.INVISIBLE);    revealX = intent.getIntExtra(EXTRA_CIRCULAR_REVEAL_X, 0);    revealY = intent.getIntExtra(EXTRA_CIRCULAR_REVEAL_Y, 0);    ViewTreeObserver viewTreeObserver = rootLayout.getViewTreeObserver();    if (viewTreeObserver.isAlive()) {        viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {            @Override            public void onGlobalLayout() {                revealActivity(revealX, revealY);                rootLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);            }        });    }} else {    rootLayout.setVisibility(View.VISIBLE);} 
protected void revealActivity(int x, int y) {    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {        float finalRadius = (float) (Math.max(rootLayout.getWidth(), rootLayout.getHeight()) * 1.1);        // create the animator for this view (the start radius is zero)         Animator circularReveal = ViewAnimationUtils.createCircularReveal(rootLayout, x, y, 0, finalRadius);        circularReveal.setDuration(400);        circularReveal.setInterpolator(new AccelerateInterpolator());        // make the view visible and start the animation         rootLayout.setVisibility(View.VISIBLE);        circularReveal.start();    } else {        finish();    }}

最后实现效果如下:

五、参考:

  • https://android.jlelse.eu/a-little-thing-that-matter-how-to-reveal-an-activity-with-circular-revelation-d94f9bfcae28
  • https://codesnipps.simolation.com/post/android/create-circular-reveal-animation-when-starting-activitys/

更多相关文章

  1. Android中Fragment的使用
  2. Android上webview界面切换动画效果
  3. Android中各种Adapter的使用方法
  4. Android动画之属性动画(Property Animation)(三)
  5. Tangram 的基础 —— vlayout(Android)
  6. android仿美团底部导航栏的点击效果——揭露动画
  7. Android网格布局(GirdView)学习
  8. Android(安卓)Animation 动画的使用方法和介绍
  9. Android中Preference的使用以及监听事件分析 .

随机推荐

  1. Eclipse中使用Ant打Android包报错解决方
  2. android平台的几个编译命令----make,mmm,
  3. Android:背景渐变色
  4. 【Android(BLE)】Android(BLE)之蓝牙权限
  5. 关于Android(安卓)Studio打包混淆以及上
  6. [学习笔记] Android群英传:Android系统信
  7. android第二行代码总结:二、UI
  8. 【Android】精通Android UI设计
  9. Android(安卓)最火快速开发框架androidan
  10. 获取Android(安卓)SDK 源代码并在Eclipse