Android中使用抖动动画吸引来用户注意
原文:http://www.androidcn.org/topic/552e65bc61d460226ab27a5c
在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按钮,为了能够吸引用户主动点击而且不过分的打扰用户,最好的方法就是给我们想吸引用户注意的view添加一些抖动动画,比如这张图
这里我主要实现了两种抖动动画,左右抖动和上下抖动。左右抖动通常用于表单验证失败的时候,上下抖动通常用于吸引用于用户去点击。动画主要使用了Keyframe和PropertyValuesHolder。
Keyframe是一个时间/值对,用于定义在某个时刻动画的状态。比如Keyframe.ofInt(.5f, Color.RED)定义了当动画进行了50%的时候,颜色的值应该是Color.RED。
PropertyValuesHolder保存了view的属性的信息以及在动画进行过程中该属性的值。通过 PropertyValuesHolder.ofKeyframe方法来构建PropertyValuesHolder的实例,改方法接收一个属性名以及 多个Keyframe对象作为参数。当你想通过动画改变多个属性的时候PropertyValuesHolder就非常有用。
直接上代码:
tada方法实现了上下抖动。抖动的原理很简单,就是对view的x轴和y轴进行0.9倍到1.1倍的缩放,同时对view进行一定角度的上下旋转。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
public static ObjectAnimator tada(View view) { return tada(view, 1f); } public static ObjectAnimator tada(View view, float shakeFactor) { PropertyValuesHolder pvhScaleX = PropertyValuesHolder.ofKeyframe(View.SCALE_X, Keyframe.ofFloat(0f, 1f), Keyframe.ofFloat(.1f, .9f), Keyframe.ofFloat(.2f, .9f), Keyframe.ofFloat(.3f, 1.1f), Keyframe.ofFloat(.4f, 1.1f), Keyframe.ofFloat(.5f, 1.1f), Keyframe.ofFloat(.6f, 1.1f), Keyframe.ofFloat(.7f, 1.1f), Keyframe.ofFloat(.8f, 1.1f), Keyframe.ofFloat(.9f, 1.1f), Keyframe.ofFloat(1f, 1f) ); PropertyValuesHolder pvhScaleY = PropertyValuesHolder.ofKeyframe(View.SCALE_Y, Keyframe.ofFloat(0f, 1f), Keyframe.ofFloat(.1f, .9f), Keyframe.ofFloat(.2f, .9f), Keyframe.ofFloat(.3f, 1.1f), Keyframe.ofFloat(.4f, 1.1f), Keyframe.ofFloat(.5f, 1.1f), Keyframe.ofFloat(.6f, 1.1f), Keyframe.ofFloat(.7f, 1.1f), Keyframe.ofFloat(.8f, 1.1f), Keyframe.ofFloat(.9f, 1.1f), Keyframe.ofFloat(1f, 1f) ); PropertyValuesHolder pvhRotate = PropertyValuesHolder.ofKeyframe(View.ROTATION, Keyframe.ofFloat(0f, 0f), Keyframe.ofFloat(.1f, -3f * shakeFactor), Keyframe.ofFloat(.2f, -3f * shakeFactor), Keyframe.ofFloat(.3f, 3f * shakeFactor), Keyframe.ofFloat(.4f, -3f * shakeFactor), Keyframe.ofFloat(.5f, 3f * shakeFactor), Keyframe.ofFloat(.6f, -3f * shakeFactor), Keyframe.ofFloat(.7f, 3f * shakeFactor), Keyframe.ofFloat(.8f, -3f * shakeFactor), Keyframe.ofFloat(.9f, 3f * shakeFactor), Keyframe.ofFloat(1f, 0) ); return ObjectAnimator.ofPropertyValuesHolder(view, pvhScaleX, pvhScaleY, pvhRotate). setDuration(1000); } |
nope方法实现了左右抖动。左右抖动的原理就是对view进行x轴的平移。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
public static ObjectAnimator nope(View view) { int delta = view.getResources().getDimensionPixelOffset(R.dimen.spacing_medium); PropertyValuesHolder pvhTranslateX = PropertyValuesHolder.ofKeyframe(View.TRANSLATION_X, Keyframe.ofFloat(0f, 0), Keyframe.ofFloat(.10f, -delta), Keyframe.ofFloat(.26f, delta), Keyframe.ofFloat(.42f, -delta), Keyframe.ofFloat(.58f, delta), Keyframe.ofFloat(.74f, -delta), Keyframe.ofFloat(.90f, delta), Keyframe.ofFloat(1f, 0f) ); return ObjectAnimator.ofPropertyValuesHolder(view, pvhTranslateX). setDuration(500); } |
参考:
https://plus.google.com/+CyrilMottier/posts/FABaJhRMCuy
http://developer.android.com/reference/android/animation/PropertyValuesHolder.html
http://developer.android.com/guide/topics/graphics/prop-animation.html
Android中使用抖动动画吸引来用户注意的更多相关文章
- android中设置Animation 动画效果
在 Android 中, Animation 动画效果的实现可以通过两种方式进行实现,一种是 tweened animation 渐变动画,另一种是 frame by frame animation ...
- Android设置View抖动动画
在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按钮,为了能够吸引用户主动点击而且不过分的打扰用户,最好的方法就是给我们想吸引用户注意的view添加一些抖动动画,比如这张图 这里我主要 ...
- Android中的帧动画与补间动画的使用
前言 在日常开发中,我们有时候须要一些好看的动画效果,这时能够充分利用Android提供的这几种动画来实现. Android提供了3种类型的动画: 补间动画:补间动画能够应用于View,让你能够定义一 ...
- Android(java)学习笔记199:Android中补间动画(Tween Animation)
本文主要简单介绍补间动画使用代码实现, 关于使用xml实现补间动画,可以参看:自定义控件三部曲之动画篇(一)——alpha.scale.translate.rotate.set的xml属性及用法 1. ...
- 在Android中显示GIF动画
gif图动画在android中还是比较常用的,比如像新浪微博中,有很多gif图片,而且展示非常好,所以我也想弄一个.经过我多方的搜索资料和整理,终于弄出来了,其实github上有很多开源的gif的展示 ...
- 【转】[置顶] 在Android中显示GIF动画
gif图动画在Android中还是比较常用的,比如像新浪微博中,有很多gif图片,而且展示非常好,所以我也想弄一个.经过我多方的搜索资料和整理,终于弄出来了,其实github上有很多开源的gif的展示 ...
- Android(java)学习笔记142:Android中补间动画(Tween Animation)
本文主要简单介绍补间动画使用代码实现, 关于使用xml实现补间动画, 可以参看:自定义控件三部曲之动画篇(一)——alpha.scale.translate.rotate.set的xml属性及用法 1 ...
- Android中的布局动画
简介 布局动画是给布局的动画,会影响到布局中子对象 使用方法 给布局添加动画效果: 先找到要设置的layout的id,然后创建布局动画,创建一个LayoutAnimationController,并把 ...
- Android 中如何使用动画
1:首先在res/anim/文件夹下建立动画xml文件. 2:在java代码中对UI控件使用动画. //加载动画 Animation myAnim=AnimationUtils.loadAnimati ...
随机推荐
- ruby -- 进阶学习(五)使用Ckeditor插件上传中文图片
基于rails4.0环境 当使用Ckeditor上传中文命名图片时报错,解决方法是对图片进行重命名 在Ckeditor插件的安装目录下找到controllers/.../application.rb ...
- bootstrap插件学习-bootstrap.typehead.js
先看bootstrap.typehead.js的结构 var Typeahead = function ( element, options ){} //构造器 Typeahead.prototype ...
- JS微信分享不好写?来封装一下
微信开发这块,作为开发工程师来说,一般是避免不了的,也好像发现一些朋友写微信分享都是在每个页面一大把一大把的代码. 代码冗余,即便是复制过来再改也很麻烦. 之前自己封装了一下js,今天来分享一下,希望 ...
- django 快速实现登录
前言 对于web开来说,用户登陆.注册.文件上传等是最基础的功能,针对不同的web框架,相关的文章非常多,但搜索之后发现大多都不具有完整性,对于想学习web开发的新手来说不具有很强的操作性:对于web ...
- Origami – 用于 Quartz 的免费的交互设计框架
Origami 是一个为 Quartz Composer 开发的免费的工具包——由Facebook设计团队创建,让交互设计原型更加简单,不需要编程. 如今,大多数设计师通过创建静态原型来表达要实现的应 ...
- Java sun.misc.Unsafe类的学习笔记
Java未开源的Unsafe类 Unsafe类可以为我们提供高效并且线程安全方式操作变量,直接和内存数据打交道. 获取Unsafe实体的方法 private static Unsafe getUnsa ...
- [New Portal]Windows Azure Virtual Machine (10) 自定义Windows Azure Virtual Machine模板
<Windows Azure Platform 系列文章目录> 通过之前的文章,我相信大家对微软Windows Azure Virtual Machine有一定的了解了. 虽然微软提供了非 ...
- 深入浅出 JavaScript 中的 this
在 Java 等面向对象的语言中,this 关键字的含义是明确且具体的,即指代当前对象.一般在编译期确定下来,或称为编译期绑定.而在 JavaScript 中,this 是动态绑定,或称为运行期绑定的 ...
- IntelliTrace简介
解决无法复现bug所使用的策略是在遇到bug时捕获尽可能多的信息,在使用IntelliTrace进行调试时可以充分利用这些信息.最令人称道的一个功能在于bug本身可以自动修复. 打开IntelliTr ...
- php配合jquery实现增删操作
后台使用php,前台引用jquery,实现增删操作,代码如下: <script type="text/javascript" src="http://keleyi. ...