SpringAnimation 实现菜单从顶部弹出从底部消失动画效果

前言

实现一种菜单,菜单从顶部弹入,然后从底部消失,顶部弹入时,有一个上下抖动的过程,底部消失时,先向上滑动,然后再向下滑动消失。

效果图如下:

引入依赖

implementation 'com.android.support:support-dynamic-animation:27.1.1'1

创建SpringAnimation需要三个参数。

•做动画的View

•做动画的类型(DynamicAnimation)

ALPHA
ROTATION
ROTATION_X
ROTATION_Y
SCALE_X
SCALE_Y
SCROLL_X
SCROLL_Y
TRANSLATION_X
TRANSLATION_Y
TRANSLATION_Z
X
Y
Z

上边的gif图为DynamicAnimation为TRANSLATION_Y的预览图,现在我们把参数设置为ROTATION,

SpringAnimation signUpBtnAnimY = new SpringAnimation(constraintLayout, DynamicAnimation.ROTATION, 0);

效果图如下:

- 创建动画的最终位置

相对View的当前位置的偏移量。

SpringForce

为了让动画流畅,有弹簧的性质,需要设置SpringForce的相关参数。

- Stiffness

即刚度,此值越大,产生的里越大,动画中弹性效果越不明显,运动比较快。

STIFFNESS_HIGH
STIFFNESS_LOW
STIFFNESS_MEDIUM
STIFFNESS_VERY_LOW

设置方法为:

signUpBtnAnimY.getSpring().setStiffness(SpringForce.STIFFNESS_LOW);

•DampingRatio阻尼比

即阻尼比,此值越大,弹簧效果停止的越快

DAMPING_RATIO_HIGH_BOUNCY
DAMPING_RATIO_LOW_BOUNCY
DAMPING_RATIO_MEDIUM_BOUNCY
DAMPING_RATIO_NO_BOUNCY

设置方法为:

signUpBtnAnimY.getSpring().setDampingRatio(SpringForce.DAMPING_RATIO_MEDIUM_BOUNCY);

StartVelocity

启动速度,默认速度为0,单位是px/second.

整体代码如下:

•显示菜单动画

public void showAnimal() {
    setVisibility(View.VISIBLE);
    SpringAnimation signUpBtnAnimY = new SpringAnimation(constraintLayout, DynamicAnimation.TRANSLATION_Y, 0);
    signUpBtnAnimY.getSpring().setStiffness(SpringForce.STIFFNESS_LOW);
    signUpBtnAnimY.getSpring().setDampingRatio(SpringForce.DAMPING_RATIO_MEDIUM_BOUNCY);
    signUpBtnAnimY.setStartVelocity(5000);
    signUpBtnAnimY.start();
  }

•隐藏菜单动画

public void hideAnimal() {
    height = (ScreenTools.getScreenHeight(getContext()) - constraintLayout.getHeight()) / 2 + constraintLayout.getHeight() + ScreenTools.dp2px(getContext(),50);
    ObjectAnimator animator = ObjectAnimator.ofFloat(constraintLayout, "translationY", 0f, -100f, height);
    animator.setDuration(600);
    animator.setInterpolator(new DecelerateInterpolator());
    animator.addListener(new AnimatorListenerAdapter() {
      @Override
      public void onAnimationEnd(Animator animation) {
        super.onAnimationEnd(animation);
        setVisibility(GONE);
        reLayout();
      }
    });
    animator.start();
  }

源码:https://github.com/LSnumber1/StudySpringAnimation

总结

