android 开发补帧安卓补帧软件

转载

墨韵流香 2024-02-09 10:20:36

文章标签 android 开发补帧 android android studio xml 帧动画 文章分类 Android 移动开发

帧动画

帧动画概念

帧动画的使用

xml实现帧动画

Java实现帧动画

补间动画

概述

xml文件实现补间动画

透明度动画

缩放动画

位移动画

旋转动画

组合动画

用Java实现补间动画

透明度动画

缩放动画

位移动画

旋转动画

组合动画

帧动画

帧动画概念

在Android中，帧动画的本质是把一组预先准备好的图片循环切换播放，造成一种动画效果。

帧动画的使用

在安卓中帧动画的实现有两种方式：xml文件和Java去实现

xml实现帧动画

1.首先将所需要用到的图片导入到drawable文件中

android 开发补帧安卓补帧软件_android 开发补帧

2.创建xml文件

在drawable下创建一个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/explosion_2"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_3"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_4"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_5"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_6"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_7"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_8"
        android:duration="200">
    </item>
    <item android:drawable="@drawable/explosion_9"
        android:duration="200">
    </item>

</animation-list>

3.设置布局文件和Activity

给界面设置两个按钮和一个图片控件。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="开始"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="100dp"
        android:text="暂停"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:background="@drawable/animation_baozha"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button2"
        app:layout_constraintVertical_bias="0.54" />
</androidx.constraintlayout.widget.ConstraintLayout>

package com.c201801080119.day_5;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {
    Button mButtonStart;
    Button mButtonStop;
    ImageView mImageViewShow;
    AnimationDrawable mAnimationDrawable;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mButtonStart=findViewById(R.id.button);
        mButtonStop=findViewById(R.id.button2);
        mImageViewShow=findViewById(R.id.imageView);
        //加载动画对象
        mAnimationDrawable= (AnimationDrawable) mImageViewShow.getBackground();
        mButtonStart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                开始动画
                mAnimationDrawable.start();
            }
        });
        mButtonStop.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                暂停动画
                mAnimationDrawable.stop();
            }
        });
    }
}

Java实现帧动画

package com.c201801080119.day_5;

import androidx.appcompat.app.AppCompatActivity;

import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {
    Button mButtonStart;
    Button mButtonStop;
    ImageView mImageViewShow;
    AnimationDrawable mAnimationDrawable;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mButtonStart=findViewById(R.id.button);
        mButtonStop=findViewById(R.id.button2);
        mImageViewShow=findViewById(R.id.imageView);
//        //加载动画对象
//        mAnimationDrawable= (AnimationDrawable) mImageViewShow.getBackground();
        mAnimationDrawable=new AnimationDrawable();
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_2),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_3),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_4),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_5),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_6),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_7),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_8),200);
        mAnimationDrawable.addFrame(getResources().getDrawable(R.drawable.explosion_9),200);
        mAnimationDrawable.setOneShot(false);
        mImageViewShow.setBackground(mAnimationDrawable);
        mButtonStart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                开始动画
                mAnimationDrawable.start();
            }
        });
        mButtonStop.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                暂停动画
                mAnimationDrawable.stop();
            }
        });
    }
}

补间动画

概述

在Android动画中，补间动画一共可以分成四类即透明度动画、缩放动画、旋转动画、位移动画。
其实现方法可以通过xml来配置，也可以通过代码来实现。

xml文件实现补间动画

用xml实现补间动画，需要将xml放到res下的anim目录，Android工程默认是没有anim文件夹的，首先在res下创建anim目录，然后构建xml文件

透明度动画

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1"//起始透明度
    android:toAlpha="0.1"//结束透明度
    android:duration="2000"//持续时间>
</alpha>

