专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > 图形/图像

《Ophone应用开发权威指南》学习:Android 图形用户界面 之 动画片(一)

发布时间:2011-06-27 20:28:37 文章来源:www.iduyao.cn 采编人员:星星草
《Ophone应用开发权威指南》学习:Android 图形用户界面 之 动画(一)
直接贴上今天写的一些小Demo代码,供以后学习:2011 - 05 - 25 
MainActivity.java
package com.anim;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.view.Window;
import android.view.WindowManager;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.AnimationUtils;
import android.view.animation.CycleInterpolator;
import android.view.animation.DecelerateInterpolator;
import android.view.animation.Interpolator;
import android.view.animation.LinearInterpolator;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;

public class MainActivity extends Activity {
    /** Called when the activity is first created. */
	ImageView imageView1;
	ImageView imageView2;
	ImageView imageView3;
	ImageView imageView4;
	ImageView imageView5;
	Handler handler;
	
	Animation translateAnimation;
	Animation alphaAnimation;
	Animation scaleAnimation;
	Animation rotateAnimation;
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.main);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
        		WindowManager.LayoutParams.FLAG_FULLSCREEN);
        
        imageView1 = (ImageView)findViewById(R.id.imageview1);
        imageView2 = (ImageView)findViewById(R.id.imageview2);
        imageView3 = (ImageView)findViewById(R.id.imageview3);
        imageView4 = (ImageView)findViewById(R.id.imageview4);
        imageView5 = (ImageView)findViewById(R.id.imageview5);
        
        handler = new Handler(){
        	public void handleMessage(android.os.Message msg) {
        		switch (msg.what) {
				case 1:
					// 平移动画
					// 1.代码实现
//					Animation translateAnimation = new TranslateAnimation(0, 50.0f, 0, 100.0f);
//					translateAnimation.setDuration(2000);
					// 2.加载xml文件
					translateAnimation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.animation_translate);
					
						// 添加动画播放的加速/减速,即缓冲效果
						// 1.线性播放,即匀速播放,这个是动画的默认效果
//						LinearInterpolator linearInterpolator = new LinearInterpolator();
//						translateAnimation.setInterpolator(linearInterpolator);// 添加到动画中
						// 2.加速播放,参数值越大,加速效果越明显,即开始时慢,结束时快
						Interpolator accelerateInterpolator = new AccelerateInterpolator(2.0f);
						translateAnimation.setInterpolator(accelerateInterpolator);
						// 3.减速播放,与上类似
//						Interpolator decelerateInterpolator = new DecelerateInterpolator(0.8f);
//						translateAnimation.setInterpolator(decelerateInterpolator);
						// 4.开始和结束较慢,在动画播放中间时段会先加速后减速
//						Interpolator accelerateDecelerateInterpolator = new AccelerateDecelerateInterpolator();
//						translateAnimation.setInterpolator(accelerateDecelerateInterpolator);
						// 5.实现循环播放的动画效果
//						Interpolator cycleInterpolator = new CycleInterpolator(2.0f);
//						translateAnimation.setInterpolator(cycleInterpolator);
						
					imageView1.startAnimation(translateAnimation);
			        handler.sendEmptyMessageDelayed(2, 3000);
					break;
				case 2:
					// 渐变动画
					// 1.代码实现(实现效果是从完全不透明变成完全透明,在1秒钟内完成)
//					Animation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
//					animation2.setDuration(1000);
					// 2.加载xml文件
					alphaAnimation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.animation_alpha);
					imageView2.startAnimation(alphaAnimation);
			        handler.sendEmptyMessageDelayed(3, 2000);
					break;
				case 3:
					// 缩放动画
					// 1.代码实现
//					Animation scaleAnimation = new ScaleAnimation(1.0f, 2.0f, 1.0f, 2.0f, Animation.ABSOLUTE,10.0f,Animation.ABSOLUTE, 10.0f);
//					scaleAnimation.setDuration(1000);
					// 2.加载xml文件
					scaleAnimation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.animation_scale);
					imageView4.startAnimation(scaleAnimation);
			        handler.sendEmptyMessageDelayed(4, 2000);
					break;
				case 4:
					// 旋转动画(实现效果是以(10.0f,10.0f)为旋转轴心点,将组件从0度旋转到270度)
					// 1.代码实现 (正数表示顺时针旋转)
