您的位置:首页 > 移动开发 > Android开发

Android动画及图片的缩放和旋转

2012-05-02 10:55 295 查看
Android动画有2种,一种是Tween Animation,另一种是Frame Animation,先说说Tween动画吧。
  Tween动画是对视图对象中的内容进行一系列简单的转换,比如位置的移动,大小的缩放,旋转,透明度得变化等等。Tween动画可以写到一个xml文件中,就像定义布局文件一样,当然,也可以写到android代码中,不过推荐写到xml文件中,因为它具备的阅读性,可重用性大大超过了硬编码。xml文件放在工程的res/anim目录中,这个目录中要包含一个根元素,可以是<scale>,<translate>,<alpha>或者<rotate>,当然,这些元素都可以放到一个动画集合<set>中,默认情况下,所有的动画指令都是同时发生的,为了让他们按顺序发生,需要设置一个特殊的属性startOffset。下面定义了一个动画的集合:

1 <?xml version="1.0" encoding="utf-8"?>

2 <set
xmlns:android="http://schemas.android.com/apk/res/android"

3 android:shareInterpolator="false">

4 <scale
android:interpolator="@android:anim/accelerate_decelerate_interpolator"

5 android:fromXScale="1.0"

6 android:toXScale="1.4"

7 android:fromYScale="1.0"

8 android:toYScale="0.6"

9 android:pivotX="50%"

10 android:pivotY="50%"

11 android:fillAfter="false"

12 android:duration="700"/>

13

14 <set
android:interpolator="@android:anim/decelerate_interpolator">

15 <scale

16 android:fromXScale="1.4"

17 android:toXScale="0.0"

18 android:fromYScale="0.6"

19 android:toYScale="0.0"

20 android:pivotX="50%"

21 android:pivotY="50%"

22 android:startOffset="700"

23 android:duration="400"

24 android:fillBefore="false"/>

25 <rotate

26 android:fromDegrees="0"

27 android:toDegrees="-45"

28 android:toYScale="0.0"

29 android:pivotX="50%"

30 android:pivotY="50%"

31 android:startOffset="700"

32 android:duration="400"/>

33 </set>

34 </set>

这里解释一下这段代码的作用:

首先是一个动画的集合set,在这个set中有一个属性shareInterpolater,如果设置为true,则这个集合下面所有的子元素都享有同样的interpolater,api上面是这样说的:

android:shareInterpolator
Boolean. "true" if you want to share the same interpolator among all child elements.

紧跟在这个集合后面的是一个缩放动画,里面有一些个属性,下面一一介绍:android:interpolator属性:这是值定一个动画的插入器,有一些常用的插入器:accelerate_decelerate_interpolator加速-减速动画插入器,顾名思义,就是先加速后减速,accelerate_interpolator加速动画插入器,decelerate_interpolator减速动画插入器android:fromXScale属性为动画起始时,x坐标上的伸缩尺寸android:toXScal属性为动画结束时,x坐标上的伸缩尺寸android:fromYScale属性为动画起始时,y坐标上的伸缩尺寸android:toYScale属性为动画结束时,y坐标上的伸缩尺寸

关于伸缩尺寸这里还要罗嗦一下:也就是上面的四个属性的值:0.0表示收缩到没有,1.0表示正常无收缩,值小于1.0表示收缩,值大于1.0表示放大。

android:fillAfter属性当设置为true时,该动画转化在动画结束后被应用,同理还有android:fillBefore属性,当设置为true时,该动画转化在动画开始前被应用android:duration属性表示动画持续的时间,单为时毫秒

android:pivotX属性为动画相对于x坐标的起始位置android:pivotY属性为动画相对于y坐标的起始位置这2个属性有不同的格式表示,如值为50,表示是相对于父类的50%,如值为50%,表示是相对于自己的50%这里的50%表示相对于自身x,y坐标上的中点位置

紧跟着是一个动画集合,里面有缩放和旋转,这个集合的interpolater为减速动画插入器这里的缩放里面还有一个属性,android:startOffset属性是设置动画开始的时间,这里设置700是表示700毫秒之后开始,也就是第一个缩放完成之后开始。

旋转里面的属性跟scale里面的都差不多,只是旋转讲究的角度。android:fromDegrees属性表示动画起始时的角度android:toDegrees属性表示动画结束时旋转的角度,可以大于360度

动画文件写好了之后,我们就可以在代码中调用这个动画了,先写一个布局文件,布局文件里面有一个ImageView,然后我们让这个ImageView做动画。布局文件如下:

1 <?xml version="1.0" encoding="utf-8"?>

2 <LinearLayout

3 xmlns:android="http://schemas.android.com/apk/res/android"

4 android:layout_width="match_parent"

5 android:layout_height="match_parent">

6 <ImageView

7 android:id="@+id/imageView1"

8 android:src="@drawable/duola"

9 android:layout_width="match_parent"

10 android:layout_height="match_parent"></ImageView>

11 </LinearLayout>

然后我们让这个图片按照我们xml中指定的动画运动:代码:

package com.test.shang;

import android.app.Activity;

import android.graphics.drawable.AnimationDrawable;

import android.graphics.drawable.TransitionDrawable;

import android.os.Bundle;

import android.view.MotionEvent;

import android.view.animation.Animation;

import android.view.animation.AnimationSet;

import android.view.animation.AnimationUtils;

import android.widget.ImageView;

public
class TestStyle
extends Activity {

AnimationDrawable animationDrawable;

@Override

protected
void onCreate (Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.test);

ImageView iv = (ImageView) findViewById(R.id.imageView1);

Animation animation = (AnimationSet) AnimationUtils.loadAnimation(this, R.anim.anim_set);

iv.setAnimation(animation);

animation.start();

}

}

