View动画(补间动画)
补间动画的属性
Animation的属性
JAVA方法 | XML属性 | 解释 |
---|---|---|
setDetachWallpaper(boolean) | android:detachWallpaper | 是否在壁纸上运行 |
setDuration(long) | android:duration | 设置动画持续时间,单位为毫秒 |
setFillAfter(boolean) | android:fillAfter | 控件动画结束时控件是否保持动画最后状态 |
setFillBefore(boolean) | android:fillBefore | 控件动画结束时控件是否还原到开始动画前的状态 |
setFillEnable(boolean) | android:fillEnable(boolean) | 与android:fillBefore效果相同 |
setInterpolator(boolean) | android:interpolator | 设置插值器(指定的动画效果,如:回弹等) |
setRepeatCount(int) | android:repeatCount | 重复次数 |
setRepeatMode(int) | android:repeatMode | 重复类型:reverse倒序回放、restart从头播放 |
setStartOffset(long) | android:startOffset | 调用start函数后等待开行运行的时间,单位为毫秒 |
setZadjustment(int) | android:zAdjustment | 表示被设置动画的内容运行时在Z轴的位置(top/bottom/normal),默认为normal |
由于Animation类是其抽象父类,那么我们在使用补间动画无论是哪一种都已经具备了以上属性。
下面是每一种补间动画的特有属性:
Alpha属性
JAVA方法 | XML属性 | 解释 |
---|---|---|
AlphaAnimation(float fromAlpha,…) | android:fromAlpha | 动画开始的透明度(0.0到1.0,0.0是全透明,1.0是不透明) |
AlphaAnimation(…, float toAlpha) | androdi:toAlpha | 动画结束的透明度(同上) |
Rotate属性
JAVA方法 | XML属性 | 解释 |
---|---|---|
RotateAnimation(float fromDegrees, …) | android:fromDegress | 旋转开始角度,正代表顺时针度数,负代表逆时针度数 |
RotateAnimation(…, float toDegress) | android:toDegress | 旋转结束角度(同上) |
RotateAnimation(…, …, float pivotX, …) | android:pivotX | 缩放起点X坐标(数值、百分数、百分数p,譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点) |
RotateAnimation(…, …, …, pivotY) | android:pivotY | 缩放起点Y坐标(同上) |
Scale属性
JAVA方法 | XML属性 | 解释 |
---|---|---|
ScaleAnimation(float fromX, …) | android:fromXScale | 初始X轴缩放比例,1.0表示无变化 |
ScaleAnimation(…, float toX) | android:toXScale | 结束X轴缩放比例 |
ScaleAnimation(…, …, float fromY, …) | androd:fromYScale | 初始Y轴缩放比例 |
ScaleAnimation(…, …, …, float toY) | android:toYScale | 结束Y轴缩放比例 |
ScaleAnimation(…, float pivotX, …) | android:pivotX | 缩放起点X轴坐标(同上) |
ScaleAnimation(…, float pivotY) | android:pivotY | 缩放起点Y轴坐标(同上) |
Translate属性
JAVA方法 | XML属性 | 解释 |
---|---|---|
TranslateAnimation(float fromXDelta, …) | android:fromXDelta | 平移起始点X轴坐标 |
TranslateAnimation(…, float toXDelta) | android:toXDelta | 平移结束点X轴坐标 |
TranslateAnimation(…, float fromYDelta, …) | android:fromYDelta | 平移起始点Y轴坐标 |
TranslateAnimation(…, float toYDelta) | android:toYDelta | 平移结束点Y轴坐标 |
AnimationSet属性
AnimationSet类比较特殊,因为该类是以上4类的组合容器管理类,没有自己特有的属性,它的属性继承自它的父类:Animation。
我们在使用的时候需要注意,当我们在对set标签设置属性的时候,那么其标签下的所有控件都会产生影响。
补间动画的使用
我们可以在代码以及XML中使用补间动画,Android官方文档中推荐我们使用XML文件定义补间动画,因为它更可读,可重复使用,并且支持swappable than hard-coding的动画。
4. 具体使用
- 补间动画的使用方式分为两种:在
XML
代码 /Java
代码里设置
- 前者优点:动画描述的可读性更好
- 后者优点:动画效果可动态创建
- 下面我将详细平移、缩放、旋转 & 透明度动画的使用步骤
4.1 平移动画(Translate)
设置方法1:在XML 代码中设置
- 步骤1:在
res/anim
的文件夹里创建动画效果.xml
文件
此处路径为
res/anim/view_animation.xml
- 步骤2:根据 不同动画效果的语法 设置 不同动画参数,从而实现动画效果。平移动画效果设置具体如下:
view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用<translate /> 标签表示平移动画
<translate xmlns:android="http://schemas.android.com/apk/res/android"
// 以下参数是4种动画效果的公共属性,即都有的属性
android:duration="3000" // 动画持续时间(ms),必须设置,动画才有效果
android:startOffset ="1000" // 动画延迟开始时间(ms)
android:fillBefore = “true” // 动画播放完后,视图是否会停留在动画开始的状态,默认为true
android:fillAfter = “false” // 动画播放完后,视图是否会停留在动画结束的状态,优先于fillBefore值,默认为false
android:fillEnabled= “true” // 是否应用fillBefore值,对fillAfter值无影响,默认为true
android:repeatMode= “restart” // 选择重复播放动画模式,restart代表正序重放,reverse代表倒序回放,默认为restart|
android:repeatCount = “0” // 重放次数(所以动画的播放次数=重放次数+1),为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影响动画的播放速度,下面会详细讲
// 以下参数是平移动画特有的属性
android:fromXDelta="0" // 视图在水平方向x 移动的起始值
android:toXDelta="500" // 视图在水平方向x 移动的结束值
android:fromYDelta="0" // 视图在竖直方向y 移动的起始值
android:toYDelta="500" // 视图在竖直方向y 移动的结束值
/>
- 步骤3:在Java代码中创建
Animation
对象并播放动画
MainActivity.java
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 步骤2:创建 动画对象 并传入设置的动画效果xml文件
mButton.startAnimation(translateAnimation);
// 步骤3:播放动画
- 效果图
设置方法2:在 Java 代码中设置
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation translateAnimation = new TranslateAnimation(0,500,0,500);
// 步骤2:创建平移动画的对象:平移动画对应的Animation子类为TranslateAnimation
// 参数分别是:
// 1. fromXDelta :视图在水平方向x 移动的起始值
// 2. toXDelta :视图在水平方向x 移动的结束值
// 3. fromYDelta :视图在竖直方向y 移动的起始值
// 4. toYDelta:视图在竖直方向y 移动的结束值
translateAnimation.setDuration(3000);
// 固定属性的设置都是在其属性前加“set”,如setDuration()
mButton.startAnimation(translateAnimation);
// 步骤3:播放动画
- 效果图
与第一种设置方式是一样的。
4.2 缩放动画(Scale)
设置方法1:在XML 代码中设置
- 步骤1:在
res/anim
的文件夹里创建动画效果.xml
文件
此处为
res/anim/view_animation.xml
- 步骤2:根据 不同动画效果的语法 设置 不同动画参数,从而实现动画效果。缩放动画效果设置具体如下:
view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用<scale/> 标签表示是缩放动画
<scale xmlns:android="http://schemas.android.com/apk/res/android"
// 以下参数是4种动画效果的公共属性,即都有的属性
android:duration="3000" // 动画持续时间(ms),必须设置,动画才有效果
android:startOffset ="1000" // 动画延迟开始时间(ms)
android:fillBefore = “true” // 动画播放完后,视图是否会停留在动画开始的状态,默认为true
android:fillAfter = “false” // 动画播放完后,视图是否会停留在动画结束的状态,优先于fillBefore值,默认为false
android:fillEnabled= “true” // 是否应用fillBefore值,对fillAfter值无影响,默认为true
android:repeatMode= “restart” // 选择重复播放动画模式,restart代表正序重放,reverse代表倒序回放,默认为restart|
android:repeatCount = “0” // 重放次数(所以动画的播放次数=重放次数+1),为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影响动画的播放速度,下面会详细讲
// 以下参数是缩放动画特有的属性
android:fromXScale="0.0"
// 动画在水平方向X的起始缩放倍数
// 0.0表示收缩到没有;1.0表示正常无伸缩
// 值小于1.0表示收缩;值大于1.0表示放大
android:toXScale="2" //动画在水平方向X的结束缩放倍数
android:fromYScale="0.0" //动画开始前在竖直方向Y的起始缩放倍数
android:toYScale="2" //动画在竖直方向Y的结束缩放倍数
android:pivotX="50%" // 缩放轴点的x坐标
android:pivotY="50%" // 缩放轴点的y坐标
// 轴点 = 视图缩放的中心点
// pivotX pivotY,可取值为数字,百分比,或者百分比p
// 设置为数字时(如50),轴点为View的左上角的原点在x方向和y方向加上50px的点。在Java代码里面设置这个参数的对应参数是Animation.ABSOLUTE。
// 设置为百分比时(如50%),轴点为View的左上角的原点在x方向加上自身宽度50%和y方向自身高度50%的点。在Java代码里面设置这个参数的对应参数是Animation.RELATIVE_TO_SELF。
// 设置为百分比p时(如50%p),轴点为View的左上角的原点在x方向加上父控件宽度50%和y方向父控件高度50%的点。在Java代码里面设置这个参数的对应参数是Animation.RELATIVE_TO_PARENT
// 两个50%表示动画从自身中间开始,具体如下图
/>
- 步骤3:在Java代码中创建
Animation
对象并播放动画
MainActivity.java
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 步骤2:创建 动画对象 并传入设置的动画效果xml文件
mButton.startAnimation(scaleAnimation);
// 步骤3:播放动画
效果图
下面展示轴点为(50%,50%) & 轴点为(20%,30%)的情况轴点为(50%,50%)
设置方法2:在 Java 代码中设置
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation rotateAnimation = new ScaleAnimation(0,2,0,2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// 步骤2:创建缩放动画的对象 & 设置动画效果:缩放动画对应的Animation子类为RotateAnimation
// 参数说明:
// 1. fromX :动画在水平方向X的结束缩放倍数
// 2. toX :动画在水平方向X的结束缩放倍数
// 3. fromY :动画开始前在竖直方向Y的起始缩放倍数
// 4. toY:动画在竖直方向Y的结束缩放倍数
// 5. pivotXType:缩放轴点的x坐标的模式
// 6. pivotXValue:缩放轴点x坐标的相对值
// 7. pivotYType:缩放轴点的y坐标的模式
// 8. pivotYValue:缩放轴点y坐标的相对值
// pivotXType = Animation.ABSOLUTE:缩放轴点的x坐标 = View左上角的原点 在x方向 加上 pivotXValue数值的点(y方向同理)
// pivotXType = Animation.RELATIVE_TO_SELF:缩放轴点的x坐标 = View左上角的原点 在x方向 加上 自身宽度乘上pivotXValue数值的值(y方向同理)
// pivotXType = Animation.RELATIVE_TO_PARENT:缩放轴点的x坐标 = View左上角的原点 在x方向 加上 父控件宽度乘上pivotXValue数值的值 (y方向同理)
scaleAnimation.setDuration(3000);
// 固定属性的设置都是在其属性前加“set”,如setDuration()
mButton.startAnimation(scaleAnimation);
// 步骤3:播放动画
- 效果图
与第一种设置方式是一样的。
4.3 旋转动画(Rotate)
设置方法1:在XML 代码中设置
- 步骤1:在路径
res/anim
的文件夹里创建动画效果.xml
文件
此处为
res/anim/view_animation.xml
- 步骤2:根据 不同动画效果的语法 设置 不同动画参数,从而实现动画效果。旋转动画效果设置具体如下:
view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用<rotate/> 标签表示是旋转动画
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
// 以下参数是4种动画效果的公共属性,即都有的属性
android:duration="3000" // 动画持续时间(ms),必须设置,动画才有效果
android:startOffset ="1000" // 动画延迟开始时间(ms)
android:fillBefore = “true” // 动画播放完后,视图是否会停留在动画开始的状态,默认为true
android:fillAfter = “false” // 动画播放完后,视图是否会停留在动画结束的状态,优先于fillBefore值,默认为false
android:fillEnabled= “true” // 是否应用fillBefore值,对fillAfter值无影响,默认为true
android:repeatMode= “restart” // 选择重复播放动画模式,restart代表正序重放,reverse代表倒序回放,默认为restart|
android:repeatCount = “0” // 重放次数(所以动画的播放次数=重放次数+1),为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影响动画的播放速度,下面会详细讲
// 以下参数是旋转动画特有的属性
android:duration="1000"
android:fromDegrees="0" // 动画开始时 视图的旋转角度(正数 = 顺时针,负数 = 逆时针)
android:toDegrees="270" // 动画结束时 视图的旋转角度(正数 = 顺时针,负数 = 逆时针)
android:pivotX="50%" // 旋转轴点的x坐标
android:pivotY="0" // 旋转轴点的y坐标
// 轴点 = 视图缩放的中心点
// pivotX pivotY,可取值为数字,百分比,或者百分比p
// 设置为数字时(如50),轴点为View的左上角的原点在x方向和y方向加上50px的点。在Java代码里面设置这个参数的对应参数是Animation.ABSOLUTE。
// 设置为百分比时(如50%),轴点为View的左上角的原点在x方向加上自身宽度50%和y方向自身高度50%的点。在Java代码里面设置这个参数的对应参数是Animation.RELATIVE_TO_SELF。
// 设置为百分比p时(如50%p),轴点为View的左上角的原点在x方向加上父控件宽度50%和y方向父控件高度50%的点。在Java代码里面设置这个参数的对应参数是Animation.RELATIVE_TO_PARENT
// 两个50%表示动画从自身中间开始,具体如下图
/>
- 步骤3:在Java代码中创建
Animation
对象并播放动画
MainActivity.java
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 步骤2:创建 动画对象 并传入设置的动画效果xml文件
mButton.startAnimation(scaleAnimation);
// 步骤3:播放动画
效果图
轴点为(50%,50%)
设置方法2:在 Java 代码中设置
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation rotateAnimation = new RotateAnimation(0,270,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// 步骤2:创建旋转动画的对象 & 设置动画效果:旋转动画对应的Animation子类为RotateAnimation
// 参数说明:
// 1. fromDegrees :动画开始时 视图的旋转角度(正数 = 顺时针,负数 = 逆时针)
// 2. toDegrees :动画结束时 视图的旋转角度(正数 = 顺时针,负数 = 逆时针)
// 3. pivotXType:旋转轴点的x坐标的模式
// 4. pivotXValue:旋转轴点x坐标的相对值
// 5. pivotYType:旋转轴点的y坐标的模式
// 6. pivotYValue:旋转轴点y坐标的相对值
// pivotXType = Animation.ABSOLUTE:旋转轴点的x坐标 = View左上角的原点 在x方向 加上 pivotXValue数值的点(y方向同理)
// pivotXType = Animation.RELATIVE_TO_SELF:旋转轴点的x坐标 = View左上角的原点 在x方向 加上 自身宽度乘上pivotXValue数值的值(y方向同理)
// pivotXType = Animation.RELATIVE_TO_PARENT:旋转轴点的x坐标 = View左上角的原点 在x方向 加上 父控件宽度乘上pivotXValue数值的值 (y方向同理)
rotateAnimation.setDuration(3000);
// 固定属性的设置都是在其属性前加“set”,如setDuration()
mButton.startAnimation(rotateAnimation);
// 步骤3:播放动画
- 效果图
与第一种设置方式是一样的。
4.4 透明度动画(Alpha)
设置方法1:在XML 代码中设置
- 步骤1:在路径
res/anim
的文件夹里创建动画效果.xml
文件
此处为
res/anim/view_animation.xml
- 步骤2:根据 不同动画效果的语法 设置 不同动画参数,从而实现动画效果。旋转动画效果设置具体如下:
view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用<alpha/> 标签表示是透明度动画
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
// 以下参数是4种动画效果的公共属性,即都有的属性
android:duration="3000" // 动画持续时间(ms),必须设置,动画才有效果
android:startOffset ="1000" // 动画延迟开始时间(ms)
android:fillBefore = “true” // 动画播放完后,视图是否会停留在动画开始的状态,默认为true
android:fillAfter = “false” // 动画播放完后,视图是否会停留在动画结束的状态,优先于fillBefore值,默认为false
android:fillEnabled= “true” // 是否应用fillBefore值,对fillAfter值无影响,默认为true
android:repeatMode= “restart” // 选择重复播放动画模式,restart代表正序重放,reverse代表倒序回放,默认为restart|
android:repeatCount = “0” // 重放次数(所以动画的播放次数=重放次数+1),为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影响动画的播放速度,下面会详细讲
// 以下参数是透明度动画特有的属性
android:fromAlpha="1.0" // 动画开始时视图的透明度(取值范围: -1 ~ 1)
android:toAlpha="0.0"// 动画结束时视图的透明度(取值范围: -1 ~ 1)
/>
- 步骤3:在Java代码中创建
Animation
对象并播放动画
MainActivity.java
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation alphaAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 步骤2:创建 动画对象 并传入设置的动画效果xml文件
mButton.startAnimation(alphaAnimation);
// 步骤3:播放动画
- 效果图
设置方法2:在 Java 代码中设置
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation alphaAnimation = new AlphaAnimation(1,0);
// 步骤2:创建透明度动画的对象 & 设置动画效果:透明度动画对应的Animation子类为AlphaAnimation
// 参数说明:
// 1. fromAlpha:动画开始时视图的透明度(取值范围: -1 ~ 1)
// 2. toAlpha:动画结束时视图的透明度(取值范围: -1 ~ 1)
alphaAnimation.setDuration(3000);
// 固定属性的设置都是在其属性前加“set”,如setDuration()
mButton.startAnimation(alphaAnimation);
// 步骤3:播放动画
- 效果图
与第一种设置方式是一样的。
4.5 组合动画
- 上面讲的都是单个动画效果;而实际中很多需求都需要同时使用平移、缩放、旋转 & 透明度4种动画,即组合动画
- 使用组合动画需要用到标签
< Set/>
Set
对于Animation
,就类似View
对于ViewGroup
- 组合动画同样有XML 代码 / Java 代码两种设置方法,下面会详细说明
4.5.1 在XML 代码中设置
- 步骤1:在路径
res/anim
的文件夹里创建动画效果.xml
文件
此处为
res/anim/view_animation.xml
- 步骤2:组合动画的设置方法 同 单个动画设置。具体如下:
view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用< Set/>标签
<set xmlns:android="http://schemas.android.com/apk/res/android">
// 组合动画同样具备公共属性
android:duration="3000" // 动画持续时间(ms),必须设置,动画才有效果
android:startOffset ="1000" // 动画延迟开始时间(ms)
android:fillBefore = “true” // 动画播放完后,视图是否会停留在动画开始的状态,默认为true
android:fillAfter = “false” // 动画播放完后,视图是否会停留在动画结束的状态,优先于fillBefore值,默认为false
android:fillEnabled= “true” // 是否应用fillBefore值,对fillAfter值无影响,默认为true
android:repeatMode= “restart” // 选择重复播放动画模式,restart代表正序重放,reverse代表倒序回放,默认为restart|
android:repeatCount = “0” // 重放次数(所以动画的播放次数=重放次数+1),为infinite时无限重复
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影响动画的播放速度,下面会详细讲
// 组合动画独特的属性
android:shareinterpolator = “true”
// 表示组合动画中的动画是否和集合共享同一个差值器
// 如果集合不指定插值器,那么子动画需要单独设置
// 组合动画播放时是全部动画同时开始
// 如果想不同动画不同时间开始就要使用android:startOffset属性来延迟单个动画播放时间
// 设置旋转动画,语法同单个动画
<rotate
android:duration="1000"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:repeatMode="restart"
android:repeatCount="infinite"
/>
// 设置平移动画,语法同单个动画
<translate
android:duration="10000"
android:startOffset = “1000”// 延迟该动画播放时间
android:fromXDelta="-50%p"
android:fromYDelta="0"
android:toXDelta="50%p"
android:toYDelta="0" />
// 设置透明度动画,语法同单个动画
<alpha
android:startOffset="7000"
android:duration="3000"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
// 设置缩放动画,语法同单个动画
<scale
android:startOffset="4000"
android:duration="1000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="0.5"
android:toYScale="0.5" />
// 特别注意:
// 1. 在组合动画里scale缩放动画设置的repeatCount(重复播放)和fillBefore(播放完后,视图是否会停留在动画开始的状态)是无效的。
// 2. 所以如果需要重复播放或者回到原位的话需要在set标签里设置
// 3. 但是由于此处rotate旋转动画里已设置repeatCount为infinite,所以动画不会结束,也就看不到重播和回复原位
</set>
- 步骤3:在Java代码中创建Animation对象并播放动画
MainActivity.java
Button mButton = (Button) findViewById(R.id.Button);
// 步骤1:创建 需要设置动画的 视图View
Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 步骤2:创建 动画对象 并传入设置的动画效果xml文件
mButton.startAnimation(translateAnimation);
// 步骤3:播放动画
- 效果图
4.5.2 在 Java 代码中设置
Button mButton = (Button) findViewById(R.id.Button);
// 创建 需要设置动画的 视图View
// 组合动画设置
AnimationSet setAnimation = new AnimationSet(true);
// 步骤1:创建组合动画对象(设置为true)
// 步骤2:设置组合动画的属性
// 特别说明以下情况
// 因为在下面的旋转动画设置了无限循环(RepeatCount = INFINITE)
// 所以动画不会结束,而是无限循环
// 所以组合动画的下面两行设置是无效的
setAnimation.setRepeatMode(Animation.RESTART);
setAnimation.setRepeatCount(1);// 设置了循环一次,但无效
// 步骤3:逐个创建子动画(方式同单个动画创建方式,此处不作过多描述)
// 子动画1:旋转动画
Animation rotate = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotate.setDuration(1000);
rotate.setRepeatMode(Animation.RESTART);
rotate.setRepeatCount(Animation.INFINITE);
// 子动画2:平移动画
Animation translate = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT,-0.5f,
TranslateAnimation.RELATIVE_TO_PARENT,0.5f,
TranslateAnimation.RELATIVE_TO_SELF,0
,TranslateAnimation.RELATIVE_TO_SELF,0);
translate.setDuration(10000);
// 子动画3:透明度动画
Animation alpha = new AlphaAnimation(1,0);
alpha.setDuration(3000);
alpha.setStartOffset(7000);
// 子动画4:缩放动画
Animation scale1 = new ScaleAnimation(1,0.5f,1,0.5f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
scale1.setDuration(1000);
scale1.setStartOffset(4000);
// 步骤4:将创建的子动画添加到组合动画里
setAnimation.addAnimation(alpha);
setAnimation.addAnimation(rotate);
setAnimation.addAnimation(translate);
setAnimation.addAnimation(scale1);
mButton.startAnimation(setAnimation);
// 步骤5:播放动画
- 效果图
与第一种设置方式是一样的。
5. 监听动画
Animation
类通过监听动画开始 / 结束 / 重复时刻来进行一系列操作,如跳转页面等等- 通过在
Java
代码里setAnimationListener()
方法设置
Animation.addListener(new AnimatorListener() {
@Override
public void onAnimationStart(Animation animation) {
//动画开始时执行
}
@Override
public void onAnimationRepeat(Animation animation) {
//动画重复时执行
}
@Override
public void onAnimationCancel()(Animation animation) {
//动画取消时执行
}
@Override
public void onAnimationEnd(Animation animation) {
//动画结束时执行
}
});
特别注意
若采取上述方法监听动画,每次监听都必须重写4个方法。
- 背景:有些时候我们并不需要监听动画的所有时刻
- 问题:但上述方式是必须需要重写4个时刻的方法,这显示太累赘
- 解决方案:采用动画适配器
AnimatorListenerAdapter
,解决
实现接口繁琐 的问题 - 具体如下:
anim.addListener(new AnimatorListenerAdapter() {
// 向addListener()方法中传入适配器对象AnimatorListenerAdapter()
// 由于AnimatorListenerAdapter中已经实现好每个接口
// 所以这里不实现全部方法也不会报错
@Override
public void onAnimationStart(Animator animation) {
// 如想只想监听动画开始时刻,就只需要单独重写该方法就可以
}
});
6. 插值器 & 估值器
具体请看文章Android 动画:你真的会使用插值器与估值器吗?(含详细实例教学)
7. 应用场景
7.1 标准的动画效果
- 补间动画常用于视图View的一些标准动画效果:平移、旋转、缩放 & 透明度;
- 除了常规的动画使用,补间动画还有一些特殊的应用场景。
7.2 特殊的应用场景
Activity
的切换效果Fragement
的切换效果- 视图组(
ViewGroup
)中子元素的出场效果
7.2.1 Activity 的切换效果
即 Activity
启动 / 退出时的动画效果。
a.启动动画
Intent intent = new Intent (this,Acvtivity.class);
startActivity(intent);
overridePendingTransition(R.anim.enter_anim,R.anim.exit_anim);
// 采用overridePendingTransition(int enterAnim, int exitAnim)进行设置
// enterAnim:从Activity a跳转到Activity b,进入b时的动画效果资源ID
// exitAnim:从Activity a跳转到Activity b,离开a时的动画效果资源Id
// 特别注意
// overridePendingTransition()必须要在startActivity(intent)后被调用才能生效
b.退出动画
@Override
public void finish(){
super.finish();
overridePendingTransition(R.anim.enter_anim,R.anim.exit_anim);
// 采用overridePendingTransition(int enterAnim, int exitAnim)进行设置
// enterAnim:从Activity a跳转到Activity b,进入b时的动画效果资源ID
// exitAnim:从Activity a跳转到Activity b,离开a时的动画效果资源Id
// 特别注意
// overridePendingTransition()必须要在finish()后被调用才能生效
}
对于参数 enterAnim
& exitAnim
的资源ID,系统有自带的效果android.R.anim.xxx
,如下设置:
Intent intent = new Intent(MainActivity.this, SecActivity.class);
startActivity(intent);
// 淡入淡出的动画效果
overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out);
// 从左向右滑动的效果
overridePendingTransition(android.R.anim.slide_in_left, android.R.anim.slide_out_right);
除了使用系统自带的切换效果,还可以自定义Activity
的切换效果:
此处就用到补间动画了
a. 自定义 淡入淡出 效果
淡入淡出 效果是采用透明度动画(Alpha
)。
fade_in.xml(淡入)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<alpha
android:duration="1500"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
fade_out.xml(淡出)
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<alpha
android:duration="1500"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
</set>
在Java代码中设置
Intent intent = new Intent(MainActivity.this, SecActivity.class);
startActivity(intent);
// 自定义的淡入淡出动画效果
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
b. 自定义 左右滑动 效果
- 左右滑动 效果是采用平移动画(
Translate
) - 先了解
Activity
的位置信息,如下图
从上图可以看出:
- 以屏幕底边为X轴,屏幕左边为Y轴;
- 当Activity在X轴 = -100%p时,刚好完全超出屏幕到左边(位置1)
- 当Activity在X轴 = 0%p时,刚好完全在屏幕内(位置2)
- 当Activity在X轴 = 100%p时,刚好完全超出屏幕到右边(位置3)
下面自定义一个动画效果:从右滑到左
out_to_left.xml
从中间滑到左边,即从位置2 - 位置1
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
>
<translate
android:duration="500"
android:fromXDelta="0%p"
android:toXDelta="-100%p"
/>
</set>
in_from_right.xml
从右边滑到中间,即从位置3 - 位置2
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
>
<translate
android:duration="500"
android:fromXDelta="100%p"
android:toXDelta="0%p"
/>
</set>
在Java代码中设置效果
Intent intent = new Intent(MainActivity.this, SecActivity.class);
startActivity(intent)
// 自定义 从右向左滑动的效果
overridePendingTransition(R.anim.in_from_right, R.anim.out_to_left);
效果图
- 关于 缩放和旋转动画 作为Activity的动画效果也是类似的
- 通过 想象力 能组合 上述4种基本动画 进行动画效果展示
即这种切换效果还能使用补间动画的组合动画
- 此处仅列出较为简单的切换效果,如想实现更多酷炫的切换动画,请看文章
7.2.2 Fragment动画切换效果
系统自带的动画切换效果
FragmentTransaction fragmentTransaction = mFragmentManager
.beginTransaction();
fragmentTransaction.setTransition(int transit);
// 通过setTransition(int transit)进行设置
// transit参数说明
// 1. FragmentTransaction.TRANSIT_NONE:无动画
// 2. FragmentTransaction.TRANSIT_FRAGMENT_OPEN:标准的打开动画效果
// 3. FragmentTransaction.TRANSIT_FRAGMENT_CLOSE:标准的关闭动画效果
// 标准动画设置好后,在Fragment添加和移除的时候都会有。
自定义动画效果
// 采用`FragmentTransavtion`的 `setCustomAnimations()`进行设置
FragmentTransaction fragmentTransaction = mFragmentManager
.beginTransaction();
fragmentTransaction.setCustomAnimations(
R.anim.in_from_right,
R.anim.out_to_left);
// 此处的自定义动画效果同Activity,此处不再过多描述
7.2.3 视图组(ViewGroup)中子元素的出场效果
- 视图组(
ViewGroup
)中子元素可以具备出场时的补间动画效果 - 常用需求场景:为
ListView
的item
设置出场动画 - 使用步骤:
步骤1:设置子元素的出场动画
res/anim/view_animation.xml
<?xml version="1.0" encoding="utf-8"?>
// 此处采用了组合动画
<set xmlns:android="http://schemas.android.com/apk/res/android" >
android:duration="3000"
<alpha
android:duration="1500"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
<translate
android:fromXDelta="500"
android:toXDelta="0"
/>
</set>
步骤2:设置 视图组(ViewGroup
)的动画文件
res/ anim /anim_layout.xml
<?xml version="1.0" encoding="utf-8"?>
// 采用LayoutAnimation标签
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
android:delay="0.5"
// 子元素开始动画的时间延迟
// 如子元素入场动画的时间总长设置为300ms
// 那么 delay = "0.5" 表示每个子元素都会延迟150ms才会播放动画效果
// 第一个子元素延迟150ms播放入场效果;第二个延迟300ms,以此类推
android:animationOrder="normal"
// 表示子元素动画的顺序
// 可设置属性为:
// 1. normal :顺序显示,即排在前面的子元素先播放入场动画
// 2. reverse:倒序显示,即排在后面的子元素先播放入场动画
// 3. random:随机播放入场动画
android:animation="@anim/view_animation"
// 设置入场的具体动画效果
// 将步骤1的子元素出场动画设置到这里
/>
步骤3:为视图组(ViewGroup
)指定andorid:layoutAnimation
属性
指定的方式有两种: XML / Java代码设置
方式1:在 XML
中指定
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical" >
<ListView
android:id="@+id/listView1"
android:layoutAnimation="@anim/anim_layout"
// 指定layoutAnimation属性用以指定子元素的入场动画
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
方式2:在Java代码中指定
这样就不用额外设置res/ anim /anim_layout.xml该xml文件了
ListView lv = (ListView) findViewById(R.id.listView1);
Animation animation = AnimationUtils.loadAnimation(this,R.anim.anim_item);
// 加载子元素的出场动画
LayoutAnimationController controller = new LayoutAnimationController(animation);
controller.setDelay(0.5f);
controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
// 设置LayoutAnimation的属性
lv.setLayoutAnimation(controller);
// 为ListView设置LayoutAnimation的属性
上述二者的效果是一样的。
实例效果
至此,Android
动画中的补间动画
的所有知识点都讲解完毕。
作者:Carson_Ho
链接:https://www.jianshu.com/p/733532041f46
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
View动画(补间动画)的更多相关文章
- android 帧动画,补间动画,属性动画的简单总结
帧动画——FrameAnimation 将一系列图片有序播放,形成动画的效果.其本质是一个Drawable,是一系列图片的集合,本身可以当做一个图片一样使用 在Drawable文件夹下,创建ani ...
- 属性动画 补间动画 帧动画 基本使用案例 MD
Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...
- Android笔记(六十四) android中的动画——补间动画(tweened animation)
补间动画就是只需要定义动画开始和结束的位置,动画中间的变化由系统去补齐. 补间动画由一下四种方式: 1.AplhaAnimation——透明度动画效果 2.ScaleAnimation ——缩放动画效 ...
- Android 动画 属性动画 视图动画 补间动画 帧动画 详解 使用
Android动画 Property Animation res/animator/filename.xml In Java: R.animator.filename In XML: @[packag ...
- android104 帧动画,补间动画,属性动画
##帧动画FrameAnimation* 多张图片快速切换,形成动画效果* 帧动画使用xml定义 package com.itheima.frameanimation; import android. ...
- TimePicker控件、帧动画、补间动画
1.TimePicker控件 最近感觉每个开发平台的控件基本都差不多,在Android中控件的事件和.net控件直接写事件有一定的区别,net事件可以直接界面进行事件的绑定哈.不过在Silverlig ...
- Android基础笔记(十)- 帧动画、补间动画具体解释、对话框
帧动画 补间动画Tween Animation 对话框以及面试中的注意点 帧动画 帧动画非常easy,我们首先看一下Google官方解释This is a traditional animation ...
- Android开发实战之补间动画和属性动画
说起动画,其实一点也不陌生,在使用一款app的时候为了优化用户体验,多多少少的,都会加入动画. 安卓中的动画,分为两大类:补间动画和属性动画.本篇博文会详细介绍总结这两大动画,希望本篇博文对你的学习和 ...
- Android中的帧动画与补间动画的使用
前言 在日常开发中,我们有时候须要一些好看的动画效果,这时能够充分利用Android提供的这几种动画来实现. Android提供了3种类型的动画: 补间动画:补间动画能够应用于View,让你能够定义一 ...
- Android动画主要包含补间动画(Tween)View Animation、帧动画(Frame)Drawable Animation、以及属性动画Property Animation
程序运行效果图: Android动画主要包含补间动画(Tween)View Animation.帧动画(Frame)Drawable Animation.以及属性动画Property Animatio ...
随机推荐
- maven install deploy tell us heap is full
<plugin> <groupId>org.apache.maven.plugins</groupId> <artifactId>maven-compi ...
- 在kubernetes中运行单节点有状态MySQL应用
Deploy MySQL https://kubernetes.io/docs/tasks/run-application/run-single-instance-stateful-applicati ...
- js(=>) 箭头函数 详细解说 案例大全
ES6标准新增了一种新的函数:Arrow Function(箭头函数). 为什么叫Arrow Function?因为它的定义用的就是一个箭头: x => x * x 上面的箭头函数相当于: fu ...
- Windows安装nginx服务
1.测试版本 nginx版本:nginx-1.10.2:windows版本:win10 2.下载winsw. 当前最新版本为:winsw-2.0.1-bin.exe.下载地址:http://repo. ...
- vue基础篇---路由的实现
路由可以有两种实现方式,一种是标签形式的,一种是js实现. 标签: <router-link to='/city'> 北京 </router-link> 标签还有另外一种实现方 ...
- .NET MVC中的ActionResult
一 摘要 本文介绍了ASP.NET MVC中的ActionResult,本节主要介绍 EmptyResult / Content Result /JavaScriptResult /JsonResu ...
- Ant基础知识1
1.Ant简介 Apache Ant是一个将软件编译/测试/部署等步骤联系在一起加以优化的一个构建工具,常用于java环境中的软件开发.Ant的默认配置文件是build.xml. 对java语言的支持 ...
- delimiter 与 存储过程
1.如此执行语句不行,需要在 delimiter IF not EXISTS ( SELECT * FROM information_schema. COLUMNS WHERE table_schem ...
- linux 网络之 bond 网卡模式
Linux bond模式通过多个网卡绑定技术既能增加服务器的可靠性,又增加了可用网络宽带,为用户提供不间断的网络服务: 七种bond模式: 第一种模式:mod=0 ,即:(balance-rr) Ro ...
- luogu P2113 看球泡妹子
2333 这么水的蓝题 f[i][j] 表示看了i场比赛,小♀红的什么东西为j时小♂明的什么值 强行压维蛤蛤 剩下的转移很简单(注意i的循环顺序从后往前,01背包) (具体见代码) #include& ...