缩放动画

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.2"//沿X的缩放的起始比例
    android:toXScale="1.5"//沿X缩放的结束比例
    android:fromYScale="0.2"//沿Y缩放的开始比例
    android:toYScale="1.5"//沿Y缩放的结束比例
    android:pivotY="50%"//缩放中轴点的x坐标
    android:pivotX="50%"//缩放中轴点y的坐标
    android:duration="2000"//持续时间>
</scale>

位移动画

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"//起始点x的坐标
    android:toXDelta="320"//结束点x的坐标
    android:fromYDelta="0"//起始点y的坐标
    android:toYDelta="0"//结束点y的坐标
    android:duration="2000"//持续时间>
</translate>

旋转动画

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"//旋转的起始角度
    android:toDegrees="360"//旋转的结束角度
    android:repeatCount="1"//旋转次数
    android:repeatMode="reverse"//设置重复模式，默认restart，但只有当repeatCount大于0或者infinite或-1时 才有效。还可以设置成reverse，表示偶数次显示动画时会做方向相反的运动
    android:duration="1000"//持续时间>

</rotate>

组合动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale android:pivotX="50%"
    android:pivotY="50%"
    android:fromYScale="0.2"
    android:fromXScale="0.2"
    android:toYScale="1.5"
    android:toXScale="1.5"
    android:duration="2000">
</scale>
    <translate android:fromYDelta="0"
        android:fromXDelta="0"
        android:toYDelta="0"
        android:toXDelta="320"
        android:duration="2000">
    </translate>
    <rotate android:fromDegrees="0"
        android:toDegrees="360"
        android:repeatCount="1"
        android:repeatMode="reverse"
        android:duration="1000">
    </rotate>
    <alpha android:fromAlpha="1"
        android:toAlpha="0.1">
    </alpha>
</set>

在Activity中的调用

Animation animation= AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_alpha);
                imageView.startAnimation(animation);

用Java实现补间动画

用Java代码去实现主要是实现补间动画的一些构造方法。

透明度动画

/* 
        //fromAlpha   动画开始的透明度，从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
        //toAlpha       动画结束时的透明度，也是从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
        public AlphaAnimation(float fromAlpha, float toAlpha) {
        }
*/
                Animation animation=new AlphaAnimation(0,1);
                animation.setDuration(2000);
                imageView.startAnimation(animation);

缩放动画

/**
                public ScaleAnimation(float fromX, float toX, float fromY, float toY,
                int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) {
                }
                fromX	沿着X轴缩放的起始比例
                fromY	沿着X轴缩放的起始比例
                toX	沿着X轴缩放的结束比例
                toY	沿着Y轴缩放的结束比例
                pivotXValue	缩放的中轴点X坐标，即距离自身左边缘的位置，比如50%就是以图像的 中心为中轴点
                pivotXType	有2种模式，RELATIVE_TO_SELF（相对于自身）和RELATIVE_TO_PARENT（相对于父布局）pivotx,pivotY的值就应该是0-1的浮点数，分别对应xml中的%（自身）和%p（父布局）
                pivotYValue	缩放的中轴点Y坐标，即距离自身左边缘的位置，比如50%就是以图像的 中心为中轴点
                pivotYType	同pivotXType
                **/
                Animation animation= new ScaleAnimation(0, 1.4f, 0, 1.4f,
                        ScaleAnimation.RELATIVE_TO_SELF,0.5f,ScaleAnimation.RELATIVE_TO_SELF,0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);

位移动画

/**         //fromXDelta     起始点X轴坐标，可以是数值、百分数、百分数p 三种样式，同scale
                //fromYDelta    起始点Y轴从标，可以是数值、百分数、百分数p 三种样式
                //toXDelta         结束点X轴坐标
                //toYDelta        结束点Y轴坐标
                // fromYType、toYType同ScaleAnimation，
 public TranslateAnimation(int fromXType, float fromXValue, int toXType,
                float toXValue,int fromYType, float fromYValue, int toYType, float toYValue) {
                }
    **/
                Animation animation= new TranslateAnimation(TranslateAnimation.RELATIVE_TO_SELF, 0, TranslateAnimation.RELATIVE_TO_SELF, 0.5f,
                        TranslateAnimation.RELATIVE_TO_SELF, 0, TranslateAnimation.RELATIVE_TO_SELF, 0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);