因为这里是动画,不好截图,所以我就不截图了,具体效果大家可以试试看。

下面接着说说Frame Animation吧:也就是帧动画,可以使用AndroidDrawable来负责帧动画,同样它可以在xml文件中很方便的列出所有的帧,按照周期去执行每帧动画,下面是一个定义帧动画的例子:

1 <?xml version="1.0" encoding="utf-8"?>

2 <animation-list
xmlns:android="http://schemas.android.com/apk/res/android"

3 android:oneshot="true">

4 <item
android:drawable="@drawable/register" android:duration="500"/>

5 <item
android:drawable="@drawable/duola" android:duration="500"/>

6 <item
android:drawable="@drawable/icon" android:duration="500"/>

7 </animation-list>

这里定义了帧的名字和每帧的持续时间.这里有3帧,通过设置android:oneshot属性为true,它将会在最后一帧停下来,如果设置为false,它将会循环播放,可以把它添加到一个背景中,让他播放,具体代码如下:布局文件:

1 <?xml version="1.0" encoding="utf-8"?>

2 <LinearLayout

3 xmlns:android="http://schemas.android.com/apk/res/android"

4 android:layout_width="match_parent"

5 android:layout_height="match_parent">

6 <ImageView

7 android:id="@+id/imageView1"

8 android:layout_width="match_parent"

9 android:layout_height="match_parent"></ImageView>

10 </LinearLayout>

在代码里面设置imageview的背景图片,然后做动画:

1 package com.test.shang;

2

3 import android.app.Activity;

4 import android.graphics.drawable.AnimationDrawable;

5 import android.graphics.drawable.TransitionDrawable;

6 import android.os.Bundle;

7 import android.view.MotionEvent;

8 import android.view.animation.Animation;

9 import android.view.animation.AnimationSet;

10 import android.view.animation.AnimationUtils;

11 import android.widget.ImageView;

12

13 public
class TestStyle
extends Activity {

14 AnimationDrawable animationDrawable;

15

16 @Override

17 protected
void onCreate (Bundle savedInstanceState) {

18 super.onCreate(savedInstanceState);

19 setContentView(R.layout.test);

20 ImageView iv
= (ImageView) findViewById(R.id.imageView1);

21 iv.setBackgroundResource(R.anim.anim_list);

22 animationDrawable
= (AnimationDrawable) iv.getBackground();

23 }

24 @Override

25 public
boolean onTouchEvent (MotionEvent event) {

26 if(event.getAction()
== MotionEvent.ACTION_DOWN) {

27 animationDrawable.start();

28 return
true;

29 }

30 return
super.onTouchEvent(event);

31 }

32 }

这里需要注意的是:AnimationDrawable在调用OnCreate的过程中不能调用start(),这是因为AnimationDrawable不能在不完全的窗口上运行,需要一个操作来触发,如果你想立即播放动画,没有必要的交互,你可以在onWindowFocusChanged()方法中调用它,这样它将会成为窗口焦点。

下面说说图片的缩放和旋转:这里我就写的比较简单了,代码里面的注释很详细,可以慢慢看。

1 package com.test.shang;

2

3 import android.app.Activity;

4 import android.graphics.Bitmap;

5 import android.graphics.BitmapFactory;

6 import android.graphics.Matrix;

7 import android.graphics.drawable.BitmapDrawable;

8 import android.os.Bundle;

9 import android.widget.ImageView;

10 import android.widget.ImageView.ScaleType;

11 import android.widget.LinearLayout;

12 import android.widget.LinearLayout.LayoutParams;

13

14 public
class BitmapTest
extends Activity {

15

16 @Override

17 protected
void onCreate (Bundle savedInstanceState) {

18 super.onCreate(savedInstanceState);

19 setTitle("测试图片的缩放和旋转");

20 LinearLayout layout
= new LinearLayout(this);

21

22 //加载需要操作的图片,这里是机器猫的图片

23 Bitmap bitmapOrg
= BitmapFactory.decodeResource(getResources(), R.drawable.duola);

24

25 //获取这个图片的宽和高

26 int width
= bitmapOrg.getWidth();

27 int height
= bitmapOrg.getHeight();

28

29 //定义预转换成的图片的宽和高

30 int newWidth
= 200;

31 int newHight
= 200;

32

33 //计算缩放率,新尺寸除原尺寸

34 float scaleWidth
= (float)newWidth/width;

35 float scaleHeight
= (float)newHight/height;

36

37 //创建操作图片用的matrix对象

38 Matrix matrix
= new Matrix();

39

40 //缩放图片动作

41 matrix.postScale(scaleWidth, scaleHeight);

42

43 //旋转图片动作

44 matrix.postRotate(45);

45

46 //创建新的图片

47 Bitmap resizedBitmap
= Bitmap.createBitmap(bitmapOrg,
0, 0, width, height, matrix,
true);

48

49 //将上面创建的Bitmap转换成Drawable对象,使得其可以使用在imageView,imageButton上。

50 BitmapDrawable bitmapDrawable
= new BitmapDrawable(resizedBitmap);

51

52 //创建一个ImageView

53 ImageView iv
= new ImageView(this);

54

55 //将imageView的图片设置为上面转换的图片

56 iv.setImageDrawable(bitmapDrawable);

57

58 //将图片居中显示

59 iv.setScaleType(ScaleType.CENTER);

60

61 //将imageView添加到布局模板中

62 layout.addView(iv,
new LinearLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));

63

64 //设置为本activity的模板

65 setContentView(layout);

66 }

67 }

下面是效果预览:

好了,今天就到这里吧。。。。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: