登录 立即注册
安币:

安卓巴士 - 安卓开发 - Android开发 - 安卓 - 移动互联网门户

Animation动画 [复制链接]

2016-3-24 09:20
zml_2015 阅读:4663 评论:3 赞:0
Tag:  动画

首先介绍一下Animation:

1.Animation 动画类型

Android的animation由四种类型组成:

XML中

alph渐变透明度动画效果
scale渐变尺寸伸缩动画效果
translate画面转换位置移动动画效果
rotate画面转移旋转动画效果

 

 

 

 

 

JavaCode中

AlphaAnimation渐变透明度动画效果
ScaleAnimation渐变尺寸伸缩动画效果
TranslateAnimation画面转换位置移动动画效果
RotateAnimation画面转移旋转动画效果

 

 

 

 

 2.Android动画模式

Animation主要有两种动画模式:

一种是tweened animation(渐变动画)

XML中JavaCode
alphaAlphaAnimation
scaleScaleAnimation

 

 

 

一种是frame by frame(画面转换动画)

XML中JavaCode
translateTranslateAnimation
rotateRotateAnimation

 

 

 

下面我们将用Java代码来实现这些动画,并且,可以通过手动输入参数去改变动画;

先看效果图:

 

我将四种动画写在了一个工具类中(注释的很详细了)

AnimationTools.java:

[mw_shl_code=java,true]package com.soft.util; 

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.view.animation.TranslateAnimation; 