以上所述是小编给大家介绍的SpringAnimation 实现菜单从顶部弹出从底部消失动画效果,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • Android SpringAnimation弹性动画解析

    也许你想在Android上实现这种反弹的动画效果.Android Support Library 25.3.0引入了Dynamic-animation增强动画,里面提供了几个类用于使动画呈现实现真实的物理效果. 你会想,自己的动画里加上 BounceInterpolator或OvershootInterpolator 插值器也能达到这种效果,然而实际上达不到.当然你也可以自己写插值器,如果你不嫌麻烦的话. SpringAnimation弹性动画实现方法 gradle引入,最低支持API16 de

  • SpringAnimation 实现菜单从顶部弹出从底部消失动画效果

    前言 实现一种菜单,菜单从顶部弹入,然后从底部消失,顶部弹入时,有一个上下抖动的过程,底部消失时,先向上滑动,然后再向下滑动消失. 效果图如下: 引入依赖 implementation 'com.android.support:support-dynamic-animation:27.1.1'1 创建SpringAnimation需要三个参数. •做动画的View •做动画的类型(DynamicAnimation) ALPHA ROTATION ROTATION_X ROTATION_Y SCA

  • Android中自定义PopupWindow实现弹出框并带有动画效果

    使用PopupWindow来实现弹出框,并且带有动画效果 首先自定义PopupWindow public class LostPopupWindow extends PopupWindow { public Lost lost; public void onLost(Lost lost){ this.lost = lost; } private View conentView; public View getConentView() { return conentView; } public L

  • android使用PopupWindow实现页面点击顶部弹出下拉菜单

    实现此功能没有太多的技术难点,主要通过PopupWindow方法,同时更进一步加深了PopupWindow的使用,实现点击弹出一个自定义的view,view里面可以自由设计,比较常用的可以放一个listview. demo中我只是一个点击展示,简单的使用了fade in out的动画效果,也没有精美的图片资源,看着也丑,不过这么短的时间,让你掌握一个很好用的技术,可以自己扩展,不很好么? 废话不说了,直接上代码: MainActivity.java public class MainActivi

  • Jquery实现顶部弹出框特效

    Jq制作的页面顶部动态弹出的提示框,可以用于提示信息的显示以及通知信息的显示. Html代码 <div class="tooltiptop"> <div class="bg"></div> <div class="main"><i>Jq顶部弹出框</i><span onClick="ToolTipTop.Hide();" title="关闭

  • Android实现底部弹出PopupWindow背景逐渐变暗效果

    在Android开发中,经常需要通过点击某个按钮弹出对话框或者选择框,通过Dialog或者PopupMenu.PopupWindow都能实现. 这里主要介绍后两者:PopupMenu.PopupWindow的实现. 先看两个效果图上边PopupMenu,下边PopupWindow: PopupMenu PopupWindow 一.PopupMenu实现: PopupMenu实现起来比较简单,主要用来实现根据按钮附近弹出的对话框. 首先定义一个menu文件\res\menu\headmenu.xm

  • jQuery实现鼠标经过弹出提示信息的地图热点效果

    本文实例讲述了jQuery实现鼠标经过弹出提示信息的地图热点效果.分享给大家供大家参考.具体如下: 这里的jQuery鼠标经过弹出提示信息地图热点效果,很多网站上有用到,送给大家,对作者表示感谢. 运行效果截图如下: 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html&

  • JS组件Bootstrap实现弹出框和提示框效果代码

    前言:对于Web开发人员,弹出框和提示框的使用肯定不会陌生,比如常见的表格新增和编辑功能,一般常见的主要有两种处理方式:行内编辑和弹出框编辑.在增加用户体验方面,弹出框和提示框起着重要的作用,如果你的系统有一个友好的弹出提示框,自然能给用户很好的页面体验.前面几章介绍了bootstrap的几个常用组件,这章来看看bootstrap里面弹出框和提示框的处理.总的来说,弹出提示主要分为三种:弹出框.确定取消提示框.信息提示框.本篇就结合这三种类型分别来介绍下它们的使用. 一.Bootstrap弹出框

  • Android开发仿QQ空间根据位置弹出PopupWindow显示更多操作效果

    我们打开QQ空间的时候有个箭头按钮点击之后弹出PopupWindow会根据位置的变化显示在箭头的上方还是下方,比普通的PopupWindow弹在屏幕中间显示好看的多. 先看QQ空间效果图: 这个要实现这个效果可以分几步进行 1.第一步自定义PopupWindow,实现如图的样式,这个继承PopupWindow自定义布局很容易实现 2.得到点击按钮的位置,根据位置是否在屏幕的中间的上方还是下方,将PopupWindow显示在控件的上方或者下方 3.适配问题,因为PopupWindow上面的操作列表

  • 如何创建一个JavaScript弹出DIV窗口层的效果

    在本教程中,我将用最通俗的语言和最简洁的代码给大家演示如何创建一个JavaScript弹出DIV窗口层的效果. 创建一个弹出DIV窗口可能是现在网站/网页制作中最常碰到的问题之一.传统的JavaScript弹窗已经不适合目前网站的设计理念了,理由有二:首先,不友好--生硬的弹出对话框且伴随着"哐"的一声对用户体验是个很大的挑战:其次,兼容性不够强--有相当多的浏览器屏蔽了这种JS的Alert()方法.于是,一个良好用户体验的网站需要一种更合理的解决方案--使用很少的HTML代码,很少的

  • jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果

    本文实例讲述了jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果.分享给大家供大家参考.具体如下: 这是一款jquery实现的弹出层,点击文字后从网页右上角飞入,也可以说是滑入,此类弹出框带有关闭按钮,可自定义标题栏和弹出框内容,风格自己可定义,代码简洁,基于jquery实现,学习参考价值大,也可拿出即用. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-fade-in-title-info-stye-alert-code

随机推荐