Android动画之一:Drawable Animation
2016-07-28 09:20
423 查看
准备写几篇博客讲解Android的动画,首先介绍Android动画的整体轮廓。
Android动画主要分为三大类
View Animation
Drawable Animation
Property Animation
其中Drawable Animations对大多数人来说是三者中最容易理解的,其实它就是很多书籍中提到的逐帧动画(frame-by-frame animation)。而Property Animation和View Animation是相对比较容易混淆的,下面先讲解二者的区别。
View Animation有两个缺点:(1)View Animation一般只能修改组件(View Object)的部分属性,比如:scaling(大小)和rotation(旋转),但是无法修改组件的背景颜色。(2)View Animation使某个组件产生动画效果移动一段距离后,比如从屏幕左侧移动到右侧,其实整个过程是绘制出来的效果,该组件真正的位置依然保留在左侧,只有点击左侧位置才能触发该组件。所以想真正移动某组件,需要在动画结束后添加代码实现。
Property Animation则没有以上View Animation的两个限制,Property Animation可以修改任何对象(View Object 或者 non-view Object)的任何属性,比如大小,旋转,颜色。并且,移动后的组件,位置也回跟随着改变。
Android官网推荐使用Property Animation,但是View Animation也有其优点:使用方便简单,所以当View Animation能方便快速地解决需求时,选择它也是不错的选择。
以上我们对Android动画有了一个整体的认识,接下来循序渐进,先介绍最容易学习的Drawable Animation。如上面所说,Drawable Animation是逐帧动画,那么使用它之前必须先定义好各个帧。我们可以通过代码定义,也可以使用xml文件定义,一般使用后者。如下:
[java] view
plain copy
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item android:drawable="@drawable/frame_1" android:duration="200" />
<item android:drawable="@drawable/frame_2" android:duration="200" />
<item android:drawable="@drawable/frame_3" android:duration="200" />
<item android:drawable="@drawable/frame_4" android:duration="200" />
</animation-list>
其中android:oneshot=“true”表示该动画只播放一次,等于false时则循环播放。<item/>标签定义各个帧显示的图片。显示顺序依照<item/>定义顺序。下面介绍一个实际场景,即平时我们常见的加载界面,
界面布局中只有一个居中的ImageView,比较简单,布局文件就不列出了。相对重要的是,我们需要定义一个xml文件描述各个帧,如下:
DrawableAnimationDemo\res\drawable\loading.xml
[java] view
plain copy
<?xml version="1.0" encoding="UTF-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_00" />
<item android:drawable="@drawable/login_loading_10" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_01" />
<item android:drawable="@drawable/login_loading_11" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_02" />
<item android:drawable="@drawable/login_loading_12" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_03" />
<item android:drawable="@drawable/login_loading_13" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_04" />
<item android:drawable="@drawable/login_loading_14" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_05" />
<item android:drawable="@drawable/login_loading_15" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_06" />
<item android:drawable="@drawable/login_loading_16" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_07" />
<item android:drawable="@drawable/login_loading_17" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_08" />
<item android:drawable="@drawable/login_loading_18" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_09" />
<item android:drawable="@drawable/login_loading_19" />
</layer-list>
</item>
</animation-list>
以上xml文件与前面一个xml文件不大同,多了一个<layer-list/>标签,该标签用法很简单,<layer-list/>内包含的图片将层叠起来,在同一帧中一起显示。如下:
+
=
再看主界面的activity文件,如下:
DrawableAnimationDemo\src\com\example\drawableanimationdemo\MainActivity.java
[java] view
plain copy
public class MainActivity extends Activity {
private AnimationDrawable loadingAnimation;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
//将该逐帧xml文件设置为ImageView的背景
ImageView loadingImg = (ImageView) findViewById(R.id.loading);
loadingImg.setBackgroundResource(R.drawable.loading);
loadingAnimation = (AnimationDrawable) loadingImg.getBackground();
}
/**
* 触摸屏幕,结束动画
*/
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
loadingAnimation.stop();
return true;
}
return super.onTouchEvent(event);
}
/**
* activity显示到屏幕则开启动画
*/
@Override
public void onWindowFocusChanged(boolean hasFocus) {
// TODO Auto-generated method stub
super.onWindowFocusChanged(hasFocus);
if (hasFocus)
loadingAnimation.start();
}
}
效果图如下,其中图片素材取材于OSchina的开源项目。
以上代码实现的功能是:activity一启动,则动画开始,触摸屏幕时动画停止,代码比较容易理解,唯一需要注意的是,不能在onCreate()方法中调用AnimationDrawable的start()方法,因为此时AnimationDrawable还未真正加载到界面中。所以,如果想启动界面就自动运行动画,可以在OnWindowFocusChanged(boolean hasFocus)中启动动画。
好了,只要掌握了这个例子,日常开发中Drawable Animation需要的知识已经足够。最后附上源码免费下载。
博客源码
Android动画主要分为三大类
View Animation
Drawable Animation
Property Animation
其中Drawable Animations对大多数人来说是三者中最容易理解的,其实它就是很多书籍中提到的逐帧动画(frame-by-frame animation)。而Property Animation和View Animation是相对比较容易混淆的,下面先讲解二者的区别。
View Animation有两个缺点:(1)View Animation一般只能修改组件(View Object)的部分属性,比如:scaling(大小)和rotation(旋转),但是无法修改组件的背景颜色。(2)View Animation使某个组件产生动画效果移动一段距离后,比如从屏幕左侧移动到右侧,其实整个过程是绘制出来的效果,该组件真正的位置依然保留在左侧,只有点击左侧位置才能触发该组件。所以想真正移动某组件,需要在动画结束后添加代码实现。
Property Animation则没有以上View Animation的两个限制,Property Animation可以修改任何对象(View Object 或者 non-view Object)的任何属性,比如大小,旋转,颜色。并且,移动后的组件,位置也回跟随着改变。
Android官网推荐使用Property Animation,但是View Animation也有其优点:使用方便简单,所以当View Animation能方便快速地解决需求时,选择它也是不错的选择。
以上我们对Android动画有了一个整体的认识,接下来循序渐进,先介绍最容易学习的Drawable Animation。如上面所说,Drawable Animation是逐帧动画,那么使用它之前必须先定义好各个帧。我们可以通过代码定义,也可以使用xml文件定义,一般使用后者。如下:
[java] view
plain copy
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true">
<item android:drawable="@drawable/frame_1" android:duration="200" />
<item android:drawable="@drawable/frame_2" android:duration="200" />
<item android:drawable="@drawable/frame_3" android:duration="200" />
<item android:drawable="@drawable/frame_4" android:duration="200" />
</animation-list>
其中android:oneshot=“true”表示该动画只播放一次,等于false时则循环播放。<item/>标签定义各个帧显示的图片。显示顺序依照<item/>定义顺序。下面介绍一个实际场景,即平时我们常见的加载界面,
界面布局中只有一个居中的ImageView,比较简单,布局文件就不列出了。相对重要的是,我们需要定义一个xml文件描述各个帧,如下:
DrawableAnimationDemo\res\drawable\loading.xml
[java] view
plain copy
<?xml version="1.0" encoding="UTF-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_00" />
<item android:drawable="@drawable/login_loading_10" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_01" />
<item android:drawable="@drawable/login_loading_11" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_02" />
<item android:drawable="@drawable/login_loading_12" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_03" />
<item android:drawable="@drawable/login_loading_13" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_04" />
<item android:drawable="@drawable/login_loading_14" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_05" />
<item android:drawable="@drawable/login_loading_15" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_06" />
<item android:drawable="@drawable/login_loading_16" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_07" />
<item android:drawable="@drawable/login_loading_17" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_08" />
<item android:drawable="@drawable/login_loading_18" />
</layer-list>
</item>
<item android:duration="100">
<layer-list>
<item android:drawable="@drawable/login_loading_09" />
<item android:drawable="@drawable/login_loading_19" />
</layer-list>
</item>
</animation-list>
以上xml文件与前面一个xml文件不大同,多了一个<layer-list/>标签,该标签用法很简单,<layer-list/>内包含的图片将层叠起来,在同一帧中一起显示。如下:
+
=
再看主界面的activity文件,如下:
DrawableAnimationDemo\src\com\example\drawableanimationdemo\MainActivity.java
[java] view
plain copy
public class MainActivity extends Activity {
private AnimationDrawable loadingAnimation;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
//将该逐帧xml文件设置为ImageView的背景
ImageView loadingImg = (ImageView) findViewById(R.id.loading);
loadingImg.setBackgroundResource(R.drawable.loading);
loadingAnimation = (AnimationDrawable) loadingImg.getBackground();
}
/**
* 触摸屏幕,结束动画
*/
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
loadingAnimation.stop();
return true;
}
return super.onTouchEvent(event);
}
/**
* activity显示到屏幕则开启动画
*/
@Override
public void onWindowFocusChanged(boolean hasFocus) {
// TODO Auto-generated method stub
super.onWindowFocusChanged(hasFocus);
if (hasFocus)
loadingAnimation.start();
}
}
效果图如下,其中图片素材取材于OSchina的开源项目。
以上代码实现的功能是:activity一启动,则动画开始,触摸屏幕时动画停止,代码比较容易理解,唯一需要注意的是,不能在onCreate()方法中调用AnimationDrawable的start()方法,因为此时AnimationDrawable还未真正加载到界面中。所以,如果想启动界面就自动运行动画,可以在OnWindowFocusChanged(boolean hasFocus)中启动动画。
好了,只要掌握了这个例子,日常开发中Drawable Animation需要的知识已经足够。最后附上源码免费下载。
博客源码
相关文章推荐
- Android handler示例
- Android学习笔记--RecycleView用法
- Android相对布局RelativeLayout,Intent用法,Intent传值(对象),Intent.action大全
- Android事件分发机制
- 老菜鸟迈出的第一步——Android调用WebService碰到的种种问题
- Android数据库SQlite详解
- AndroidStudio配置SVN
- Android Studio 一些快捷键
- 不依赖于Activity的Android全局悬浮窗的实现
- Android开源框架xUtils 说明以及使用
- 六款值得推荐的android(安卓)开源框架简介
- Android笔记--两种双击退出程序的方法
- SwipeRefreshLayout与ViewPager滑动事件冲突源码分析及解决办法
- Android OpenGL 显示基本图形及相关概念解读
- Android Toolbar菜单动态切换item的图标
- android AutoCompleteTextView 自定义BaseAdapter
- Android自定义控件之自定义属性(二)
- Android OpenGL入门
- Android第四十三天
- Android WebView 与JS的数据交互