Android中使用抖动动画吸引来用户注意

转载 2015年07月09日 21:41:13

原文: http://www.androidcn.org/topic/552e65bc61d460226ab27a5c 

在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按钮,为了能够吸引用户主动点击而且不过分的打扰用户,最好的方法就是给我们想吸引用户注意的view添加一些抖动动画,比如这张图

FjtP7UNDsl59F1w6Lvxju74i4LHz.gif

这里我主要实现了两种抖动动画,左右抖动和上下抖动。左右抖动通常用于表单验证失败的时候,上下抖动通常用于吸引用于用户去点击。动画主要使用了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);  }

GitHub demo地址

参考:

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中使用抖动动画吸引来用户注意

在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按钮,为了能够吸引用户主动点击而且不过分的打扰用户,最好的方法就是给我们想吸引用户注意的view添加一些抖动动画,比如这张图...
  • lzyzsd
  • lzyzsd
  • 2014年09月13日 21:09
  • 13258

Android设置View抖动动画

在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按钮,为了能够吸引用户主动点击而且不过分的打扰用户,最好的方法就是给我们想吸引用户注意的view添加一些抖动动画,比如这张图这里我主要实...
  • zhangcanyan
  • zhangcanyan
  • 2017年02月06日 20:04
  • 1207

做网站如何怎么做到吸引用户和留住用户的运营思路

一直做产品,从未做运营,但这并不妨碍我谈谈对运营的理解。因为在互联网领域,产品和运营都是相通的,产品是要给用户提供价值,运营是让用户认识这种价值,它们相互依存,战略目标是一致的。任何运营都围绕“用户”...
  • u010895995
  • u010895995
  • 2014年03月23日 22:49
  • 1184

Android中使用抖动动画吸引来用户注意

原文: http://www.androidcn.org/topic/552e65bc61d460226ab27a5c 在应用中,有时候我们要吸引用户去点击某些按钮,比如应用市场的推荐按...
  • fmlfch
  • fmlfch
  • 2016年06月12日 09:46
  • 239

【Android工具类】用户输入非法内容时的震动与动画提示——EditTextShakeHelper工具类介绍

转载请注明出处:http://blog.csdn.net/zhaokaiqiang1992    当用户在EditText中输入为空或者是数据异常的时候,我们可以使用Toast来提醒用户,除此之外,我...
  • bz419927089
  • bz419927089
  • 2014年11月21日 10:27
  • 4024

【Android工具类】用户输入非法内容时的震动与动画提示——EditTextShakeHelper工具类介绍

转载请注明出处:http://blog.csdn.net/zhaokaiqiang1992     当用户在EditText中输入为空或者是数据异常的时候,我们可以使用Toast来提醒用户,除此...
  • XiGuanNiDaiGeiDeYu
  • XiGuanNiDaiGeiDeYu
  • 2014年11月26日 16:48
  • 438

[学习笔记]用户界面优化-Android自定义视图动画

以下内容纯粹为本人学习笔记【记录】之用,所听课程(Q群群友百度网盘提供)为极客学院一位老师所讲(老师大名我尚未知晓),如有侵权请告知。在此特别感谢这位老师录制的视频资料。需要使用的类或API是Anim...
  • weixin_38256474
  • weixin_38256474
  • 2017年05月23日 18:50
  • 184

【Android】提升用户体验,ListView显示加载中动画及空数据视图

场景分析: 在app开发中,我们为了保证用户体验往往需要在有ListView的地方添加加载中动画及数据为空的时候的提示界面,那么让我们一起来用最简单高效的方法去实现一下吧 第一步:设计空数据布局文...
  • cc_want
  • cc_want
  • 2016年09月08日 17:29
  • 4991

开源整理:酷酷的Android Loading动画,让用户摆脱无聊等待

一个出色的应用常常会用心打磨各种交互细节,例如为了能够让用户在某些耗时操作的等待过程中不要感到那么无聊,加上一个有趣的Loading动画效果将会是一个不错的选择。今天就为大家推荐Github上几个效果...
  • urDFmQCUL2
  • urDFmQCUL2
  • 2017年12月19日 00:00
  • 248

android学习-动画(用户指南的应用)

在安装完apk之后,通常第一次打开都会有一个用户指南给用户查看,一般都是左右滑动式的,主要放一些本apk的特性以及新添加的功能。这种左右滑动的效果是可以通过android动画来实现,其实看起来觉得挺复...
  • Main_Stage
  • Main_Stage
  • 2013年07月24日 14:11
  • 960
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android中使用抖动动画吸引来用户注意
举报原因:
原因补充:

(最多只允许输入30个字)