activity波纹效果切换界面

来源:互联网 发布:知乎源代码下载 编辑:程序博客网 时间:2024/06/05 06:02

Android的Material Design设计理念 带来很多绚丽的动画效果

添加依赖

compile ‘com.android.support:design:25.3.1’

先上效果图

这里写图片描述

Circular Reveal

官方将这一动画称为揭露效果,它在官网中的描述是这样的:

当您显示或隐藏一组 UI 元素时,揭露动画可为用户提供视觉连续性。ViewAnimationUtils.createCircularReveal()
方法让您能够为裁剪区域添加动画以揭露或隐藏视图。

那么使用ViewAnimationUtils.createCircularReveal()方法就能达到基本的揭露动画效果了。那么我们就直接开始看一下这个方法到底需要哪些参数吧

public static Animator createCircularReveal(View view, int centerX, int centerY, float startRadius, float endRadius) {    throw new RuntimeException("Stub!");}

view 当前的控件
centerX 开始坐标点的x
centerY开始坐标点的y
startRadius 开始的揭露半径距离
endRadius 结束揭露半径距离

上代码:

    //扩散public void onclick2(View view) {    ImageView imageView = (ImageView) findViewById(R.id.ImageView);    imageView.setBackgroundColor(Color.RED);    // 获取的中心点的坐标    int centerX = (int) imageView.getPivotX();    int centerY = (int) imageView.getPivotY();    // Math.hypot(x,y):  返回sqrt(x2 +y2)  返回根号((x2 +y2))    // 获取扩散的半径    float finalRadius = (float) Math.hypot((double) centerX, (double) centerY);    // 定义揭露动画    Animator mCircularReveal = ViewAnimationUtils.createCircularReveal(            imageView, centerX, centerY, 0, finalRadius);    // 设置动画持续时间,并开始动画    mCircularReveal.setDuration(1000).start();}

上面的效果可能提不起你的兴趣,那么我们来看下下面的效果会不会提起你的兴趣呢

Activity跳转使用揭露动画

这里写图片描述

以前我们使用一下方法就可以达到跳转的一些动画,但是跳转的动画是同步进行了

overridePendingTransition(int enterAnim,int exitAnim)

在5.0之后材料设计中Activity Transition也可以实现页面的跳转,具体实现方法自行百度

ANDROID L——Material Design详解(动画篇)

现在我们使用5.0之后材料设计中Circular Reveal来实现揭露动画

  1. 我们都知道Activity跳转是有一个默认效果的,所以需要跳转的Activity设置一个主题样式,在这个样式中,我们将Acitivty跳转的动画以及window的背景色都设置一下

    <!--关键部分--><item name="android:windowAnimationStyle">@null</item><item name="android:windowBackground">@android:color/transparent</item><item name="android:colorBackgroundCacheHint">@null</item><item name="android:windowIsTranslucent">true</item>
  2. 跳转动画的设置。 一开始我想的是在第一个Activity中,给动画设置一个监听,然后在动画完成之后再进行Activity的跳转,但是效果并不好。所以,我现在的做法是将触摸点的坐标传给第二个Activity,然后让第二个Activity来进行揭露动画。

    //跳转public void onclick1(View view) {    Intent intent = new Intent(this, Main2Activity.class);    startActivity(intent);}

页面2

@Overrideprotected void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    setContentView(R.layout.activity_main2);    final TextView textView = (TextView) findViewById(R.id.textview);    textView.post(new Runnable() {        @Override        public void run() {            float hypot = (float) Math.hypot(textView.getHeight(), textView.getWidth());            Animator animator = ViewAnimationUtils.createCircularReveal(                    textView, textView.getWidth() / 2, textView.getHeight() / 2,                    0,                    hypot);            animator.setDuration(2000);            animator.setInterpolator(new AccelerateDecelerateInterpolator());            animator.start();        }    });}

总结

可能我的做法不是很好,如果这样设置就会把所有的跳转动画都去掉,不是特别理想,如果有同学也正好做过这部分效果的,可以一起交流一下。当然网上也有很多Circular Reveal的使用,效果也有很多,在此我也只是进行一个小小的总结而已。

源码地址:http://blog.csdn.net/q714093365/article/details/77268717

原创粉丝点击