//					Animation rotateAnimation = new RotateAnimation(0.0f, 270.0f, Animation.ABSOLUTE, 10.0f, Animation.ABSOLUTE, 10.0f);
//					rotateAnimation.setDuration(3000);
					// 2.加载xml文件
					rotateAnimation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.animation_rotate);
					rotateAnimation.setRepeatCount(Animation.INFINITE);// 设置播放次数:传入一个负数即可实现无限次播放
					rotateAnimation.setRepeatMode(Animation.REVERSE);// 设置播放模式:这里设置为播放完毕后,从后向前反过来播放,还有一个是RESTART,即从头播放
					rotateAnimation.setStartTime(AnimationUtils.currentAnimationTimeMillis()+2000);// 设置播放的开始时间:这里通过工具类获取当前系统时间,然后再1000,即延迟1秒,如果传入的值为负数,则立即播放,可以用系统的变量:Animation.START_ON_FIRST_FRAME(-1)
					rotateAnimation.setStartOffset(3000);// 设置播放偏移时间,即动画开始播放之前延时多少毫秒,加上上面的2秒,则动画首次播放被延迟了5秒,之后重复播放过程中,每次播放都会被延迟3秒
					imageView4.startAnimation(rotateAnimation);
					handler.sendEmptyMessageDelayed(5, 6000);
					/**
					 * 另外这里讲解一下其他几个方法:
					 * 1.setFillBefore(boolean fillBefore);当设置为true时,那么在动画开始播放之前就会进行动画变换操作,默认为true
					 * 2.setFillAfter(boolean fillAfter);当设置为true时,那么在动画结束之后(只有一帧)仍会进行动画变换操作,默认为false
					 * 3.setFillEnabled(boolean fillEnabled);只有将其设置为true,上述的两个属性才有意义,否则无论是开始还是结束都会进行动画变换操作,默认为false
					 */
					break;
				case 5:
					// 将各种动画效果集合到一块,应用到组件上
					// 1.代码实现
//					AnimationSet animationSet = new AnimationSet(false);// 参数说明:true表示应用AnimationSet的Interpolator效果,false表示应用各个动画对象自己的Interpolator效果
//					animationSet.addAnimation(new TranslateAnimation(0, 50.0f, 0, 50.0f));
//					animationSet.addAnimation(new AlphaAnimation(1.0f, 0.0f));
//					animationSet.setDuration(3000);
//					animationSet.setRepeatCount(Animation.INFINITE);
//					animationSet.setRepeatMode(Animation.RESTART);
					// 2.加载xml文件
					Animation animationSet = AnimationUtils.loadAnimation(MainActivity.this, R.anim.animation_set);
					imageView3.setAnimation(animationSet);
//					handler.sendEmptyMessageDelayed(6, 1000);
					// 设置背景
					MainActivity.this.getWindow().setBackgroundDrawableResource(R.drawable.blue);
					break;
				case 6:
					Animation animation3D = new My3DAnimation(0.0f, 360.0f, 100, 180, 100.0f, true);
					animation3D.setDuration(3000);
					imageView5.startAnimation(animation3D);
					if (m == -1) {
				        handler.sendEmptyMessageDelayed(1, 3000);
				        m++;
					}
			        handler.sendEmptyMessageDelayed(6, 3000);
					break;
				}
        	};
        };
        
        handler.sendEmptyMessageDelayed(6, 1000);
        
    }
    private int m = -1;
}

 

My3DAnimation.java

 

package com.anim;

import android.graphics.Camera;
import android.graphics.Matrix;
import android.view.animation.Animation;
import android.view.animation.Transformation;

public class My3DAnimation extends Animation {
	
	private final float mFromDegrees;// 动画旋转的起始角度
	private final float mToDegrees;//动画旋转的结束角度
	private final float mCenterX;// 动画旋转原点的x坐标
	private final float mCenterY;// 动画旋转原点的y坐标
	private final float mDepthZ;// 在动画旋转时,在z轴上有一个来回的效果,该值表示在z轴上平移的最大距离
	private final boolean mReverse;// 如果为true,则动画反向旋转
	private Camera mCamera = new Camera();
	
	public My3DAnimation(float fromDegrees,float toDegrees,float centerX,float centerY,
			float depthZ,boolean reverse){
		mFromDegrees = fromDegrees;
		mToDegrees = toDegrees;
		mCenterX = centerX;
		mCenterY = centerY;
		mDepthZ = depthZ;
		mReverse = reverse;
	}
	
	// 该方法指定了动画每一帧的变换效果
	@Override
	protected void applyTransformation(float interpolatedTime, Transformation t) {
		// 参数说明:
		// interpolatedTime:代表动画执行的进度,为一个大于等于0,小雨等于1的浮点数
		// t:为动画变换的载体,该载体即为每一帧变换信息的载体,主要包含两个属性,
		//  1.Alpha:即该帧的透明度值  2. Matrix:图形变换信息,包含旋转,缩放,平移等信息
//		super.applyTransformation(interpolatedTime, t);
		final float fromDegrees = mFromDegrees;
		// 根据当前动画进度计算出当前转动的角度
		float degrees = fromDegrees+(mToDegrees - fromDegrees)*interpolatedTime;
		
		final float centerX = mCenterX;
		final float centerY = mCenterY;
		final Camera camera = mCamera;
		
		final Matrix matrix = t.getMatrix();
		camera.save();
		if (mReverse) {
			camera.translate(0.0f, 0.0f, mDepthZ*interpolatedTime);
		} else {
			camera.translate(0.0f, 0.0f, mDepthZ*(1.0f - interpolatedTime));
		}
		camera.rotateY(degrees);
		camera.getMatrix(matrix);
		camera.restore();
		// 根据对pre和post的理解(分别将变换效果置于变换最前和最后),
		// 结合Canvas变换中缩放原点的实现原理,即该动画会以(centerX,centerY)为原点在y轴上产生旋转效果
		matrix.preTranslate(-centerX, -centerY);
		matrix.postTranslate(centerX, centerY);
	}
	
