那些年一起学过的Android动画(一)

Android动画有三大类(视图动画、帧动画、属性动画【3.0引进】)

为了就是让人机交互更加友好,(讲的高大上一点更容易被关注!)

合理的使用动画能让用户获得更加愉悦的使用体验!你懂的很愉悦!

动画分类

android已经写好了一些动画可以方便的使用例如『透明度』『旋转』『缩放』『位移』

1.视图动画(View Animation)


  • 做过Flash的都会知道补间动画,给出两个关键帧,通过一些算法将给定属性值在给定的时间内在两个关键帧间渐变。
  • 可以给一个View同时设置多个动画(AnimationSet,AnimatorSet),比如从透明至不透明的淡入效果,与从小到大的放大效果,这些动画可以同时进行,也可以在一个完成之后开始另一个。
  • Android中提供了 AlphaAnimation、RotateAnimation、TranslateAnimation、ScaleAnimation看名字就应该知道对应上面所述的几个动画它们的用法也很简单

   //透明动画  其他动画同理 换一下参数给指定的view启动动画就实现了
    AlphaAnimation aa=new AlphaAnimation(0f,1f);
    aa.setDuration(2000);
    view.startAnimation(aa);
    
    在此我不一一赘述代码。。因为我懒,而且推荐大家自己看看里面的属性,会懂得更多
    释放你的求知欲吧!!
    

动画还需要监听一些事情比如开始、结束、是否重复等等

aa.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                
            }

            @Override
            public void onAnimationEnd(Animation animation) {

            }

            @Override
            public void onAnimationRepeat(Animation animation) {

            }
        });

1.X 接下来我们在介绍中提到AnimationSet


  • 这个类做动画一般来说会比较常用,因为它控制了多个动画一起动还是队列的动,通俗来讲就是你先动还是我先动,或者说大家一起动起来~! 好像很Happy的样子

  • 其实就是这个类内部维护了一个List<Animation> AnimationSet继承于Animation

  • 同样简单动画可以用XML实现,在我们目录里可以新建一个anim的文件夹,里面可以放一个根为「set」的 原理是一样的

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:fromAlpha="0.3"
        android:toAlpha="0.5"></alpha>

    <rotate
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="180"/>
    <scale
        android:fromXScale="0.5"
        android:fromYScale="0.5"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1"
        android:toYScale="1"/>
    <translate
        android:fromXDelta="50%"
        android:fromYDelta="50%"
        android:toXDelta="100%"
        android:toYDelta="100%"/>
</set>

使用AnimationUtils.loadAnimation(this,R.anim.sad)加载

(吐槽一下我打样子输入法无限给我杨紫你说这么黑好么!!!)


AnimationSet set=new AnimationSet(true);
        set.addAnimation(aa);//加进去就好了 注意内存小心OOM 和内存泄露
        set.setFillAfter(true);//保持结束动画的样子,setFillBefore你懂的
        set.setDuration(5000);
        view.startAnimation(set);


 
  • 对于内存要有借有还,再借不难

2.帧动画(Frame Animation)


度娘说

  • 动画是通过把人物的表情、动作、变化等分解后画成许多动作瞬间的画幅,再用摄影机连续拍摄成一系列画面,给视觉造成连续变化的图画。它的基本原理与电影、电视一样,都是视觉暂留原理。医学证明人类具有“视觉暂留”的特性,人的眼睛看到一幅画或一个物体后,在0.34秒内不会消失。利用这一原理,在一幅画还没有消失前播放下一幅画,就会给人造成一种流畅的视觉变化效果。

结论就是 动画标准是一秒24帧,也就是24张画面组成一秒。电视播放标准是25帧每秒。

  • 那么就很好理解啦,1秒大概24幅图片!!!
网络图片素材

用AS的在drawable中新建一个xml

<?xml version="1.0" encoding="utf-8"?>
 <animation-list
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:oneshot="true"
        >
    <!--
    根标签为animation-list,其中oneshot代表着是否只展示一遍,设置为false会不停的循环播放动画
    根标签下,通过item标签对动画中的每一个图片进行声明
    android:duration 表示展示所用的该图片的时间长度
 -->

    <item android:drawable="@drawable/icon1" android:duration="150"></item>
        <item android:drawable="@drawable/icon2" android:duration="150"></item>
        <item android:drawable="@drawable/icon3" android:duration="150"></item>
        <item android:drawable="@drawable/icon4" android:duration="150"></item>
        <item android:drawable="@drawable/icon5" android:duration="150"></item>
        <item android:drawable="@drawable/icon6" android:duration="150"></item>
    </animation-list>
    
    
    在activity中用一下即可
    
        view.setImageResource(R.drawable.icon);
        AnimationDrawable ad = (AnimationDrawable) view.getDrawable();
        ad.start();
        
        当然你可以手动添加图片帧
        ad.addFrame(@NonNull Drawable frame, int duration)
        

