android 之 animations 动画
android 提供的了两种机制你可以用来创建简单的动画:tweedned animation(渐变动画) 和 frame-by-frame animation(逐帧动画)(有道翻译的,汗!!!) 。这里主要介绍tweedned animation中的四种动画形式:alpha(淡入淡出效果)、scale(放缩)、rotate(旋转) 、translate(平移)。
那么怎么来实现这样的效果呢?大家向下看:(这里是在代码内部实现,虽然容易看,但是不利于维护和重用,下面还会介绍一种在外部实现的方法)
内部实现:
1.创建一个AnimationSet对象
2.创建一个你想要实现效果的Animation对象,如AlphaAnimations
3.为动画设置一些属性
4.将alpha对象加入到AnimationSet中
5.对图片开始执行AnimationSet
private class alphaButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
//建立一个AnimationSet对象
AnimationSet animationSet = new AnimationSet(true);
//创建一个AlphaAnimation对象,设置透明度为由1到0
AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
//设置整个动画持续的时间
alphaAnimation.setDuration(10000);
//将Animation对象添加到animationSet对象中
animationSet.addAnimation(alphaAnimation);
//对图片开始执行AnimationSet
imagView.startAnimation(animationSet);
}
}
=========================
这里介绍一些常用的动画属性的设置
- setDuration(long durationMillis):用于设置动画的持续时间,单位是毫秒。
- setFillAfter:设置为true后,该动画专化在动画结束后应用,也就是说,动画将会停留在结束时的状态
- setFillBefore:设置为true后,在动画开始前应用动画转化。(这个系统默认是设置为true的)(这个我有点不太懂,网上有的说是设置动画完成后回到起始位置,好像不太对,如果你知道的话,一定要留言告诉我)
- setStartOffset:设置当发出开始动画的指令后经过多长时间开始执行动画
- setRepeatMode:设置动画的重复次数
===========================
下面是具体的ManiActivity.java代码,对各个动画都有详细的解释:
package com.mecury.animationstest;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
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;
import android.widget.Button;
import android.widget.ImageView; public class MainActivity extends Activity { private ImageView imagView;
private Button alphaButton;
private Button scaleButton;
private Button rotateButton;
private Button translateButton; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); imagView = (ImageView) findViewById(R.id.imageView);
alphaButton = (Button) findViewById(R.id.alphaButton);
alphaButton.setOnClickListener(new alphaButtonListener());
scaleButton = (Button) findViewById(R.id.scaleButton);
scaleButton.setOnClickListener(new scaleButtonListener());
rotateButton = (Button) findViewById(R.id.rotateButton);
rotateButton.setOnClickListener(new rotateButtonListener());
translateButton = (Button) findViewById(R.id.translateButton);
translateButton.setOnClickListener(new translateButtonListener());
} /*
* 淡入淡出效果
*/
private class alphaButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
//建立一个AnimationSet对象
AnimationSet animationSet = new AnimationSet(true);
//创建一个AlphaAnimation对象,设置透明度为由1到0
AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);
//设置整个动画持续的时间
alphaAnimation.setDuration(10000);
//将Animation对象添加到animationSet对象中
animationSet.addAnimation(alphaAnimation);
//对图片开始执行AnimationSet
imagView.startAnimation(animationSet);
}
} /*
* 缩放效果
*/
private class scaleButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
AnimationSet animationSet = new AnimationSet(true);
/*这里用的是百分比表示法,f表示浮点型
* 四个参数代表缩放的比例,前两个代表了x轴的缩放(这里用的是百分比表示法:1f代表原来的宽度,0.5f代表原来宽度的一半)后两个代表了y轴的缩放
* Animation中有两个常用的属性,RELATIVE_TO_SELF(依赖自身),RELATIVE_TO_PARENT(依赖父控件)
* 后面四个表明缩放的轴为依赖自身的在x为0.5f,y为0.5f的地方
*/
ScaleAnimation scaleAnimation = new ScaleAnimation(1f, 0.1f, 1f, 0.1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
animationSet.addAnimation(scaleAnimation);
animationSet.setDuration(2000); imagView.startAnimation(animationSet);
}
} /*
* 旋转效果
*/
private class rotateButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
AnimationSet animationSet = new AnimationSet(true);
/*第一个参数,表示图片相对于起始位置的角度,
*第二个参数:表示动画结束时图片的偏转角度。这里就是由0变到360即原点
*后面的四个参数是为了设置图片旋转围绕的轴,意思是轴的横坐标是依赖父控件的0f处,纵坐标是依赖父控件的-1f处
*这里要着中说的是:关于坐标的问题。这这个动画中,坐标原点是图片的左上角,原点左x轴和下y轴代表正轴
*此时的围绕的点的坐标轴就在图片的正上方
*/
RotateAnimation rotateAnimation = new RotateAnimation(0, 360, Animation.RELATIVE_TO_PARENT, 0f, Animation.RELATIVE_TO_PARENT, -1f);
rotateAnimation.setDuration(2000);
animationSet.addAnimation(rotateAnimation);
imagView.startAnimation(animationSet);
}
} /*
* 移动效果
*/
private class translateButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
AnimationSet animationSet = new AnimationSet(true);
/*
* 前两个参数决定了动画开始时图片的x轴起始位置
* 第三四个参数表示图片将要到达位置的x轴
* 后面四个是表示y轴的和上面类似
* 代码中表示:由起始位置位移到右上角
*/
TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f,
Animation.RELATIVE_TO_PARENT, 1f,
Animation.RELATIVE_TO_SELF,0f,
Animation.RELATIVE_TO_PARENT, -1f);
translateAnimation.setDuration(2000);
animationSet.addAnimation(translateAnimation);
imagView.startAnimation(animationSet);
}
}
}
下面是我的布局文件:
<RelativeLayout 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"
tools:context="com.mecury.animationstest.MainActivity" > <Button
android:id="@+id/translateButton"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_alignParentBottom="true"
android:text="Translate平移"/>
<Button
android:id="@+id/rotateButton"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_above="@id/translateButton"
android:text="Rotate旋转"/>
<Button
android:id="@+id/scaleButton"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_above="@id/rotateButton"
android:text="Scale缩放"/>
<Button
android:id="@+id/alphaButton"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_above="@id/scaleButton"
android:text="Alpha淡入淡出"/> <ImageView
android:id="@+id/imageView"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:src="@drawable/china"/> </RelativeLayout>
在外部资源中实现:
1.在res文件中新建一个名为anim的文件
2.在文件中中新建.xml文件(这里以alpha为例),如alpha.xml
3.在文件中设置相应的属性
4.使用AnimationUtils来装载动画设置文件
这里我的anim中四个动画代码文件:
<?xml version="1.0" encoding="utf-8"?>
<!-- aplha是一个淡入淡出的效果
startOffser时间偏移量,在动画开始之前,停顿500毫秒 -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
android:fromAlpha="1"
android:toAlpha="0"
android:startOffset="500"
android:duration="2000"/>
</set> <?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<!-- scale是实现缩放
privat 是设置缩放围绕的轴的缩放
privatX="50"使用的是绝对位置
="%50"相对控件本身定位,在控件的1/2处
="50%p" 相对于父控件的位置定位-->
<scale
android:fromXScale="1"
android:toXScale="0.1"
android:fromYScale="1"
android:toYScale="0.1"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="500"
android:duration="2000"/> </set> <?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<rotate
android:fromDegrees="0"
android:toDegrees="+360"
android:pivotX="100%p"
android:pivotY="0%p"
android:startOffset="500"
android:duration="2000"/>
</set> <?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:fromXDelta="0%"
android:toXDelta="100%p"
android:fromYDelta="0%"
android:toYDelta="-100%p"
android:interpolator="@android:anim/decelerate_interpolator"
android:startOffset="500"
android:duration="30000"
/> </set>
intepolator是用来设置动画执行的速度
Accelerate_Decelerate_Interpolator:在动画开始和结束时速率较慢,中间加速
Accelerate_Interpolator:在动画开始的时候速度较慢,逐渐加速
Cycle_Interpolator:速度改变沿着动画循环播放的次数,以正弦曲线式变化
Deceletrate_Interpolator:在的动画开始是速度改变比较慢,然后突然减速
Linear_Interpolator:动画匀速改变
使用:android:Interpolator="@android:anim/....."
mianActivity.java:
package com.example.animation_01; import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView; public class MainActivity extends Activity { private ImageView imagView;
private Button alphaButton;
private Button scaleButton;
private Button rotateButton;
private Button translateButton;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imagView = (ImageView) findViewById(R.id.imageView);
alphaButton = (Button) findViewById(R.id.alphaButton);
alphaButton.setOnClickListener(new alphaButtonListener());
scaleButton = (Button) findViewById(R.id.scaleButton);
scaleButton.setOnClickListener(new scaleButtonListener());
rotateButton = (Button) findViewById(R.id.rotateButton);
rotateButton.setOnClickListener(new rotateButtonListener());
translateButton = (Button) findViewById(R.id.translateButton);
translateButton.setOnClickListener(new translateButtonListener());
} class alphaButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
//使用AnimaionUtils来装载动画设置文件
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.alpha);
imagView.startAnimation(animation);
}
}
class scaleButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.scale);
imagView.startAnimation(animation);
}
}
class rotateButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate);
imagView.startAnimation(animation);
}
}
class translateButtonListener implements OnClickListener{ @Override
public void onClick(View v) {
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate);
imagView.startAnimation(animation);
}
} }
布局文件和第一个一样。
android 之 animations 动画的更多相关文章
- 有趣的动画视图集合:Android View Animations
Android View Animations这个项目收集了各种有趣的动画效果. 所有效果: Attension Flash, Pulse, RubberBand, Shake, Swing, Wob ...
- Android 三种动画详解
[工匠若水 http://blog.csdn.net/yanbober 转载请注明出处.点我开始Android技术交流] 1 背景 不能只分析源码呀,分析的同时也要整理归纳基础知识,刚好有人微博私信让 ...
- Android立体旋转动画实现与封装(支持以X、Y、Z三个轴为轴心旋转)
本文主要介绍Android立体旋转动画,或者3D旋转,下图是我自己实现的一个界面 立体旋转分为以下三种: 1. 以X轴为轴心旋转 2. 以Y轴为轴心旋转 3. 以Z轴为轴心旋转--这种等价于andro ...
- Android中矢量动画
Android中矢量动画 Android中用<path> 标签来创建SVG,就好比控制着一支画笔,从一点到一点,动一条线. <path> 标签 支持一下属性 M = (Mx, ...
- Android Animation(动画)
前言 Android 平台提供实现动画的解决方案(三种) 一.3.0以前,android支持两种动画: (1)Frame Animation:顺序播放事先做好的图像,与gif图片原理类似,是一种逐帧动 ...
- android 补间动画和Animation
介绍: 补间动画是一种设定动画开始状态.结束状态,其中间的变化由系统计算补充.这也是他叫做补间动画的原因. 补间动画由Animation类来实现具体效果,包括平移(TranslateAnimation ...
- Android中过场动画
overridePendingTransition(R.anim.slide_in_right,R.anim.slide_out_left); 第一参数为进入的动画 第二参数为退出的动画 进入的动画 ...
- Android 自定义波浪动画 --"让进度浪起来~"
原文链接:http://www.jianshu.com/p/0e25a10cb9f5 一款效果不错的动画,实现也挺简单的,推荐阅读学习~ -- 由 傻小孩b 分享 waveview <Andro ...
- Android自定义窗口动画
第一步,设置出现和消失的xml 1.在res/anim下创建enter_anim.xml,设置窗口出现的动画 <?xml version="1.0" encoding=&qu ...
随机推荐
- AutoMapper用法一瞥
前段时候做个小项目用到了autoMapper(参考了NOP里的用法),感觉还行,用起来挺方便的.首先复杂的东西我就不说了,至于详细的教程我也就不写了,比较园子里有很多这样的文章,我就分享下,在项目中实 ...
- NOP登录验证管理
截取Nop登录代码如下: 其实 public ActionResult Login(LoginModel model, string returnUrl, bool captchaValid) { / ...
- 伸展树(二)之 C++的实现
概要 上一章介绍了伸展树的基本概念,并通过C语言实现了伸展树.本章是伸展树的C++实现,后续再给出Java版本.还是那句老话,它们的原理都一样,择其一了解即可. 目录1. 伸展树的介绍2. 伸展树的C ...
- 三元组表压缩存储稀疏矩阵实现稀疏矩阵的快速转置(Java语言描述)
三元组表压缩存储稀疏矩阵实现稀疏矩阵的快速转置(Java语言描述) 用经典矩阵转置算法和普通的三元组矩阵转置在时间复杂度上都是不乐观的.快速转置算法在增加适当存储空间后实现快速转置具体原理见代码注释部 ...
- 移动端页面使用单位的问题:关于px、百分比、em、rem开发中逐渐转换的问题记录
开始写前端页面也有了快两年时间,从一开始的懵逼到现在的淡定,但是不能改变我还是一只小菜鸟的事实,平时遇到的一些问题都会记录在文件夹里,现在都整理一下大家一起分享自己平时也翻翻看看~ 不知道大家平时写的 ...
- 1215 spring 3 项目更新
列志华 (组长) http://www.cnblogs.com/liezhihua/ 团队guihub https://github.com/LWHTF/OrderingFood 黄柏堂 http:/ ...
- java的poi技术下载Excel模板上传Excel读取Excel中内容(SSM框架)
使用到的jar包 JSP: client.jsp <%@ page language="java" contentType="text/html; charset= ...
- MIUI选项框开关样式模拟
有IOS的开关模拟,当然也有MIUI的开关模拟 看到设置选项里面的开关样式,突发奇想地来试试 最终效果如图: 实现过程 1. 选项框checkbox 模拟开关当然需要一个选项框,这里用到了复选框 ...
- Array 数组常用方法
(1)基本的数组方法 1.join() Array.join()方法将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串.可以自己指定分隔的符号,如果不指定,默认使用逗号 var arr ...
- jQuery实现星星评分功能
一.这是我做的调查问卷中的一个功能.(第三方MVC框架) 二.功能说明:1.用户点击星星,将值放到隐藏域中.2.用户可以重新点击星星修改回答. 前台JS代码: <script type=&quo ...