	/**
	 * Matrix介绍
	 * Matrix可以方便的设置各种图形 变换信息,使用Canvas的concat()方法将Matrix设置的
	 * 变换信息作用于Canvas上,实现变换效果,主要方法如下:
	 * setTranslate(float x, float y);设置平移信息,x和y分别表示在x轴和y轴上平移的距离
	 * setScale(float sx, float sy, float px, float py);设置缩放信息,sx和sy分别表示在x轴和y轴上的缩放倍数,px和py表示一个坐标,即缩放原点
	 * setRotate(float degrees, float px, float px);设置旋转信息,degrees为旋转角度,后两个参数表示旋转原点坐标
	 * setSinCos(float sinValue , float cosValue , float px , float py);利用sin或cos的值来表示转动的角度,后两位表示转动原点(z轴上的转动)
	 * setSkew(float kx, float ky, float px, float py);设置倾斜信息,kx和ky表示在x轴和y轴上想倾斜度,后两位为倾斜原点
	 * setConcat(Matrix a,Matrix b);将两个矩阵信息合并
	 * 每种变换方法都对应有pre和post两种方法,因为在Matrix中设置各种变换信息是有顺序的。
	 * 如:	preTranslate()是将该平移操作放置在最开始执行
	 * 		    postTranslate()是将该平移操作放置在最后执行
	 *
	 * Camera介绍
	 * Camera主要实现了三维的平移和旋转,主要方法如下:
	 * translate(float x,float y,float z);设置旋转信息,参数分别是在x,y,z轴上平移的角度
	 * rotateX(float degrees);以x轴为轴心旋转degrees角度
	 * rotateY(float degrees);以y轴为轴心旋转degrees角度
	 * rotateZ(float degrees);以z轴为轴心旋转degrees角度
	 * save(),restore(),用于保存和恢复变换的状态,当Camera变换完毕后,可将其变换值作用于Matrix上,使用Camera.getMatrix()方法
	 */
}

 

 

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:background="#40ffffff">
	<ImageView
		android:id="@+id/imageview1"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/icon"></ImageView>
	<ImageView
		android:id="@+id/imageview2"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/icon" />
	<ImageView
		android:id="@+id/imageview3"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/icon" />
	<ImageView
		android:id="@+id/imageview4"
		android:layout_gravity="center"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/chat_input" />
	<ImageView
		android:id="@+id/imageview5"
		android:layout_gravity="center"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/chat_input" />
</LinearLayout>

 

 

res/anim目录下的xml文件:

 

animation_alpha.xml

 

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
	android:fromAlpha="0.0"
	android:toAlpha="1.0"
	android:duration="1000" />

 

animation_roate.xml

 

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
	android:fromDegrees="0.0" android:toDegrees="-360.0"
	android:pivotX="50%" android:pivotY="50%"
	android:duration="3000" />
	<!-- 正数表示顺时针旋转 -->

 

animation_scale.xml

 

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
	android:fromXScale="2.0" android:toXScale="1.0"
	android:fromYScale="2.0" android:toYScale="1.0"
	android:pivotX="50%" android:pivotY="50%"
	android:duration="1000" />
	<!-- android:pivotX="" android:pivotY=""
		当我们用xml文件来定义缩放动画的时候,pivotX的值为浮点数时,缩放类型
		为Animation.ABSOLUTE,即缩放的轴心点为相对组件左上角的距离值,
		为百分比时,缩放类型为Animation.RELATIVE_TO_SELF,即相对组件本身大小的比例
		之来表示,,如上面的50%,当在后面加上一个p字母时,如50%p,
		则为Animation.RELATIVE_TO_PARENT ,以父组件的总长度来计算-->

 

animation_translate.xml

 

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
	android:fromXDelta="0.0" android:toXDelta="200.0"
	android:fromYDelta="0.0" android:toYDelta="200.0"
	android:duration="2000" />

 

animation_set.xml

 

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
	android:interpolator="@android:anim/accelerate_interpolator" >
	<alpha 
		android:fromAlpha="0.0"
		android:toAlpha="1.0"
		android:duration="1000" />
	<translate
		android:fromXDelta="0.0" android:toXDelta="200.0"
		android:fromYDelta="0.0" android:toYDelta="200.0"
		android:duration="1000" />
	<scale 
		android:fromXScale="2.0" android:toXScale="1.0"
		android:fromYScale="2.0" android:toYScale="1.0"
		android:pivotX="50%" android:pivotY="50%"
		android:duration="1000" />
</set>

 

 

 图片自己添加吧!

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

热门推荐: