Animation动画

来源:互联网 发布:js跳转页面 开新窗口 编辑:程序博客网 时间:2024/06/05 04:16

效果图:
这里写图片描述

  • 帧动画(Frame Animation)

    1. 首先将帧动画放到res/drawable目录下

    2. 然后在drawable目录下新建帧动画XML文件,使用< animation-list >标签
      这里写图片描述

      frame.xml

      <?xml version="1.0" encoding="utf-8"?><animation-list xmlns:android="http://schemas.android.com/apk/res/android"android:oneshot="false"><itemandroid:drawable="@drawable/load1"android:duration="130" /><itemandroid:drawable="@drawable/load2"android:duration="130" /><itemandroid:drawable="@drawable/load3"android:duration="130" /><itemandroid:drawable="@drawable/load4"android:duration="130" /><itemandroid:drawable="@drawable/load5"android:duration="130" /></animation-list>

      播放帧动画

      //获取AnimationDrawable实例,用来控制动画的播放与停止AnimationDrawable anim = (AnimationDrawable)imageView.getBackground();anim.start();
  • 补间动画(Tween Animation)

    补间动画包括:透明度,缩放,平稳,旋转动画,都可以使用XML文件或者代码的方式实现所需动画的效果,这里演示使用代码的方法。

布局文件

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:layout_margin="50dp"    tools:context="com.tlkg.welcome.animationdemo.MainActivity">    <ImageView        android:id="@+id/alpha_img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:src="@mipmap/ic_launcher" />    <ImageView        android:id="@+id/scale_img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentRight="true"        android:src="@mipmap/ic_launcher" />    <ImageView        android:id="@+id/frame_img"        android:layout_width="90dp"        android:layout_height="90dp"        android:layout_centerInParent="true"        android:background="@drawable/frame" />    <ImageView        android:id="@+id/tran_img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:src="@mipmap/ic_launcher" />    <ImageView        android:id="@+id/rotate_img"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentBottom="true"        android:layout_alignParentRight="true"        android:src="@mipmap/ic_launcher" /></RelativeLayout>

MainActivity代码

public class MainActivity extends AppCompatActivity {    private ImageView alphaImg, scaleImg, tranImg, rotateImg, frameImg;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        frameImg = (ImageView) findViewById(R.id.frame_img);        AnimationDrawable animDrawable = (AnimationDrawable) frameImg.getBackground();        animDrawable.start();        alphaImg = (ImageView) findViewById(R.id.alpha_img);        scaleImg = (ImageView) findViewById(R.id.scale_img);        tranImg = (ImageView) findViewById(R.id.tran_img);        rotateImg = (ImageView) findViewById(R.id.rotate_img);        alpha();        scale();        tran();        rotate();    }    /**     * 透明度动画     */    private void alpha() {        AlphaAnimation animation = new AlphaAnimation(0, 1);//透明度从0到1        animation.setDuration(500);//设置动画时长        animation.setRepeatMode(Animation.REVERSE);//动画模式        animation.setRepeatCount(Animation.INFINITE);//动画重复次数        alphaImg.setAnimation(animation);//给控件设置动画        animation.start();//开始动画    }    /**     * 缩放动画     */    private void scale() {        ScaleAnimation animation = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f,                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);        animation.setDuration(500);        animation.setRepeatMode(Animation.REVERSE);        animation.setRepeatCount(Animation.INFINITE);        scaleImg.setAnimation(animation);        animation.start();    }    /**     * 平移动画     */    private void tran() {        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.setDuration(500);        animation.setRepeatMode(Animation.REVERSE);        animation.setRepeatCount(Animation.INFINITE);        tranImg.setAnimation(animation);        animation.start();    }    /**     * 旋转动画     */    private void rotate() {        RotateAnimation animation = new RotateAnimation(0, 360,                Animation.RELATIVE_TO_SELF, 0.5f,                Animation.RELATIVE_TO_SELF, 0.5f);        animation.setDuration(500);        animation.setRepeatMode(Animation.REVERSE);        animation.setRepeatCount(Animation.INFINITE);        rotateImg.setAnimation(animation);        animation.start();    }    @Override    protected void onDestroy() {        super.onDestroy();        alphaImg.clearAnimation();        scaleImg.clearAnimation();        frameImg.clearAnimation();        tranImg.clearAnimation();        rotateImg.clearAnimation();    }}

AlphaAnimation
AlphaAnimation的构造函数只有两个参数,分别是初始的透明度和结束的透明度

    public AlphaAnimation(float fromAlpha, float toAlpha) {        mFromAlpha = fromAlpha;        mToAlpha = toAlpha;    }

ScaleAnimation
ScaleAnimation的构造函数有三个常用的:

  public ScaleAnimation(float fromX, float toX, float fromY, float toY); public ScaleAnimation(float fromX, float toX, float fromY, float toY,            float pivotX, float pivotY);    public ScaleAnimation(float fromX, float toX, float fromY, float toY,            int pivotXType, float pivotXValue, int pivotYType, float pivotYValue);

参数说明 :


fromX: 动画开始时的X坐标的伸缩尺寸
toX: 动画结束时的X坐标的伸缩尺寸
fromY: 动画开始时的Y坐标的伸缩尺寸
toY: 动画结束时的Y坐标的伸缩尺寸
pivotX/pivotXValue:动画的中心点X坐标
pivotY/pivotYValue:动画的中心点Y坐标
pivotXType:动画在X轴的伸缩模式
pivotYType:动画在Y轴的伸缩模式
注:伸缩模式取值为Animation.ABSOLUTE、Animation.RELATIVE_TO_SELF、Animation.RELATIVE_TO_PARENT


TranslateAnimation
TranslateAnimation构造函数如下 :

    public TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta); public TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue,            int fromYType, float fromYValue, int toYType, float toYValue);

参数说明


fromXType:动画在X轴上的位移模式,取值与伸缩模式中的值相同
fromXValue/fromXDelta:动画开始时当前的X坐标
toXType:动画结束时在X轴的位移模式
toXValue/toXDelta:动画结束时的X坐标
fromYType:动画开始时在Y轴的位移模式
fromYValue/fromYDelta:动画开始时当前的Y坐标
toYType:动画结束时在Y轴的位移模式
toYValue/toYDelta:动画结束时的Y坐标


RotateAnimation
RototeAnimation构造函数如下:

 public RotateAnimation(float fromDegrees, float toDegrees);public RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY);    public RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue,            int pivotYType, float pivotYValue);

参数说明


fromDegrees:动画开始的旋转角度
toDegrees:动画结束的旋转角度
pivotXType:动画的X轴的旋转模式
pivotXValue:动画X轴的开始位置
prvotYType:动画的Y轴的旋转模式
pivotYValue:动画Y轴的开始位置


原创粉丝点击