2-4.1 基础动画全纪录

[TOC]

1. View/(Tween)补间动画 Animation

View动画时通过对View进行平移、旋转、缩放和显隐变换,从而产生动画效果,是一种渐进式的动画


View动画种类.png

1.1 平移 TranslateAnimation

Java代码
//起点X,Y 增加的X,Y
TranslateAnimation ta = new TranslateAnimation(0, 200, 0, 300);
ta.setDuration(1000);
animationView.startAnimation(ta);

XML代码 xml动画文件路径:res/anim/xxxanimation.xml
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromYDelta="0%p"
    android:fromXDelta="0%p"
    android:toYDelta="90%p"
    android:toXDelta="90%p"
    android:duration="1000" />

Animation ta1 = AnimationUtils.loadAnimation(this, R.anim.translate);
animationView.startAnimation(ta1);

更复杂实现

//fromXType,fromXValue, toXType,toXValue,fromYType,fromYValue, toYType,toYValue
//起点X方向参照值,起点X,终点X方向参照值,终点X,起点Y方向参照值,起点Y,终点Y方向参照值,终点Y
TranslateAnimation ta = new TranslateAnimation(Animation.RELATIVE_TO_SELF,0,Animation.RELATIVE_TO_SELF,1,
Animation.RELATIVE_TO_SELF,0,Animation.RELATIVE_TO_SELF,1);
参照值 描述
Animation.ABSOLUTE 具体的坐标值,指绝对的屏幕像素单位
Animation.RELATIVE_TO_SELF 相对自己的坐标值,0.1f是指自己的坐标值乘以0.1
Animation.RELATIVE_TO_PARENT 相对父容器的坐标值,0.1f是指父容器的坐标值乘以0.1

简单实现实际上是参照值全为Animation.ABSOLUTE的情况

1.2缩放 ScaleAnimation

Java代码
//起始X倍数,最终X倍数,起始Y倍数,最终X倍数
ScaleAnimation sa = new ScaleAnimation(4, 1, 4, 1);
sa.setDuration(2000);
baseAnimationView.startAnimation(sa);

XML代码
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXScale="0.0"
    android:fromYScale="0.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="1.0"
    android:toYScale="1.0"/>

Animation sa1 = AnimationUtils.loadAnimation(this, R.anim.scale);
                animationView.startAnimation(sa1);

更复杂实现

//起始X倍数,最终X倍数,起始Y倍数,最终X倍数,缩放模式,0.5f自身中心,缩放模式,0.5f自身中心
//ScaleAnimation sa = new ScaleAnimation(0, 2, 0, 2);
ScaleAnimation sa = new ScaleAnimation(0, 2, 0, 2,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
sa.setDuration(1000);
animationView.startAnimation(sa);

1.3旋转 RotateAnimation

Java代码
//起始角度,最终角度,圆心X,Y坐标
//起始角度,最终角度,旋转模式,0.5f自身中心,旋转模式,0.5f自身中心
//RotateAnimation ra = new RotateAnimation(0, 360, 100, 100);
RotateAnimation ra = new RotateAnimation(0,360,RotateAnimation.RELATIVE_TO_SELF,0.5f,RotateAnimation.RELATIVE_TO_PARENT,0.5f);
ra.setDuration(1000);
animationView.startAnimation(ra);

XML代码
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration ="1000"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:pivotX="50%"
    android:pivotY="50%" />
//调用
Animation ra1 = AnimationUtils.loadAnimation(this, R.anim.rorate);
animationView.startAnimation(ra1);

1.4 透明度 AlphaAnimation

Java代码
//起始透明度,结束透明度
AlphaAnimation aa = new AlphaAnimation(0, 1);
aa.setDuration(1000);
animationView.startAnimation(aa);

XML代码
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromAlpha="0.0"
    android:toAlpha="1.0"
    />
//调用
Animation aa1 = AnimationUtils.loadAnimation(this, R.anim.alpha);
animationView.startAnimation(aa1);

1.5 动画集合

Java代码
 TranslateAnimation ta = new TranslateAnimation(0, 200, 0, 0);
ScaleAnimation sa = new ScaleAnimation(4, 2, 4, 2,
    Animation.RELATIVE_TO_SELF, 0.5f,
    Animation.RELATIVE_TO_SELF, 0.5f);
RotateAnimation ra = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f,      Animation.RELATIVE_TO_SELF, 0.5f);
AlphaAnimation aa = new AlphaAnimation(0, 1);
AnimationSet animationSet = new AnimationSet(true);
ta.setDuration(1000);
sa.setDuration(1000);
ra.setDuration(1000);
aa.setDuration(1000);
animationSet.addAnimation(ta);
animationSet.addAnimation(sa);
animationSet.addAnimation(ra);
animationSet.addAnimation(aa);
animationSet.setDuration(1000);
baseAnimationView.startAnimation(animationSet);
XML代码
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:ordering="sequentially"
    android:fillAfter="false"
    android:zAdjustment="normal"
    >
    <!-- 数字为绝对值,x%p为父容器坐标值的x%值    -->
    <translate
        android:duration="1000"
        android:fromXDelta="0%p"
        android:fromYDelta="0%p"
        android:toXDelta="90%p"
        android:toYDelta="90%p" />
    <scale
        android:duration="1000"
        android:fromXScale="0.0"
        android:fromYScale="0.0"
        android:toXScale="1.0"
        android:toYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        />
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        />
    <alpha
        android:duration="1000"
        android:fromAlpha="0.0"
        android:toAlpha="1.0" />