旋转动画

/**
                *
                 public RotateAnimation(float fromDegrees, float toDegrees, int pivotXType,
                 float pivotXValue, int pivotYType, float pivotYValue) {
                 }
                 fromDegrees="0"//旋转的起始角度
                 toDegrees="360"//旋转的结束角度
                 repeatCount="1"//旋转次数
                 android:repeatMode="reverse"//设置重复模式，默认restart，但只有当repeatCount大于0或者infinite或-1时 才有效。还可以设置成reverse，表示偶数次显示动画时会做方向相反的运动
                * */
                Animation animation= new RotateAnimation(0, -720, RotateAnimation.RELATIVE_TO_SELF, 0.5f,
                        RotateAnimation.RELATIVE_TO_SELF, 0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);

组合动画

Animation rotateAnimation = new RotateAnimation(0, -720, RotateAnimation.RELATIVE_TO_SELF, 0.5f,
                        RotateAnimation.RELATIVE_TO_SELF, 0.5f);
                rotateAnimation.setDuration(2000);
                Animation translateAnimation = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT, 0, TranslateAnimation.RELATIVE_TO_PARENT, 0.5f,
                        TranslateAnimation.RELATIVE_TO_PARENT, 0, TranslateAnimation.RELATIVE_TO_PARENT, 0.5f);
                translateAnimation.setDuration(2000);
                Animation scaleAnimation = new ScaleAnimation(0, 1.4f, 0, 1.4f, ScaleAnimation.RELATIVE_TO_SELF,
                        0.5f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
                scaleAnimation.setDuration(2000);
                Animation alphaAnimation = new AlphaAnimation(0, 1);
                alphaAnimation.setDuration(2000);
                AnimationSet animationSet = new AnimationSet(true);
                animationSet.addAnimation(rotateAnimation);
                animationSet.addAnimation(translateAnimation);
                animationSet.addAnimation(scaleAnimation);
                animationSet.addAnimation(alphaAnimation);
                animationSet.setDuration(4000);
                animationSet.setFillAfter(true);
                imageView.startAnimation(animationSet);

完整代码

package com.c201801080119.day_5;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity2 extends AppCompatActivity {
    Button button;
    Button button1;
    Button button2;
    Button button3;
    Button button4;
    ImageView imageView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        button=findViewById(R.id.button3);
        button1=findViewById(R.id.button4);
        button2=findViewById(R.id.button5);
        button3=findViewById(R.id.button6);
        button4=findViewById(R.id.button7);
        imageView=findViewById(R.id.imageView2);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                Animation animation= AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_alpha);
//                imageView.startAnimation(animation);
/**
        //fromAlpha   动画开始的透明度，从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
        //toAlpha       动画结束时的透明度，也是从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
        public AlphaAnimation(float fromAlpha, float toAlpha) {
        }
**/
                Animation animation=new AlphaAnimation(0,1);
                animation.setDuration(2000);
                imageView.startAnimation(animation);
            }
        });
        button1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                Animation animation=AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_scale);
               /**
                public ScaleAnimation(float fromX, float toX, float fromY, float toY,
                int pivotXType, float pivotXValue, int pivotYType, float pivotYValue) {
                }
                fromX	沿着X轴缩放的起始比例
                fromY	沿着X轴缩放的起始比例
                toX	沿着X轴缩放的结束比例
                toY	沿着Y轴缩放的结束比例
                pivotXValue	缩放的中轴点X坐标，即距离自身左边缘的位置，比如50%就是以图像的 中心为中轴点
                pivotXType	有2种模式，RELATIVE_TO_SELF（相对于自身）和RELATIVE_TO_PARENT（相对于父布局）pivotx,pivotY的值就应该是0-1的浮点数，分别对应xml中的%（自身）和%p（父布局）
                pivotYValue	缩放的中轴点Y坐标，即距离自身左边缘的位置，比如50%就是以图像的 中心为中轴点
                pivotYType	同pivotXType
                **/
                Animation animation= new ScaleAnimation(0, 1.4f, 0, 1.4f,
                        ScaleAnimation.RELATIVE_TO_SELF,0.5f,ScaleAnimation.RELATIVE_TO_SELF,0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);
            }
        });
        button2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

