Android 动画使用 scale、alpha、translate、rotate、set

本贴最后更新于 2821 天前,其中的信息可能已经事过景迁

scale:尺寸伸缩动画

alpha:渐变透明动画

translate:位移动画

rotate:旋转动画

调用动画文件 给 View 执行动画

动画文件可以存放在res下的anim目录 Android Studio的话 需要自己手动创建这个文件夹 比如说我在anim下创建了一个动画文件名为scaleanim.xml那么在Java中引用的话 //加载动画对象 Animation animation = AnimationUtils.loadAnimation(this, R.anim.scaleanim); //启动动画 view.startAnimation(animation); //另外 动画animation还有一个执行监听事件 使用如下 使用场景比如说启动页面 动画结束后跳转页面 animation.setAnimationListener(new Animation.AnimationListener() { /** * 动画启动 * @param animation */ @Override public void onAnimationStart(Animation animation) { } /** * 动画结束 * @param animation */ @Override public void onAnimationEnd(Animation animation) { } /** * 动画重复 * @param animation */ @Override public void onAnimationRepeat(Animation animation) { } });

Animation 属性

android:duration 动画持续时间,以毫秒为单位 android:fillAfter 如果设置为true,控件动画结束时,将保持动画最后时的状态 android:fillBefore 如果设置为true,控件动画结束时,还原到开始动画前的状态 android:fillEnabled 与android:fillBefore 效果相同,都是在动画结束时,将控件还原到初始化状态 android:repeatCount 重复次数 android:repeatMode 重复类型,有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍,必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型,即回放时的动作。 android:interpolator 设定插值器,其实就是指定的动作效果,比如弹跳效果等。

scale 尺寸伸缩动画

首先在anim目录下创建scaleanim.xml文件 <?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="700" android:fromXScale="0.0" android:fromYScale="0.0" android:pivotX="50%" android:pivotY="50%" android:toXScale="1.0" android:toYScale="1.0" />
  1. duration:动画的执行时间 毫秒为单位
  2. fromXScale:执行动画的起始缩放 X 轴
  3. fromYScale:执行动画的起始缩放 Y 轴
  4. pivotX:缩放起点 X 轴坐标
  5. pivotY:缩放起点 Y 轴坐标
  6. toXScale:执行动画的结束缩放 X 轴
  7. toYScale:执行动画的结束缩放 Y 轴

toYScale、toXScale、fromXScale、fromYScale 这几个属性都是缩放比例 浮点数类型 一般使用 0-1 之间的数值

pivotX、pivotY 这两个属性可以是数值、百分数、百分数 p 三种样式。

先上一张效果图

可以看到该图片的图片动画启动点是中间 因为 pivot 的 X Y 轴设置的是 50% 的缩放 fromXScale fromYScale 写的是 0 所以从小到大缩放

如果 toXScale 设置超过 1 会怎么样

<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="700" android:fromXScale="0.0" android:fromYScale="0.0" android:toXScale="1.5" android:toYScale="1.5" />

可以看到动画执行结束的时候 图片比之前变大了一些
因为结尾的 X、Y 轴设置的是 1.5 则表示在原大小 放大了 0.5 倍 1 是原比例
另外 这里将 pivot 的 X、Y 轴缩放属性给删除了,所以这个动画起始位置是从左上角开始执行的
因为 x y 轴默认值是 0 所以没有进行缩放的话 就是从左上角开始执行 如果需要效果由大变小的话 将 fromScale 和 toScale 的值互换即可。

保留缩放后的大小

<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:duration="1000" android:fillAfter="true" android:fromXScale="0.5" android:fromYScale="0.5" android:pivotX="50%" android:pivotY="50%" android:toXScale="1.5" android:toYScale="1.5" /> 添加属性android:fillAfter="true" 即可保留结束的状态 而且我这里将起始X、Y轴(fromXScale、fromYScale)缩放了0.5 可以看到现在效果是把图片缩小了一半再慢慢放大。之前是缩小到最小 再放大的。 另外pivotY、pivotX属性 当取值在百分数后面加上一个字母p,就表示,取值的基数是父控件,即在原点的基础上增加的值是父标签的百分值。

alpha 渐变动画

先在anim文件夹下创建动画文件alphaanim.xml <?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:fromAlpha="1.0" android:toAlpha="0.1" android:duration="3000" android:fillAfter="true"> </alpha> fromAlpha:起始透明度 1为不透明 0为透明 toAlpha:结束透明度 duration:动画执行时间 单位毫秒 fillAfter:是否保留结束后的状态 fromAlpha、toAlpha都是比例 浮点类型 0.0-1.0 1为原样 0最透明看不见 透明动画其实比较简单 就不做过多叙述了。

rotate 旋转动画

创建动画文件 <?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="3000" android:fromDegrees="0" android:pivotX="50%" android:pivotY="50%" android:toDegrees="360"> </rotate>
  • fromDegrees:开始旋转的角度 正值表示顺时针 负值表示逆时针
  • toDegrees:结束旋转的角度 正值表示顺时针 负值表示逆时针
  • pivotX、pivotY 跟 scale 动画的概念一样。

第一张图是没有缩放 pivotX pivotY 的 那么它的起始 x y 都是 0 所以是从左上角开始旋转

第二张图是 x y 都缩放 50% 即从中间开始旋转

忘了录屏重复旋转的了 就简单写一下吧 android:repeatCount 重复次数 如果想一直自动重复的话 给它一个-1就好 android:repeatMode 这个属性是重复类型 有reverse和restart两个值,reverse表示倒序回放,restart表示重新放一遍 另外repeatMode必须与repeatCount一起使用才能看到效果

未添加 pivot 缩放
缩放 pivot 50%

translate 平移动画

android:fromXDelta 起始点 X 轴坐标,可以是数值、百分数、百分数 p 三种样式,比如 50、50%、50%p

android:fromYDelta 起始点 Y 轴从标,可以是数值、百分数、百分数 p 三种样式;

android:toXDelta 结束点 X 轴坐标

android:toYDelta 结束点 Y 轴坐标

创建动画 移动Y轴 <?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fillAfter="true" android:fromYDelta="0" android:toYDelta="79%p"> </translate>

创建动画 向左横移 <?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fillAfter="true" android:fromXDelta="0" android:toXDelta="-43%p"> </translate>

抛物线 (虽然抛的不好看)同时移动X Y轴 <?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:duration="2000" android:fillAfter="true" android:fromXDelta="0" android:fromYDelta="0" android:toXDelta="43%p" android:toYDelta="79%p"> </translate>

动画组 SET

set标签自已是没有属性的,他的属性都是从Animation继承而来,但当它们用于Set标签时,就会对Set标签下的所有子控件都产生作用。 还是创建一个xml文件在anim文件夹下 <?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:duration="3000" android:fillAfter="true"> <alpha android:fromAlpha="0.0" android:toAlpha="1.0"/> <scale android:fromXScale="0.0" android:toXScale="1.4" android:fromYScale="0.0" android:toYScale="1.4" android:pivotX="50%" android:pivotY="50%"/> <rotate android:fromDegrees="0" android:toDegrees="720" android:pivotX="50%" android:pivotY="50%"/> </set>

  • Animation
    1 引用
  • Android

    Android 是一种以 Linux 为基础的开放源码操作系统,主要使用于便携设备。2005 年由 Google 收购注资,并拉拢多家制造商组成开放手机联盟开发改良,逐渐扩展到到平板电脑及其他领域上。

    335 引用 • 324 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...