3.属性动画(Property Animation)


  • 属性动画有 ObjectAnimator、ValueAnimator,常用的还是ObjectAnimator继承于ValueAnimator
 AnimatorSet animatorSet = new AnimatorSet();///创建属性动画集
        animatorSet.playTogether(///“playTogether”表示所有的子动画同时运作
                ObjectAnimator.ofFloat(view, "rotationX", 0, 360),
                ObjectAnimator.ofFloat(view, "rotationY", 0, 180),
                ObjectAnimator.ofFloat(view, "rotation", 0, -90),
                ObjectAnimator.ofFloat(view, "translationX", 0, 90),
                ObjectAnimator.ofFloat(view, "translationY", 0, 90),
                ObjectAnimator.ofFloat(view, "scaleX", 1, 1.5f),
                ObjectAnimator.ofFloat(view, "scaleY", 1, 0.5f),
                ObjectAnimator.ofFloat(view, "alpha", 1, 0.25f, 1)
        );
        animatorSet.setDuration(5 * 1000).start();
  • 同样Animator也可以写XML来实现

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:ordering="sequentially">
    <objectAnimator
        android:duration="3000"
        android:propertyName="rotationX"
        android:repeatCount="infinite"
        android:repeatMode="reverse"
        android:startOffset="0"
        android:valueFrom="0"
        android:valueTo="360"
        android:valueType="intType" />


</set>

    AnimatorSet set = (AnimatorSet)             AnimatorInflater.loadAnimator(getApplicationContext(), R.animator.property_animator);
    set.setTarget(mView);//设置一下要动的目标View
    set.start();


一般监听有
ObjectAnimator.ofArgb().addListener(new Animator.AnimatorListener() {
            @Override
            public void onAnimationStart(Animator animation) {
                //动画开始
            }

            @Override
            public void onAnimationEnd(Animator animation) {
                //动画结束
            }

            @Override
            public void onAnimationCancel(Animator animation) {
                //动画取消
            }

            @Override
            public void onAnimationRepeat(Animator animation) {
                //重复动画
            }
        });

        ObjectAnimator.ofFloat(view, "alpha", 1, 0.25f, 1).addUpdateListener(new ValueAnimator
                .AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                //动画值更新通过 animation.getAnimatedValue()取得
                //这个更新值能让我们做一些规律动画
            }
        });
        
        

总结


  • AnimationSet 与 AnimatorSet 最大的不同在于,AnimationSet 使用的是 Animation 子类、AnimatorSet 使用的是 Animator 的子类。

Animation 是针对视图外观的动画实现,动画被应用时外观改变但视图的触发点不会发生变化,还是在原来定义的位置。

Animator是针对视图属性的动画实现,动画被应用时对象属性产生变化,最终导致视图外观变化。

  • 这一章讲了一个动画大概,下一章一起看看自定义动画和场景动画还有现在的流行的SVG动画

有问题可以来我博客或者简书反馈,谢谢大家的停留在这里时间

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,817评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,329评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,354评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,498评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,600评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,829评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,979评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,722评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,189评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,519评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,654评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,329评论 4 330
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,940评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,762评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,993评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,382评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,543评论 2 349

推荐阅读更多精彩内容

  • 1 背景 不能只分析源码呀,分析的同时也要整理归纳基础知识,刚好有人微博私信让全面说说Android的动画,所以今...
    未聞椛洺阅读 2,697评论 0 10
  • 在手机上去实现一些动画效果算是件比较炫酷的事情,因此Android系统在一开始的时候就给我们提供了两种实现动画效果...
    Ten_Minutes阅读 3,870评论 3 11
  • 仿佛又到了一个路口 又到了一个分开的季节 散场...
    祯至九思阅读 231评论 0 3
  • 匆匆,何能聆听时间流淌的妙音?忙忙,何能知晓小草的趣事?
    木易当兴阅读 153评论 0 0
  • 昨儿个阅读完《相亲日记》后给了作者留言说,本下定决心明年初开始相亲的,现在又不想相了。作者赶紧安慰道:“别~相亲成...
    吉吉安zyy阅读 478评论 3 5