`

玩转Android---2D图形及动画---Tween动画

 
阅读更多

Android平台提供了两类动画,分别是Tween动画,和Frame动画。Tween通过场景里的对象不断的进行图片的变换,比如平移、渐变、缩放、旋转等来产生动画效果;Frame动画叫做顺序播放实现做好的图像和电影类似。另外加上gif动画,因为如果直接使用Bitmap或其他方法直接调用gif图片资源的话,显示的是静态的,如果要做成动态的,就需要一些其他的方法来实现。

 

首先来谈谈Tween动画,它有四种

 

①Alpha:渐变透明度动画

②Scale:渐变尺寸伸缩动画

③Translate:画面转换位置移动动画

④Rotate:画面转移旋转动画

 

这些动画的执行步骤差不多:先定义Animation动画对象,然后设置动画的一些属性,最后通过startAnimation()方法开始动画。

 

setDuration(long durationMillis);

功能:设置动画显示的时间

参数:durationMillis为动画显示时间的长短,以毫秒为单位

 

startAnimation(Animation animation)

功能:animation为要播放的动画

参数:animation为要播放的动画

 

第一种:AlphaAnimation(float fromAlpha, float toAlpha)

功能:创建一个透明度渐变的动画

参数说明:fromAlpha是动画起始时透明度;toAlpha是动画结束时透明度

注:0.0表示完全透明,1.0表示完全不透明

 

实现它有两种方式。

1、直接在程序中创建动画

 

//创建Alpha动画
Animation	 alpha = new AlphaAnimation(0.1f, 1.0f);
//设置动画时间为5秒
alpha.setDuration(5000);
//开始播放
img.startAnimation(alpha);
 

 

2、通过XML来创建动画

alpha_anim.xml。在res/anim目录下

 

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

 

 程序中直接调用

 

Animation scale = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.scale_anim);
//开始动画
img.startAnimation(scale);

 

效果:

 



 

第二种:ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, floatXValue,

int pivotYType, float pivotYValue)

功能:创建一个渐变尺寸伸缩动画

参数:fromX,toX分别是起始和结束时x坐标上的伸缩尺寸。fromY,toY分别是起始和结束时ye坐标上的伸缩尺寸。

pivotXValue,pivotYValue分别为伸缩动画相对于x,y坐标开始的位置,pivotXType,pivotYType分别为x,y的

伸缩模式。

 

它有两种实现方式。

1、直接在程序中实现的方式

 

Animation scale = new ScaleAnimation(0f, 1f, 0f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
//设置动画持续时间
scale.setDuration(5000);
//开始动画
img.startAnimation(scale);

 

 2、在XML中是创建动画

scale_anim.xml,在res/anim目录下

 

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<scale
	android:interpolator="@android:anim/accelerate_decelerate_interpolator"
	android:fromXScale="0.0"
	android:toXScale="1.0"
	android:fromYScale="0.0"
	android:toYScale="1.0"
	android:pivotX="50%"
	android:pivotY="50%"
	android:fillAfter="false"
	android:duration="5000"
/>
</set>

 Animation scale = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.scale_anim);

//开始动画
img.startAnimation(scale);
 

 

效果

第3种:TranslateAnimation(float fromXDelta, float toXDelta, float YDelta, float toYDelta)

功能:创建一个移动画面位置的动画

参数:fromXDelta,fromYDelta分别是其实坐标;toXDelta,toYDelta分别是结束坐标

 

它有两种是实现方式

1、直接在程序中实现

Animation translate = new TranslateAnimation(10, 100, 10, 100);
//设置动画持续时间
translate.setDuration(3000);
//开始动画
img.startAnimation(translate);
 

2、在XML中创建动画

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

 在程序中可以定义其实现,比如在Button中的按钮事件

Animation translate = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.translate_anim);
//开始动画
img.startAnimation(translate);
 


第4种:Rotate(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType,

float pivotYValue)

功能:创建一个旋转画面的动画

参数:fromDegrees为开始的角度;toDegrees为结束的角度。pivotXValue、pivotYType分别为x,y的伸缩模式。

pivotXValue,pivotYValue分别为伸缩动画相对于x,y的坐标开始位置

 

它有两种实现方式。

1、直接在程序中创建动画

Animation rotate =  new RotateAnimation(0f,+360f,
Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF, 0.5f);
rotate.setDuration(3000);
img.startAnimation(rotate);
 

2、在XML中创建动画

rotate_anim.xml

在res/anim目录下

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
	android:interpolator="@android:anim/accelerate_decelerate_interpolator"
	android:fromDegrees="0"
	android:toDegrees="+360"
	android:pivotX="50%"
	android:pivotY="50%"
	android:duration="1000"
/>
</set>
 Animation rotate = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.rotate_anim);
img.startAnimation(rotate);

 

 

下面是程序的全部代码。XML定义的动画部分在上面

 

在程序中直接实现

package com.loulijun.tween;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
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 TweenActivity extends Activity {
	Button btn1,btn2,btn3,btn4;
	ImageView img;
	//定义Alpha动画
	private Animation alpha = null;
	//定义Scale动画
	private Animation scale = null;
	//定义Translate动画
	private Animation translate = null;
	//定义Rotate动画
	private Animation rotate = null;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        //装载图片资源
        img = (ImageView)findViewById(R.id.imgview);
        
        btn1 = (Button)findViewById(R.id.btn1);
        btn2 = (Button)findViewById(R.id.btn2);
        btn3 = (Button)findViewById(R.id.btn3);
        btn4 = (Button)findViewById(R.id.btn4);
        //定义Alpha动画
        btn1.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				//创建Alpha动画
				alpha = new AlphaAnimation(0.1f, 1.0f);
				//设置动画时间为5秒
				alpha.setDuration(5000);
				//开始播放
				img.startAnimation(alpha);
			}
        	
        });
        //定义Scale动画
        btn2.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				scale = new ScaleAnimation(0f, 1f, 0f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, 
						Animation.RELATIVE_TO_SELF, 0.5f);
				//设置动画持续时间
				scale.setDuration(5000);
				//开始动画
				img.startAnimation(scale);
			}
        	
        });
        //定义Translate动画
        btn3.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				translate = new TranslateAnimation(10, 100, 10, 100);
				//设置动画持续时间
				translate.setDuration(3000);
				//开始动画
				img.startAnimation(translate);
			}
        	
        });
        //定义Rotate动画
        btn4.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				rotate =  new RotateAnimation(0f, +360f,
						Animation.RELATIVE_TO_SELF, 0.5f,
						Animation.RELATIVE_TO_SELF, 0.5f);
				rotate.setDuration(3000);
				img.startAnimation(rotate);
			}
        	
        });
    }
}
 

在XML中定义动画

package com.loulijun.tween2;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
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 TweenActivity extends Activity {
	Button btn1,btn2,btn3,btn4;
	ImageView img;
	//定义Alpha动画
	private Animation alpha = null;
	//定义Scale动画
	private Animation scale = null;
	//定义Translate动画
	private Animation translate = null;
	//定义Rotate动画
	private Animation rotate = null;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        //装载图片资源
        img = (ImageView)findViewById(R.id.imgview);
        
        btn1 = (Button)findViewById(R.id.btn1);
        btn2 = (Button)findViewById(R.id.btn2);
        btn3 = (Button)findViewById(R.id.btn3);
        btn4 = (Button)findViewById(R.id.btn4);
        //定义Alpha动画
        btn1.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				//创建Alpha动画
				alpha = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.alpha_anim);
				//开始播放
				img.startAnimation(alpha);
			}
        	
        });
        //定义Scale动画
        btn2.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				scale = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.scale_anim);
				//开始动画
				img.startAnimation(scale);
			}
        	
        });
        //定义Translate动画
        btn3.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				translate = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.translate_anim);
				//开始动画
				img.startAnimation(translate);
			}
        	
        });
        //定义Rotate动画
        btn4.setOnClickListener(new Button.OnClickListener()
        {

			@Override
			public void onClick(View v) {
				rotate = AnimationUtils.loadAnimation(TweenActivity.this, R.anim.rotate_anim);
				img.startAnimation(rotate);
			}
        	
        });
    }
}
 
  • 大小: 9.6 KB
  • 大小: 18.2 KB
  • 大小: 8.4 KB
  • 大小: 18.5 KB
  • 大小: 16.9 KB
分享到:
评论

相关推荐

    Android---Tween动画

    Android---Tween动画 运用了4种Tween的动画效果,包括: rotate(旋转),scale(伸缩), alpha(透明度),translate(平移) 以及tween(综合4种效果)

    Android-Animation动画之Tween Animation补间动画

    在Android开发中,动画是提升用户体验的关键因素之一。补间动画(Tween Animation)是Android提供的基本动画类型,它通过对对象的透明度、大小、位置或...不断实践和探索,将有助于我们成为更出色的Android动画开发者。

    android Tween动画的xml实现

    Tween动画,又称补间动画,是Android提供的基础动画类型,主要用于对象的平移、旋转、缩放和透明度变化等效果。本篇文章将深入探讨如何通过XML在Android中实现Tween动画。 首先,让我们了解Tween动画的基本原理。...

    android tween动画代码示例及详解

    在Android开发中,动画是提升用户体验的关键因素之一。Tween动画,又称补间动画,是Android提供的基础动画系统...通过实践和调试这些代码,你可以掌握Android动画系统的核心概念,从而在开发中创造出更丰富的视觉效果。

    Android Tween动画源码

    Tween动画,又称平移动画,是Android提供的基础动画类型,主要用于对象的透明度、缩放、平移和旋转等属性的变化。让我们深入探讨Android Tween动画的源码,理解其工作原理。 首先,`alpha`动画涉及到的是对象的透明...

    Android动画之Tween动画实现

    Android 平台提供了两类动画。 一类是Tween动画,就是对场景里的对象不断的进行图像变化来产生动画效果(旋转、平移、放缩和渐变);第二类就是 Frame动画,即顺序的播放事先做好的图像,与gif图片原理类似。 本例子...

    Android-Anim-Playground.zip

    《Android 动画实战:Android-Anim-Playground 深入解析》 在 Android 开发中,动画是提升用户体验的重要一环。Android-Anim-Playground 是一个专门用于研究和学习 Android 动画的项目,它包含了丰富的动画示例,...

    安卓动画效果相关-android开发中的Tween动画动画演示demo。此demo为androidstudio2.0所写.rar

    通过学习和实践这个Tween动画的演示demo,开发者可以深入理解Android动画机制,为自己的应用增添生动有趣的交互体验。同时,也可以在此基础上探索更高级的动画技术,如属性动画(Property Animation)和视图动画...

    Android-Android密码动画

    2. **动画框架**:Android提供了多种动画框架,如Tween动画、帧动画以及属性动画。在密码动画中,通常会用到属性动画(Property Animation),通过改变密码输入框中字符的状态(如透明度、大小、位置等)来实现动画...

    java-universal-tween-engine,一个动画系统库

    Java Universal Tween Engine(UTEE)是一个轻量级且强大的动画系统库,专为Java和Android开发者设计,用于创建流畅、动态的2D动画效果。这个库由Aurelien Ribon开发,它允许开发者轻松地在游戏、应用或其他任何需要...

    Android 游戏开发之Tween动画的实现

    它是Android动画系统中的一个重要组件,用于执行基于属性的动画。通过`ObjectAnimator.ofFloat()`或`ObjectAnimator.ofInt()`方法,我们可以指定目标对象和要动画化的属性。例如,要让一个View平滑地移动,可以创建...

    android-flip切换界面的翻转动画效.zip

    总的来说,"android-flip切换界面的翻转动画效果"项目提供了一种在Android应用中实现翻转界面的解决方案,通过源码学习,开发者不仅可以掌握翻转动画的实现,还能深入了解Android动画机制,提升自己的开发技能。...

    tween-one:动画化一个React元素

    rc-tween-one ReactTweenOne组件 浏览器支持 IE 10以上 :check_mark: Chrome31.0+ :check_mark: Firefox 31.0+ :check_mark: Opera 30.0+ :check_mark: Safari 7.0以上 :check_mark: 发展 npm install npm ...

    swift-tween-controller用于创建交互式菜单和指南的Swift工具包

    此外,Swift-Tween-Controller还允许自定义动画行为,使开发者能够实现独特的动画设计。 在实际应用中,Swift-Tween-Controller的使用方式通常是这样的:首先,你需要导入这个库到你的项目中,然后创建一个...

    Tween 动画的旋转缩放透明度和平移 demo

    Tween动画在IT行业中,特别是在游戏开发、用户界面设计和移动应用中扮演着重要角色,它是一种平滑地改变对象属性的动画技术。Tween一词来源于英语“in-between”,意为“两者之间”,在动画领域中,它指的是在两个...

    Android-一个可连续重复变化的动画并且在重复时也能遵循自定义曲线保持速度的连续。

    标题提到的“一个可连续重复变化的动画并且在重复时也能遵循自定义曲线保持速度的连续”指的是Android中的Tween动画,特别是使用了时间插值器(TimeInterpolator)来实现的高级动画效果。 在Android中,动画分为两...

    Android-一个精致的打钩小动画模仿轻芒杂志标记已读的动画

    - 虽然Android动画系统很强大,但过度使用或设计不当可能导致性能问题。应确保只在必要时绘制,并考虑使用`View.setLayerType()`启用硬件加速。 通过以上步骤,我们可以创建出一个精致的打钩动画,模仿轻芒杂志中...

    Android-利用动画实现背景逐渐变暗

    在Android开发中,为了提升用户体验,我们经常需要创建各种动态效果。"Android-利用动画实现背景逐渐变暗...这个过程涉及到对Android动画系统的理解,以及如何将动画应用到具体视图上,是Android开发中的一个重要实践。

    Tween动画完全解析

    Tween动画是一种在图形用户界面(GUI)开发中广泛使用的动画技术,它允许开发者在两个或多个属性值之间平滑地过渡,从而创建出流畅的视觉效果。Tween动画通常用于移动应用、网页、游戏以及各种软件的用户界面中,以...

    Android基础——Tween动画、Drawable动画、Property动画、MaterialDesign动画、Trasition动画

    综上所述,Android动画系统为开发者提供了多种方式来增强应用的视觉表现力。Tween动画适合简单的动画需求,Drawable动画适合创建帧动画,Property动画则提供了强大的属性动画功能,Material Design动画则为应用带来...

Global site tag (gtag.js) - Google Analytics