帧动画:
- 静态实现(通过xml资源文件)
<1. res/drawable在该文件夹中创建动画的xml资源文件
<2. <animation-list> 根节点 <item> 每一帧的节点
item节点中的两个属性:
duration:设置一次播放的时间
drawable:设置每一帧的图片资源
<3.把这个资源文件设置成控件的背景
<4.通过控件的getBackground() 的方法得到 AnimationDrawable的对象
<5.通过AnimationDrawable的对象调用start()的方法启动动画
停止动画调用shop()方法
<6.通过AnimationDrawable的对象可以设置动画播放的属性,例如:循环播放
2.动态实现(使用代码实现)
<1. 创建一个AnimationDrawable的对象,通过new 的方式
<2. 使用循环的方式把每一帧的图片添加到AnimationDrawable的对象中
<3.通过AnimationDrawable的对象调用start()的方法启动动画
停止动画调用shop()方法.
<4.通过AnimationDrawable的对象可以设置动画播放的属性,例如:循环播放
注意:先给控件设置动画资源,然后在调用start()方法。
代码:
res/drawable/frame.xml 里面代码:
<animation-list
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="@mipmap/a2" android:duration="100"/>
<item
android:drawable="@mipmap/a3" android:duration="100"/>
<item
android:drawable="@mipmap/a4" android:duration="100"/>
<item
android:drawable="@mipmap/a5" android:duration="100"/>
<item
android:drawable="@mipmap/a6" android:duration="100"/>
<item
android:drawable="@mipmap/a7" android:duration="100"/>
<item
android:drawable="@mipmap/a8" android:duration="100"/>
重新建一个activity:
布局里:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.coderqi.android2lesson_16_animation.FrameAnimActivity">
<ImageView
android:id="@+id/frame_iv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<!-- android:background="@drawable/frame"-->
</RelativeLayout>
activity里:
package com.coderqi.android2lesson_16_animation;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.widget.ImageView;
public class FrameAnimActivity extends AppCompatActivity {
private ImageView iv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_frame_anim);
iv= (ImageView) findViewById(R.id.frame_iv);
//静态方法实现动画
// startFrameAnim();
//动态方法实现动画
startFrameAnim1();
}
//开始帧动画
//静态实现动画:
private void startFrameAnim(){
//把imageview控件的背景资源获取出来,转换成AnimationDrawable类型
AnimationDrawable drawable = (AnimationDrawable) iv.getBackground();
//让动画资源开始的方法
drawable.start();
}
//动态的方法实现动画
private void startFrameAnim1(){
AnimationDrawable animation = new AnimationDrawable();
//通过resources 方法把 a2 ----a20的18张图片加载到动画对象中
for(int i=2; i<20; i++){
//参数1:图片名 参数2:图片所在的文件夹 参数3:当前的包名
int id = getResources().getIdentifier("a" +i, "mipmap",getPackageName());
//根据图片ID 把图片转化成Drawable对象
Drawable frame = getResources().getDrawable(id);
//把当前的图片添加到AnimationDrawble对象中,并设置图片显示时间
animation.addFrame(frame,100);
}
//设置播放模式是否循环播放,
animation.setOneShot(false);
//设置本类将要显示这个动画
// iv.setBackgroundDrawable(animation);
iv.setImageDrawable(animation);
//启动动画
animation.start();
}
}
补间动画:(tween)
确定初始和终止位置,然后中间的过程为补间动画的动画效果。
补间动画有四种:
<1.TranslateAnimation(平移动画)
<2.ScaleAnimation(放缩动画)
<3.RotateAnimation(旋转动画)
<4.AlphaAnimation(透明度动画)
1:静态实现:
》res/anim在该文件中创建xml资源文件
》创建对应的动画效果的节点。例如:
<rotate/>旋转动画的节点,同时设置该动画的属性:开始的位置, 结束的位置,一次播放的时间(duration), 播放的次数(repeatCount),播放的模式(repeatMode) ,动画完成后的状态(fillAfter)。
》使用对应的动画类,通过AnimationUntils.loadAnimation(context,资源文件)
》通过动画类对象调用start() 播放动画
》把该动画类的对象绑定在控件上。
2:动态实现
》创建对应的动画类,使用new的方式。通过构造方法,把该动画的初始位置和终止位置确定出来。
》通过动画类的对象,设置该动画的属性,如:一次播放的时间(duration), 播放的次数(repeatCount),播放的模式(repeatMode) ,动画完成后的状态(fillAfter)。
》调用start()启动动画
》把该动画类的对象绑定在控件上。
注意:补间动画要先启动动画,在进行绑定。
帧动画是控制控件里的图片,,而补间动画是控制控件的
组合补间动画
》通过xml资源文件把多个动画节点放在节点中
》在动画的节点中,只设置动画的开始终止位置和重复字 数,重复模式和播放时间等属性在set节点中设置
》使用Animation类的对象来加载组合补间动画
》之后操作同静态补间动画使用
代码:
在res/anim/translate.xml 里面代码:
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0"
android:toXDelta="200%"
android:fromYDelta="0"
android:toYDelta="0"
android:duration = "2000"
android:repeatCount="8"
android:repeatMode= "reverse"
android:fillAfter="false"
/>
<!-- 动画资源文件中 设置xy放向上的距离时
可以设置像素值, 也可以设置百分比 -->
组合补间动画的 res/anim/rotate_translate.xml
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="2000"
android:fillAfter="true"
android:repeatMode="restart"
>
<rotate
android:repeatCount="2"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotY="50%"
android:pivotX="50%"/>
<translate
android:repeatCount="2"
android:fromXDelta="0"
android:toXDelta="200%"/>
</set>
创建一个activity (对应的有个布局文件)
package com.coderqi.android2lesson_16_animation;
import android.media.Image;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
public class TweenAnimActivity extends AppCompatActivity {
ImageView iv1 ,iv2,iv3,iv4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tween_anim);
iv1 = (ImageView) findViewById(R.id.tween_iv1);
iv2 = (ImageView) findViewById(R.id.tween_iv2);
iv3 = (ImageView) findViewById(R.id.tween_iv3);
iv4 = (ImageView) findViewById(R.id.tween_iv4);
//让iv1 平移
startTweenTran(iv1);
startTweenTran1(iv2);
startRotateAnim(iv3);
startAnim(iv4);
}
/**
* 使用 xml的方式
* 开始一个平移动画
* 和帧动画的区别:帧动画要先绑定控件,在start() , 补间动画要先启动,在绑定。
*/
private void startTweenTran(ImageView iv){
//1 通过引入xml文件的方式加载一个动画
TranslateAnimation animation = (TranslateAnimation) AnimationUtils.loadAnimation(this,R.anim.translate);
//让动画启动
animation.start();
//把平移动画和iv对象进行绑定
iv.setAnimation(animation);
}
/**
* 通过动态实现平移动画
*
*
*/
private void startTweenTran1(ImageView iv){
// fromXType : x坐标起始位置的类型(1 相对自己 2 相对父布局 3 绝对位置)
// fromXValue:x坐标起始位置值
//下面以此类推
TranslateAnimation animation = new TranslateAnimation(
Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_SELF, 2f,
Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_SELF, 2f);
//设置动画重复的次数
animation.setRepeatCount(10);
//设置动画 单次实行的时间
animation.setDuration(2000);
//设置动画 执行的模式(Animation.REVERSE 往返; Animation.RESTART重复)
animation.setRepeatMode(Animation.RESTART);
//开始动画
animation.start();
//让 iv控件实现动画效果
iv.setAnimation(animation);
}
/**
*使用资源文件的方式,实现旋转动画,并启动
* @param iv
*/
private void startRotateAnim(ImageView iv){
//把旋转动画的资源文件,转换成旋转动画对象
RotateAnimation animation = (RotateAnimation) AnimationUtils.loadAnimation(this,R.anim.rotate);
animation.start();
iv.setAnimation(animation);
}
/**
* 使用资源文件的方式实现,旋转和平移组合动画, 并启动
* @param iv
*/
private void startAnim(ImageView iv){
Animation animation= AnimationUtils.loadAnimation(this,R.anim.rotate_translate);
animation.start();
iv.setAnimation(animation);
}
/**
* 响应手机上的按键按下时的方法
* @param keyCode
* @param event
* @return
*/
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
//判断当前点击的按钮为返回键
//既然自己判断了返回键的监听事件
if (keyCode==KeyEvent.KEYCODE_BACK){
finish();
overridePendingTransition(R.anim.tran_back_in,R.anim.tran_back_out);
}
return super.onKeyDown(keyCode, event);
}
}
布局文件:
<?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"
tools:context="com.coderqi.android2lesson_16_animation.TweenAnimActivity"
android:orientation="vertical"
android:gravity="center">
<!-- -->
<ImageView
android:id="@+id/tween_iv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"/>
<ImageView
android:id="@+id/tween_iv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"/>
<ImageView
android:id="@+id/tween_iv3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"/>
<ImageView
android:id="@+id/tween_iv4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@mipmap/ic_launcher"/>
</LinearLayout>
补间动画的应用
activity跳转添加动画效果。
overridePendingTransition(“进入动画”,”退出动画”);
写在startActivity和finish这两个方法的下面。
onKeyDown()监听手机按键方法
KeyCode参数可以判断当前按下的是什么按键 (代码在上面)
代码:
tran_in.xml:
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="100%"
android:toXDelta="0"
android:duration="500"/>
tran_out.xml:
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromXDelta="0"
android:toXDelta="-100%"
android:duration="500"/>
View.OnClickListener listener = new View.OnClickListener(){
@Override
public void onClick(View view) {
// Toast.makeText(MainActivity.this,"实名内部类",Toast.LENGTH_SHORT).show();
Intent intent =new Intent(MainActivity.this,TweenAnimActivity.class);
startActivity(intent);
//添加activity 跳转时的动画效果
overridePendingTransition(R.anim.tran_in,R.anim.tran_out);