美文网首页Android属性动画
2018-04-21—属性动画(1) 初步认识ObjectAni

2018-04-21—属性动画(1) 初步认识ObjectAni

作者: 季白zy | 来源:发表于2018-04-22 11:08 被阅读0次

在上一次时候,我们讲解了帧动画和补间动画,尤其是补间动画,有一个小问题不知道大家发现没有:

举个简单的例子,我们把一个图片设置点击事件,让他吐司。然后我们给他设置缩放,让他缩放到0,0(就是消失),然后我们再点击,看看会怎么样:

我们发现我们把他变道最小了,点击它原来的位置还是会吐司的。相信有人已经猜到今天我们要讲什么了,没错,我们如果想要让它缩放了以后点击原来的位置不会吐司,那么我们只需要用属性动画来实现这个功能就好了。


属性动画:

我们首先来对比一下属性动画和补间动画的区别:

补间动画和属性动画区别

很明显了,补间动画知识改变了View显示效果,如位置变化,大小比例变化,旋转,透明度变化,但是他只是从显示上改变了这些,而实际上相关联的控件(Button、ImageView等View控件)他们的大小,位置,旋转角度,透明度这些属性还是没有变化的。

而属性动画就不一样了,我们每一次动画所改变的效果,都是直接改变的View的相关属性。

我们上一次学了补间动画,现在学习属性动画的话会相对轻松点,其实还是对应的那四种变换加上组合变换,都是固定的逻辑。下面我们一起来看一下:

首先我们还是设置一下布局:

xml布局

一张图片,一个按钮实现点击效果。


Java实现:

平移:

属性动画跟补间动画不一样,它对应的类有一个叫做ObjectAnimation的类(还有一个ValueAnimation这个下次再说),这个类可以实现我们四种变换方式。我们来上一下代码大家就都清楚了:

ObjectAnimator animatorT = ObjectAnimator.ofFloat(img,"translationX",0,100);

animatorT.setDuration(2000);

animatorT.start();

我们新建了一个叫做ObjectAnimator的对象,这个对象就是我们所说的属性动画其中一个类,我们通过它里面的静态方法ofFloat方法来获取对象,我们看一下里面的参数:

ofFloat方法参数

他有5个构造方法,我们只看第一个,也是我们最常用的一个

第一个参数是我们要绑定的控件对象,我们绑定img,就是让img控件进行一系列操作,

第二个参数是变换类型,这里面有这么几个参数

我们刚才让他进行了x轴方向向右移动100的操作,所以属性名字里面写的是translationX。

最后一个参数是可变长参数,这个我们后面写多少参数都可以,在上面我只写了0,100两个,他的意思是x轴起始位置是偏移量0,x轴结束位置是偏移量100。

如果我在里面再加一个0,那么他会先向右平移100,然后又回到原位。也就是说我们在里面添加多少数据,他就会依次执行。

可能有的同学会问了,这个没有设置fillAfter啊,他怎么结束后保留了最后样式?这就是我们属性动画和补间动画的区别了,我们属性动画在收到我们的数值之后,是直接改变了我们的位置,而不仅仅是动画效果。


2.旋转

不多说,我们直接上代码:

ObjectAnimator animatorR = ObjectAnimator.ofFolat(img,"Rotation",0,360,180);

animatorR.setDuration(3000);

animatorR.start();

有了上面的例子,大家这个应该都可以看懂的吧,我们绑定了img控件,然后让他的旋转轴为垂直屏幕方向,然后先转动到顺时针360的方向上,然后又转回刚才180的方向上,总共转动时间为3秒。

那么关于缩放和透明度也是同样的道理,在这里就不多说了。


XML实现:

这个跟补间动画一样,我们同样可以通过xml来实现。

animator目录

首先我们要创建一个名为animator的目录文件,然后在里面创建一个叫做anim_alpha的文件。

<objectAnimator

    android:propertyName="alpha"

    android:valueFrom="1"

    android:valueTo="0"

    android:duration="3000"

    android:repeatCount="1">

<objectAnimator/>

我们把头标签市值为objectAnimator。

然后在里面加入相关属性。

ObjectAnimator animatorT = (ObjectAnimator) AnimatorInflater.loadAnimator(this,R.animator.animator_alpha);

animatorT.setTarget(img);

animatorT.start();

我们通过AnimatorInflater类的loadAnimator方法来获取我们刚才的xml文件。我们来看一下效果:

渐变效果

关于其他的三种xml实现也是同样的道理。

下面我们来看一下如何实现属性动画的组合:


属性动画组合:

1.java实现:

AnimatorSet类

属性动画组合对应的是AnimatorSet类,我们只需要new他就好。

它对应的主要有这四个方法,play,before,with,after。这四个方法里面全都是填入往后儿们的animator类,但是先后执行顺序不一样,分别对应着开启,最后,同步,最开始执行。

我们来看一下效果:


我们注意到他是先执行的after,然后是play和with同时执行,最后执行的before。所以大家记住这个顺序,无论怎么写,都是这个执行顺序。

2.XML实现

xml相对于java代码实现组合,就轻松多了,下面的一些属性大家都可以看懂,我这里只强调一下ordering这个属性,这个属性有两个值:together是同步,而sequentially是按照我们写入的顺序依次执行。

相关文章

  • 2018-04-21—属性动画(1) 初步认识ObjectAni

    在上一次时候,我们讲解了帧动画和补间动画,尤其是补间动画,有一个小问题不知道大家发现没有: 举个简单的例子,我们把...

  • 2018-05-22—属性动画(7) 重新认识ObjectAni

    又和大家见面了,笔者想问一下,大家有没有用上次的那个表白神器啊,那么丑的界面可能有不少人被吐槽了吧哈哈。。。。这个...

  • 动画--->ValueAnimation(属性动画)初步认

    目录无标题.png 说明 在一定时间间隔内,通过不断对值进行改变,并不断将该值赋给对象的属性,从而实现该对象在该属...

  • 016 过渡及动画

    过渡与动画 一、过渡 1、过渡属性 二、动画 1、动画属性 2、动画体 v_hint:动画属性设置给指定选择器标签...

  • 动画--->FrameAnimation(帧动画)初步认识

    目录 说明 动画由一系列图片组成,一帧一帧播放 onshot属性(true:只播放一次 false:播放多次) 演...

  • CSS-3D知识

    1.CSS动画 1.1 CSS动画属性-animation animation:为CSS动画属性,使用该属性可以替...

  • UI(四十八)属性动画

    属性动画->通过改变图层或者视图上面的属性值(支持动画的属性)产生的动画 属性动画的常用方法属性: 1、初始化 +...

  • iOS - 属性动画

    属性动画->通过改变图层或者视图上面的属性值(支持动画的属性)产生的动画 属性动画的常用方法属性: 1、初始化+(...

  • Android属性动画基础篇

    1、什么是属性动画 简单来说就是通过改变对象属性而形成的动画效果。 2、为什么使用属性动画 我们知道,在属性动画之...

  • 2018-11-28

    1、CABasicAnimation基本动画 各种属性 CABasicAnimation基本动画 各种属性 - u...

网友评论

    本文标题:2018-04-21—属性动画(1) 初步认识ObjectAni

    本文链接:https://www.haomeiwen.com/subject/nnotlftx.html