Android动画学习（三）之补间动画常用的实例

本篇主要介绍补间动画几个使用的功能

• App欢迎界面的动画跳转
• 输入框EditText没有输入的水平晃动动画
• 仿360雷达扫描旋转动画

App欢迎界面的透明度动画

实现效果
App启动时设置定时动画跳转到MainActivity.
效果图：

开机启动动画使用复合动画。在Java中配置动画属性。
废话不说，直接上Activity代码

package com.example.administrator.androidanimation.practice;import android.content.Intent;import android.os.Bundle;import android.os.Handler;import android.support.v7.app.AppCompatActivity;import android.view.animation.AlphaAnimation;import android.view.animation.Animation;import android.view.animation.AnimationSet;import android.view.animation.RotateAnimation;import android.view.animation.ScaleAnimation;import android.widget.RelativeLayout;import com.example.administrator.androidanimation.R;import com.example.administrator.androidanimation.activity.MainActivity;/***欢迎界面的透明度动画和自定义环形进度条*@author ZD*created at 2017/7/20 9:38*description：*/public class WelcomeActivity extends AppCompatActivity {    private RelativeLayout rl_welcome_root;    private Handler handler  = new Handler(){        public void handleMessage(android.os.Message msg) {            if(msg.what==1) {                startActivity(new Intent(WelcomeActivity.this, MainActivity.class));                //关闭自己                finish();            }        }    };    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_welcome);        rl_welcome_root = (RelativeLayout) findViewById(R.id.rl_welcome);        //显示动画        showAnimation();        //发送延迟3s的消息        handler.sendEmptyMessageDelayed(1, 3000);    }    /**     * 显示动画     *     * 旋转动画  RotateAnimation: 0-->360 视图的中心点 2s     * 透明度动画 AlphaAnimation: 0-->1 2s     * 缩放动画 ScaleAnimation: 0-->1 视图的中心点 2s     */    private void showAnimation() {        //旋转动画  RotateAnimation: 0-->360 视图的中心点 2s        RotateAnimation rotateAnimation = new RotateAnimation(0, 360,                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);        rotateAnimation.setDuration(2000);        //透明度动画 AlphaAnimation: 0-->1 2s        AlphaAnimation alphaAnimation = new AlphaAnimation(0, 1);        alphaAnimation.setDuration(2000);        //缩放动画 ScaleAnimation: 0-->1 视图的中心点 2s        ScaleAnimation scaleAnimation = new ScaleAnimation(0, 1, 0, 1,                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);        scaleAnimation.setDuration(2000);        //创建复合动画,并添加        AnimationSet animationSet = new AnimationSet(true);        animationSet.addAnimation(rotateAnimation);        animationSet.addAnimation(alphaAnimation);        animationSet.addAnimation(scaleAnimation);        //启动        rl_welcome_root.startAnimation(animationSet);    }}

布局

<?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"    android:id="@+id/rl_welcome"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:background="@drawable/mei1"    tools:context="com.example.administrator.androidanimation.practice.WelcomeActivity">    <ProgressBar        android:id="@+id/pb_welcome_loading"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerHorizontal="true"        android:layout_alignParentBottom="true"        android:layout_marginBottom="50dp"        android:indeterminateDrawable="@anim/image_progress"        android:indeterminateDuration="700"/></RelativeLayout>

输入框EditText没有输入的水平晃动动画

实现效果：
在EditText输入文本，得到输入框的文本，判断断是否是空串, 如果为空串, 显示抖动动画
效果图

Java代码

package com.example.administrator.androidanimation.practice;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.text.TextUtils;import android.view.View;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.widget.EditText;import android.widget.Toast;import com.example.administrator.androidanimation.R;/***输入框没有输入的水平晃动动画*@author ZD*created at 2017/7/20 9:38*description：*/ public class InputETShakeActivity extends AppCompatActivity {    private EditText et_main_name;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_input_etshake);        et_main_name = (EditText) findViewById(R.id.et_main_name);    }    public void login(View v) {        //得到输入框的文本        String name = et_main_name.getText().toString();        //判断是否是空串, 如果为空串, 显示抖动动画        if(TextUtils.isEmpty(name.trim())) {            Animation animation = AnimationUtils.loadAnimation(this, R.anim.shake);            et_main_name.startAnimation(animation);        } else {            //否则, 提示操作成功            Toast.makeText(this, "操作成功", Toast.LENGTH_SHORT).show();        }    }}

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"    tools:context="com.example.administrator.androidanimation.practice.InputETShakeActivity">    <EditText        android:id="@+id/et_main_name"        android:layout_width="fill_parent"        android:layout_height="wrap_content"        android:hint="用户名"        android:layout_above="@+id/button15"        android:layout_alignParentStart="true"        android:layout_marginBottom="25dp" />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="登陆"        android:onClick="login"        android:layout_centerVertical="true"        android:layout_centerHorizontal="true"        android:id="@+id/button15" /></RelativeLayout>

仿360雷达扫描旋转动画

实现效果：
模仿360杀毒时雷达不断旋转的效果
效果图

Java代码

package com.example.administrator.androidanimation.practice;import android.os.AsyncTask;import android.os.Bundle;import android.os.SystemClock;import android.support.v7.app.AppCompatActivity;import android.view.View;import android.view.animation.Animation;import android.view.animation.LinearInterpolator;import android.view.animation.RotateAnimation;import android.widget.ImageView;import android.widget.ProgressBar;import android.widget.TextView;import com.example.administrator.androidanimation.R;import static android.R.attr.id;/** * 仿360雷达扫描旋转动画和自定义水平进度条 * * @author ZD *         created at 2017/7/20 9:54 *         description： */public class RadarSkannaActivity extends AppCompatActivity {    private ImageView iv_main_scan;    private TextView tv_main_scan;    private ProgressBar pb_main_scan;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_radar_skanna);        iv_main_scan = (ImageView) findViewById(R.id.iv_main_scan);        tv_main_scan = (TextView) findViewById(R.id.tv_main_scan);        pb_main_scan = (ProgressBar) findViewById(R.id.pb_main_scan);    }    public void scanRadar(View view) {        //1. 显示扫描动画        showScanAnimation();        //2. 扫描,并显示扫描进度        scan();    }    /**     * 进度条     * 扫描,并显示扫描进度     */    private void scan() {        //启动异步任务做        new AsyncTask<Void, Void, Void>() {            //1. 主线程, 显示提示视图            protected void onPreExecute() {                tv_main_scan.setText("手机杀毒引擎正在扫描中...");            }            //2. 分线程, 做长时间的工作(扫描应用)            @Override            protected Void doInBackground(Void... params) {                int appCount = 60;                //设置进度条的最大值                pb_main_scan.setMax(appCount);                for (int i = 0; i < appCount; i++) {                    SystemClock.sleep(40);                    //扫描完成一个                    //发布进度                    publishProgress();                }                return null;            }            //在主线程执行, 更新进度            protected void onProgressUpdate(Void[] values) {                pb_main_scan.incrementProgressBy(1);//增加1                //pb_main_scan.setProgress(pb_main_scan.getProgress()+1);//原始的方式            }            //3. 主线程, 更新界面            protected void onPostExecute(Void result) {                //隐藏进度条                pb_main_scan.setVisibility(View.GONE);                //更新文本                tv_main_scan.setText("扫描完成, 未发现病毒应用, 请放心使用!");                //停止扫描动画                iv_main_scan.clearAnimation();            }        }.execute();    }    /**     * 显示扫描动画     * iv_main_scan的旋转动画     */    private void showScanAnimation() {        //创建动画对象        RotateAnimation animation = new RotateAnimation(0, 360,                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);        //设置        animation.setDuration(1000);        animation.setRepeatCount(Animation.INFINITE);        animation.setInterpolator(new LinearInterpolator());        //启动        iv_main_scan.startAnimation(animation);    }}

XMl

<?xml version="1.0" encoding="utf-8"?><LinearLayout 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:orientation="vertical"    tools:context="com.example.administrator.androidanimation.practice.RadarSkannaActivity">    <TextView        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="360手机杀毒"        android:background="#FFCFCE"        android:textSize="25sp"        android:gravity="center"        android:padding="5dp"/>    <Button        android:onClick="scanRadar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:text="扫描" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content" >        <FrameLayout            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:background="@drawable/ic_scanner_malware">            <ImageView                android:id="@+id/iv_main_scan"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:src="@drawable/act_scanning_03" />        </FrameLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="match_parent"            android:orientation="vertical"            android:gravity="center_vertical"            android:layout_marginLeft="10dp">            <TextView                android:id="@+id/tv_main_scan"                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:text="自定义水平进度条" />            <ProgressBar                android:id="@+id/pb_main_scan"                style="?android:attr/progressBarStyleHorizontal"                android:layout_width="match_parent"                android:layout_height="wrap_content"                android:progressDrawable="@drawable/my_progress"/>        </LinearLayout>    </LinearLayout></LinearLayout>

总结

以上使经常使用补间动画实现的效果。当然动画可以实现的效果千千万万，这里只挑选三个常用的效果予以展示。更多的效果请自行实现。
写博客是为了帮助开发者学习使用技术，同时巩固自己所学技术。如果此篇博客有助于您的学习，那是我的荣幸！如果此篇博客有任何瑕疵，请多多指教!在此感谢您的学习和指教！