</set>
调用
Animation a = AnimationUtils.loadAnimation(this, R.anim.base_animation);
baseAnimationView.startAnimation(a);

旋转动画与平移动画做集合时,旋转坐标轴异常,即如何实现 滚动至指定位置动画?

2. 帧动画/AnimationDrawable

帧动画是通过顺序播放一系列图像从而产生动画效果,是一种简单的图片切换动画

XML代码 xml动画文件路径:res/drawable/xxxanimation.xml 
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/p4" android:duration="100"/>
    <item android:drawable="@drawable/p5" android:duration="100"/>
    <item android:drawable="@drawable/p6" android:duration="100"/>

</animation-list>
调用
 fAnimaitonView.setBackgroundResource(R.drawable.drawable_animation);
((AnimationDrawable) fAnimaitonView.getBackground()).start();

oneshot ture表示执行一次 false表示循环执行

3. 自定义动画

我们可以通过继承Animation类,重写它的initialize和applyTransformation方法来实现我们想要的效果,中间涉及数学上矩阵变换的概念,但实际开发中几乎用不到,因此待后续有时间做基础整理

4. 使用补充

4.1 动画监听

View动画不经常使用监听,但也有需要的时候

ta.setAnimationListener(new Animation.AnimationListener() {
            @Override
    public void onAnimationStart(Animation animation) {
        //启动时回调
    }
    @Override
    public void onAnimationEnd(Animation animation) {
        //结束时回调
    }
    @Override
    public void onAnimationRepeat(Animation animation) {
        //重复时回调
    }
});

4.2 插值器

插值器可以理解为动画进行过程中不同阶段时候设置动画的速度值,如匀速运动,加速运动,减速运动等

  • interpolator 设置插值器,默认android:anim/accelerate_decelerate_interpolator 加速减速

    • @android:anim/accelerate_interpolator: 越来越快
    • @android:anim/decelerate_interpolator:越来越慢
    • @android:anim/accelerate_decelerate_interpolator:先快后慢
    • @android:anim/anticipate_interpolator: 先后退一小步然后向前加速
    • @android:anim/overshoot_interpolator:快速到达终点超出一小步然后回到终点
    • @android:anim/anticipate_overshoot_interpolator:先后退一小步,到达终点超出一小步然后回到终点
    • @android:anim/bounce_interpolator:到达终点产生弹球效果,弹几下回到终点
    • @android:anim/linear_interpolator:均匀速度。
    • @android:anim/cycle_interpolator 循环播放,其速率为正弦曲线
  • shareInterpolator 设置集合是否与集合中的动画共享一个插值器,不指定则使用单独指定或是默认插值器

4.3 特殊使用场景

  • LayoutAnimation 为ViewGroup指定子元素的出场动画

    //Java代码
    Animation aSet = AnimationUtils.loadAnimation(this, R.anim.animation_set_1);
    LayoutAnimationController controller = new LayoutAnimationController(aSet);
    controller.setOrder(LayoutAnimationController.ORDER_RANDOM);
    controller.setDelay(0.5f);
    content_ll.setLayoutAnimation(controller);
    
    //XML代码 
    <?xml version="1.0" encoding="utf-8"?>
    <layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
        android:delay="0.5"
        android:animationOrder="normal"
        android:animation="@anim/animation_set_1"/>
    //指定动画
    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:shareInterpolator="true">
        <rotate
            android:fromDegrees="0"
            android:toDegrees="360"
            android:pivotX="50%"
            android:pivotY="50%"
            />
        <alpha
            android:fromAlpha="0.0"
            android:toAlpha="1.0" />
    </set>
    使用时在ViewGroup中指定     android:layoutAnimation="@anim/layout_animation"
    

    delay 表示子元素之间动画间隔时间,实际时间为动画周期*delay值

    animationOrder 子元素动画顺序: normal-顺序 reverse-逆序 random-随机

    animation 指定动画

  • Activity切换动画

    使用方法:overridePendingTransition(int enterAnim,int exitAnim)

    • 必须在startActivity或finish之后调用
    • enterAnim-打开时的动画资源,进入动画
    • exitAnim - 被暂停时的动画资源,退出动画
  • Fragment切换动画

    使用方法:setCustomAnimations(@AnimatorRes @AnimRes int enter, @AnimatorRes @AnimRes int exit, @AnimatorRes @AnimRes int popEnter, @AnimatorRes @AnimRes int popExit)

    • 在FragmentManager开启事务时进行操作
    • enter Fragment被添加或绑定时所呈现动画的资源id
    • exit Fragment被移除或解绑时所呈现动画的资源id
    • popEnter Fragment从栈中弹出时所呈现动画的资源id
    • popExit Fragment压入栈时所呈现动画的资源id

    v4包下的Fragment只能采用补间动画,因为属性动画是API11新引入的

  • 共享元素动画 5.0支持

    示例代码:

    1. 在共享的控件元素中 加入属性·`android:transitionName=“your_str”`
    2.跳转时设置 指定共享的视图元素
    ActivityOptionsCompat options = ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(), shareView, "image");
    ActivityCompat.startActivity(getActivity(), intent, options.toBundle());
    
    • ActivityOptionsCompat makeSceneTransitionAnimation(Activity activity,View sharedElement, String sharedElementName)
      activity-发起跳转的Activity,shareElement-共享的控件,sharedElementName-定义的字符串

    在Fragment如何使用共享元素转场动画
    Fragment的startActivity()方法无法传入ActivityOptionsCompat,所以需要使用
    ActivityCompat.startActivity()来进行跳转

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

推荐阅读更多精彩内容