几种常用的Interpolator(插值器)的动画效果

在实现动画的非线性变化的方法中,常用的一种是为动画添加插值器以改变视图的属性值,从而实现理想的动画效果。Interpolator使用相对简单,下面就只给出一些提供的插值器的默认效果。

在代码中:直接调用setInterpolator(new AccelerateInterpolator());

在xml中:android:interpolator="@android:anim/accelerate_interpolator"
如果几个动画共用一个插值器,则:
android:shareInterpolator="true"
或者AnimatorSet调用setInterpolator

一个插值器不仅可以用于位移中,也可用在其他动画或者叠加动画效果中,其变化率如都遵循同一个函数公式。如下为插值器默认的公式,演示的图片由于裁剪问题可能有偏差。

BounceInterpolator:
x * x * 8.0,               (x < 0.3535)
(x-0.54719)* (x-0.54719)* 8+0.7,   (x < 0.7408)
(x-0.8526)* (x-0.8526)* 8+0.9,    (x < 0.9644)
(x-1.0435)* (x-1.0435)* 8+0.95    (x = 其他)

AnticipateInterpolator:
x * x * ((2+ 1) * x - 2)

AccelerateDecelerateInterpolator:
(cos((x+ 1) * π) / 2.0) + 0.5

AccelerateInterpolator:

pow(x,2)

AnticipateOvershootInterpolator:
0.5*2*x * 2*x * ((3 + 1) * 2*x - 3)             (0 < x < 0.5)
0.5*((2*x-2) * (2*x-2) * ((3 + 1) * (2*x-2) + 3)+2)  (0.5 <= x < 1.0)

DecelerateInterpolator:
1.0 - pow((1.0 - x), 2 * 1)

LinearInterpolator:
x

OvershootInterpolator:
(x-1) * (x-1) * ((2+ 1) *( x-1) + 2)+1

CycleInterpolator:
sin(2 * 1* π * x)

原文地址:https://www.cnblogs.com/Im-Victor/p/8777802.html

时间: 2024-10-08 13:40:18

几种常用的Interpolator(插值器)的动画效果的相关文章

jQuery演示10种不同的切换图片列表动画效果

经常用到的图片插件演示jQuery十种不同的切换图片列表动画效果 在线演示 下载地址 实例代码 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 <!DOCTYPE html> <html lang="en" class="no-

jQuery演示8种不同的图片遮罩层动画效果

效果预览 下载地址 jQuery插件大全 实例代码 <div class="container"> <h1>jQuery图标和文章动画效果</h1> <ul id="sti-menu" class="sti-menu"> <li data-hovercolor="#37c5e9"> <a href="#"> <h2 data-ty

move ---- 编写一个包含几种常用动画的js库

在操作dom元素的时候为了让网站显得更有活力或者某些想让人注意到, 经常需要用到一些小动画, 但常用的 jquery 库只有一种ease(先加速后减速的动画)运动方式的动画, 虽然这是很常用的动画, 但有时也会用到其他的, 最近写了一个集成几种常用动画的库, move.js , 如果不是走动画队列的话, 通常的动画库在进行一个动画的时候, 在对元素施加另一个动画就会马上停止当前动画, 马上执行新添加的动画, move动画库稍微修改了一下, 在新动画添加之后, 老动画还会继续跑, 两个动画会进行叠

实现逐帧动画和补间动画两种动画效果

1.逐帧动画(Frame Animation)通常在Android项目的res/drawable/目录下面定义逐帧动画的XML模板文件.编码的时候,需要在动画模板文件的<animation-list>标签中依次放入需要播放的图片,并设置好播放的间隔时间. <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"

iOS开发CoreAnimation解读之三——几种常用Layer的使用解析

iOS开发CoreAnimation解读之三——几种常用Layer的使用解析 一.CAEmitterLayer 二.CAGradientLayer 三.CAReplicatorLayer 四.CAShapeLayer 五.CATextLayer iOS开发CoreAnimation解读之三——几种常用Layer的使用解析 一.CAEmitterLayer CAEmitterLayer是CoreAnimation框架中的粒子发射层,在以前的一片博客中有详细的介绍和范例,这里不再重复,地址如下: 粒

几种常用的bootstrap功能。

---恢复内容开始--- 我对于bootstrap定义与一种插件,他可以使我们的网页布局更加的炫酷,更加的整洁和合理.他的优点不多说,缺点一个就够我们头疼的,那就是需要记一些长长的英文名. 我为大家说几种常用的bootstrap的常用功能,希望你们用到的时候,可以来看下. <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> <div class="c

多种动画效果的结合使用方法以及Interpolator简介

Interpolator的两种用法属性 1.在xml中设置android:interpolator="@android:anim/accelerate_decelerate_interpolator" 2.在.java文件中设置,有两种情况 若设置为true,则统一interpolator速度: AnimationSet animationSet = new AnimationSet(true); 若设置为false,则需要单独为各个动画设置interpolator Animation

五种常用的图片格式及其是否有数据压缩的总结

五种常用的图片格式及其是否有数据压缩的总结 声明:引用请注明出处http://blog.csdn.net/lg1259156776/ 说明:本文主要介绍五种最常见和最常用的图像格式:BMP,PNG,JPEG,JPEG200,以及GIF.在进行图像处理相关应用之前第一步首先是能够读取这些图像文件,虽然很多开发工具支持库比如OpenCV等已经帮助节省了这些工作的麻烦,便利的同时也使得开发人员不再熟悉这些基本的图像格式.本文的作用就在于将这五种常用的图像格式进行分条叙述,方便查阅. 内容借鉴主流图片格

CSS3绘制8种超炫的加载动画

CSS3绘制8种超炫的加载动画     逛前端开发网站的时候,偶尔发现一组非常炫酷的CSS3加载动画,遂迫不及待的做个Demo保存下来. 这些加载动画用到了CSS3的旋转transform属性,颜色透明度设置和伪元素操作等CSS技术.奇妙的组合,产生了意想不到的效果. 1.上下起伏波动的加载动画: #loader1, #loader1:before, #loader1:after { background: #f2fa08; -webkit-animation: load1 1s infinit