//                Animation animation =AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_translate);
    /**         //fromXDelta     起始点X轴坐标，可以是数值、百分数、百分数p 三种样式，同scale
                //fromYDelta    起始点Y轴从标，可以是数值、百分数、百分数p 三种样式
                //toXDelta         结束点X轴坐标
                //toYDelta        结束点Y轴坐标
                // fromYType、toYType同ScaleAnimation，
 public TranslateAnimation(int fromXType, float fromXValue, int toXType,
                float toXValue,int fromYType, float fromYValue, int toYType, float toYValue) {
                }
    **/
                Animation animation= new TranslateAnimation(TranslateAnimation.RELATIVE_TO_SELF, 0, TranslateAnimation.RELATIVE_TO_SELF, 0.5f,
                        TranslateAnimation.RELATIVE_TO_SELF, 0, TranslateAnimation.RELATIVE_TO_SELF, 0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);
            }
        });
        button3.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                Animation animation=AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_rotate);
                /**
                *
                 public RotateAnimation(float fromDegrees, float toDegrees, int pivotXType,
                 float pivotXValue, int pivotYType, float pivotYValue) {
                 }
                 fromDegrees="0"//旋转的起始角度
                 toDegrees="360"//旋转的结束角度
                 repeatCount="1"//旋转次数
                 android:repeatMode="reverse"//设置重复模式，默认restart，但只有当repeatCount大于0或者infinite或-1时 才有效。还可以设置成reverse，表示偶数次显示动画时会做方向相反的运动
                * */
                Animation animation= new RotateAnimation(0, -720, RotateAnimation.RELATIVE_TO_SELF, 0.5f,
                        RotateAnimation.RELATIVE_TO_SELF, 0.5f);
                animation.setDuration(2000);
                imageView.startAnimation(animation);
            }
        });
        button4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//                Animation animation=AnimationUtils.loadAnimation(MainActivity2.this,R.anim.anim_set);
                Animation rotateAnimation = new RotateAnimation(0, -720, RotateAnimation.RELATIVE_TO_SELF, 0.5f,
                        RotateAnimation.RELATIVE_TO_SELF, 0.5f);
                rotateAnimation.setDuration(2000);
                Animation translateAnimation = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT, 0, TranslateAnimation.RELATIVE_TO_PARENT, 0.5f,
                        TranslateAnimation.RELATIVE_TO_PARENT, 0, TranslateAnimation.RELATIVE_TO_PARENT, 0.5f);
                translateAnimation.setDuration(2000);
                Animation scaleAnimation = new ScaleAnimation(0, 1.4f, 0, 1.4f, ScaleAnimation.RELATIVE_TO_SELF,
                        0.5f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
                scaleAnimation.setDuration(2000);
                Animation alphaAnimation = new AlphaAnimation(0, 1);
                alphaAnimation.setDuration(2000);
                AnimationSet animationSet = new AnimationSet(true);
                animationSet.addAnimation(rotateAnimation);
                animationSet.addAnimation(translateAnimation);
                animationSet.addAnimation(scaleAnimation);
                animationSet.addAnimation(alphaAnimation);
                animationSet.setDuration(4000);
                animationSet.setFillAfter(true);
                imageView.startAnimation(animationSet);
            }
        });
    }
}

本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。