/** 
* @author 郑明亮 
* @date 2015-11-11 下午9:39:33 
* @version 1.0 
*/ 
public class AnimationTools { 

/** 
* @param fromAlpha 
* 开始的透明度 
* @param toAlpha 
* 到大的透明度 
* @param durationMillis 
* 动画持续时间 
* @return 
*/ 
public static AnimationSet alphaAnimation(float fromAlpha, float toAlpha, 
long durationMillis) { 
// true表示使用Animation的interpolator,false则是使用自己的 
AnimationSet set = new AnimationSet(true); 

Animation alpha = new AlphaAnimation(fromAlpha, toAlpha); 

alpha.setDuration(durationMillis); 
set.addAnimation(alpha); 
return set; 



/** 
* @param fromDegrees 
* :从哪个旋转角度开始 
* @param toDegrees 
* :转到什么角度 
* @param pivotXValue 
* : x轴的值,0.5f表明是以自身这个控件的一半长度为x轴 
* @param pivotYValue 
* :y轴的值,0.5f表明是以自身这个控件的一半长度为y轴 
* @param durationMillis 
* 动画持续时间 
* @return AnimationSet 
*/ 
public static AnimationSet rotateAnimation(float fromDegrees, 
float toDegrees, float pivotXValue, float pivotYValue, 
long durationMillis) { 
AnimationSet set = new AnimationSet(true); 

// Animation.RELATIVE_TO_SELF==1; 
// Animation.RELATIVE_TO_PARENTS==2; 
// 后4个参数用于设置围绕着旋转的圆的圆心在哪里 
Animation rotate = new RotateAnimation(fromDegrees, toDegrees, 1, 
pivotXValue, 1, pivotYValue); 
rotate.setDuration(durationMillis); 
set.addAnimation(rotate); 
return set; 


/** 
* @param fromX 
* x轴的初始值 
* @param toX 
* x轴收缩后的值 
* @param fromY 
* y轴的初始值 
* @param toY 
* y轴收缩后的值 
* @param pivotXValue 
* x轴的值,0.5f表明是以自身这个控件的一半长度为x轴 
* @param pivotYValue 
* y轴的值,0.5f表明是以自身这个控件的一半长度为y轴 
* @param durationMillis 
* 动画持续时间 
* @return AnimationSet 
*/ 
public static AnimationSet scaleAnimation(float fromX, float toX, 
float fromY, float toY, float pivotXValue, float pivotYValue, 
long durationMillis) { 
AnimationSet set = new AnimationSet(true); 

// Animation.RELATIVE_TO_SELF==1; 
// Animation.RELATIVE_TO_PARENTS==2; 
Animation sacle = new ScaleAnimation(fromX, toX, fromY, toY, 1, 
pivotXValue, 1, pivotYValue); 
sacle.setDuration(durationMillis); 
set.addAnimation(sacle); 
return set; 


/** 
* @param fromXValue 
* x轴的开始位置 
* @param toXValue 
* x轴的结束位置 
* @param fromYValue 
* y轴的开始位置 

* @param toYValue 
* y轴的结束位置 
* @param durationMillis 
* 动画持续时间 
* @return AnimationSet 
*/ 
public static AnimationSet translateAnimation(float fromXValue, 
float toXValue, float fromYValue, float toYValue, 
long durationMillis) { 
AnimationSet set = new AnimationSet(true); 

// Animation.RELATIVE_TO_SELF==1; 
// Animation.RELATIVE_TO_PARENTS==2; 
Animation translate = new TranslateAnimation(1, fromXValue, 1, 
toXValue, 1, fromYValue, 1, toYValue); 
translate.setDuration(durationMillis); 
set.addAnimation(translate); 
return set; 



[/mw_shl_code]

布局文件main.xml

[mw_shl_code=java,true]

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" > 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="vertical" 
tools:context="com.zml.animation.MainActivity" > 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" > 

<EditText 
android:id="@+id/editText1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="持续时间(ms)" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/editText2" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="开始状态(0~1)" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/editText3" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="终止状态(0~1)" 
android:numeric="decimal" > 

<requestFocus /> 
</EditText> 
</LinearLayout> 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" > 

<EditText 
android:id="@+id/et_rotate1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="旋转角度开始" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_rotate2" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="旋转角度结束" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_rotate3" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="x轴的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_rotate4" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="y轴的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_rotate5" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="持续时间" 
android:numeric="decimal" /> 
</LinearLayout> 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" > 

<EditText 
android:id="@+id/et_scale1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="X轴初值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale2" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="X收缩后的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale3" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="Y轴初值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale4" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="Y收缩后的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale5" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="x轴位置" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale6" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="y轴位置" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_scale7" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="时间" 
android:numeric="decimal" /> 
</LinearLayout> 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" > 

<EditText 
android:id="@+id/et_trans1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="X轴初值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_trans2" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="X移动后的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_trans3" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="Y轴初值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_trans4" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="Y移动后的值" 
android:numeric="decimal" /> 

<EditText 
android:id="@+id/et_trans5" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:layout_weight="1" 
android:ems="10" 
android:hint="时间" 
android:numeric="decimal" /> 
</LinearLayout> 

<LinearLayout 
android:layout_width="match_parent" 
android:layout_height="wrap_content" > 

<Button 
android:id="@+id/alphaButton" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="淡入淡出" /> 

<Button 
android:id="@+id/rotateButton" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="旋转" /> 

<Button 
android:id="@+id/scaleButton" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="缩放" /> 

<Button 
android:id="@+id/translateButton" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:text="移动" /> 
</LinearLayout> 

<ImageView 
android:id="@+id/imageView1" 
android:layout_width="wrap_content" 
android:layout_height="wrap_content" 
android:src="@drawable/dog" /> 
</LinearLayout> 

</ScrollView>
[/mw_shl_code]

主页面管理文件(注释虽然比较少,但是写的还是比较简单明了的)

MainActivity.java

 [mw_shl_code=java,true]

[java] view plain copy
<span style="font-size:18px;">package com.zml.animation; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.widget.Button; 
import android.widget.EditText; 
import android.widget.ImageView; 
import android.widget.Toast; 

import com.soft.util.AnimationTools; 

public class MainActivity extends Activity implements OnClickListener { 
private Button alphaButton = null; 
private Button rotateButton = null; 
private Button scaleButton = null; 

private Button translateButton = null; 
private EditText et_alpha1, et_alpha2, et_alpha3, et_rotate1, et_rotate2, 
et_rotate3, et_rotate4, et_rotate5, et_scale1, et_scale2, 
et_scale3, et_scale4, et_scale5, et_scale6, et_scale7, et_trans1, 
et_trans2, et_trans3, et_trans4, et_trans5; 
private ImageView iv_show; 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 
setContentView(R.layout.activity_main); 
alphaButton = (Button) findViewById(R.id.alphaButton); 
rotateButton = (Button) findViewById(R.id.rotateButton); 
scaleButton = (Button) findViewById(R.id.scaleButton); 
translateButton = (Button) findViewById(R.id.translateButton); 
alphaButton.setOnClickListener(this); 
rotateButton.setOnClickListener(this); 
scaleButton.setOnClickListener(this); 
translateButton.setOnClickListener(this); 

et_alpha1 = (EditText) findViewById(R.id.editText1); 
et_alpha2 = (EditText) findViewById(R.id.editText2); 
et_alpha3 = (EditText) findViewById(R.id.editText3); 

et_rotate1 = (EditText) findViewById(R.id.et_rotate1); 
et_rotate2 = (EditText) findViewById(R.id.et_rotate2); 
et_rotate3 = (EditText) findViewById(R.id.et_rotate3); 
et_rotate4 = (EditText) findViewById(R.id.et_rotate4); 
et_rotate5 = (EditText) findViewById(R.id.et_rotate5); 

et_scale1 = (EditText) findViewById(R.id.et_scale1); 
et_scale2 = (EditText) findViewById(R.id.et_scale2); 
et_scale3 = (EditText) findViewById(R.id.et_scale3); 
et_scale4 = (EditText) findViewById(R.id.et_scale4); 
et_scale5 = (EditText) findViewById(R.id.et_scale5); 
et_scale6 = (EditText) findViewById(R.id.et_scale6); 
et_scale7 = (EditText) findViewById(R.id.et_scale7); 

et_trans1 = (EditText) findViewById(R.id.et_trans1); 
et_trans2 = (EditText) findViewById(R.id.et_trans2); 
et_trans3 = (EditText) findViewById(R.id.et_trans3); 
et_trans4 = (EditText) findViewById(R.id.et_trans4); 
et_trans5 = (EditText) findViewById(R.id.et_trans5); 

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



@Override 
public void onClick(View arg0) { 
switch (arg0.getId()) { 
case R.id.alphaButton: 
if (et_alpha1.getText().toString().isEmpty() 
|| et_alpha2.getText().toString().isEmpty() 
|| et_alpha3.getText().toString().isEmpty()) 
Toast.makeText(MainActivity.this, "淡入淡出内容未填完整", 0).show(); 
else { 
float fromAlpha = Float.parseFloat(et_alpha2.getText() 
.toString()); 
float toAlpha = Float 
.parseFloat(et_alpha3.getText().toString()); 
long durationMillis = Long.parseLong(et_alpha1.getText() 
.toString()); 

iv_show.startAnimation(AnimationTools.alphaAnimation(fromAlpha, 
toAlpha, durationMillis)); 

break; 
case R.id.rotateButton: 
if (et_rotate1.getText().toString().isEmpty() 
|| et_rotate2.getText().toString().isEmpty() 
|| et_rotate3.getText().toString().isEmpty() 
|| et_rotate4.getText().toString().isEmpty() 
|| et_rotate5.getText().toString().isEmpty()) 
Toast.makeText(MainActivity.this, "旋转内容未填完整", 0).show(); 
else { 
float fromDegrees = Float.parseFloat(et_rotate1.getText() 
.toString()); 
float toDegrees = Float.parseFloat(et_rotate2.getText() 
.toString()); 
float pivotXValue = Float.parseFloat(et_rotate3.getText() 
.toString()); 
float pivotYValue = Float.parseFloat(et_rotate4.getText() 
.toString()); 
long rdurationMillis = Long.parseLong(et_rotate5.getText() 
.toString()); 
iv_show.startAnimation(AnimationTools.rotateAnimation( 
fromDegrees, toDegrees, pivotXValue, pivotYValue, 
rdurationMillis)); 

break; 
case R.id.scaleButton: 
if (et_scale1.getText().toString().isEmpty() 
|| et_scale2.getText().toString().isEmpty() 
|| et_scale3.getText().toString().isEmpty() 
|| et_scale4.getText().toString().isEmpty() 
|| et_scale5.getText().toString().isEmpty() 
|| et_scale6.getText().toString().isEmpty() 
|| et_scale7.getText().toString().isEmpty()) 
Toast.makeText(MainActivity.this, "收缩内容未填完整", 0).show(); 
else { 
float fromX = Float.parseFloat(et_scale1.getText().toString()); 
float toX = Float.parseFloat(et_scale2.getText().toString()); 
float fromY = Float.parseFloat(et_scale3.getText().toString()); 
float toY = Float.parseFloat(et_scale4.getText().toString()); 
float spivotXValue = Float.parseFloat(et_scale5.getText() 
.toString()); 
float spivotYValue = Float.parseFloat(et_scale6.getText() 
.toString()); 
long sdurationMillis = Long.parseLong(et_scale7.getText() 
.toString()); 
iv_show.startAnimation(AnimationTools.scaleAnimation(fromX, 
toX, fromY, toY, spivotXValue, spivotYValue, 
sdurationMillis)); 

break; 
case R.id.translateButton: 
if (et_trans1.getText().toString().isEmpty() 
|| et_trans2.getText().toString().isEmpty() 
|| et_trans3.getText().toString().isEmpty() 
|| et_trans4.getText().toString().isEmpty() 
|| et_trans5.getText().toString().isEmpty()) 
Toast.makeText(MainActivity.this, "收缩内容未填完整", 0).show(); 
else { 
float fromXValue = Float.parseFloat(et_trans1.getText() 
.toString()); 
float toXValue = Float.parseFloat(et_trans2.getText() 
.toString()); 
float fromYValue = Float.parseFloat(et_trans3.getText() 
.toString()); 
float toYValue = Float.parseFloat(et_trans4.getText() 
.toString()); 
long tsdurationMillis = Long.parseLong(et_trans5.getText() 
.toString()); 
iv_show.startAnimation(AnimationTools.translateAnimation( 
fromXValue, toXValue, fromYValue, toYValue, 
tsdurationMillis)); 

break; 
default: 
break; 






[/mw_shl_code]
分享到:
我来说两句
facelist
您需要登录后才可以评论 登录 | 立即注册
所有评论(3)
吾心常在 2016-3-24 18:17
   奋斗
回复
witonstone 2016-3-28 16:52
学习学习
回复
zml_2015 2016-4-19 18:11
谢谢
回复

站长推荐

通过邮件订阅最新安卓weekly信息
上一条 /4 下一条

下载安卓巴士客户端

全国最大的安卓开发者社区

广告投放| 下载客户端|申请友链|手机版|站点统计|安卓巴士 ( 粤ICP备15117877号 )

返回顶部