【咸鱼教程】Egret实现摇一摇功能
教程目录
一 实现原理
二 代码
三 Demo下载
一 实现原理
监听设备旋转角度的变化,来判断用户是否摇动手机。
参考:
智能手机里陀螺仪和重力感应有何区别?
HTML5实现摇一摇的功能
Egret官方陀螺仪教程
二 代码
摇一摇工具类ShakeTool使用范例
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
|
private shakeTest(){ this.shakeTool = new ShakeTool(); this.shakeTool.addEventListener(egret.Event.CHANGE, this.onChange,this); this.shakeTool.start();}private onChange(e:egret.Event){ var data = e.data; //用户大概晃动了手机2-3次 if(data.shakeCount > 6){ egret.log("摇一摇完成"); this.shakeTool.stop(); }} |
ShakeTool源码
|
01
02
03
04
05
06
07
08
09
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
/** * 摇一摇工具类 * @author chenkai * [url=home.php?mod=space&uid=81950]@since[/url] 2017/4/20 */class ShakeTool extends egret.EventDispatcher{ private orientation:egret.DeviceOrientation; //设备方向变化 private xAngle: number = 0; //设备绕x角度 private yAngle: number = 0; //设备绕y角度 private zAngle: number = 0; //设备绕z角度 private last_x: number = 0; //上一次绕x角度 private last_y: number = 0; //上一次绕y角度 private last_z: number = 0; //上一次绕z角度 private shakeCount: number = 0; //摇动次数 private lastTime:number = 0; //上一次更新时间 private shakeAngle:number = 45; //当晃动角度大于一定角度时,算摇动一次 public constructor(){ super(); } /**开始 */ public start(){ //重置数据 this.shakeCount = 0; this.lastTime = 0; this.last_x = 0; this.last_y = 0; this.last_z = 0; //开始监听 this.orientation || (this.orientation = new egret.DeviceOrientation()); this.orientation.addEventListener(egret.Event.CHANGE,this.onOrientation,this); this.orientation.start(); } /**停止 */ public stop(){ if(this.orientation){ this.orientation.removeEventListener(egret.Event.CHANGE,this.onOrientation,this); this.orientation.stop(); } } private onOrientation(e: egret.OrientationEvent) { var curTime:number = egret.getTimer(); //每100ms判断一次 if(curTime - this.lastTime > 100){ this.lastTime = curTime; this.xAngle = e.beta; //x轴 this.yAngle = e.gamma; //y轴 this.zAngle = e.alpha ; //z轴 //旋转超过一定角度,则算摇动一次 if(Math.abs(this.last_x - this.xAngle)>this.shakeAngle || Math.abs(this.last_y - this.yAngle)>this.shakeAngle || Math.abs(this.last_z - this.zAngle)>this.shakeAngle){ this.shakeCount ++; } this.last_x = this.xAngle; this.last_y = this.yAngle; this.last_z = this.zAngle; } //派发事件(应该在shakeCount++时派发一次,写在这里只是为了方便显示测试数据...) this.dispatchEventWith(egret.Event.CHANGE,false, {x:this.xAngle,y:this.yAngle,z:this.zAngle,shakeCount:this.shakeCount}); }} |
三 Demo下载
【咸鱼教程】Egret实现摇一摇功能的更多相关文章
- Egret 摇一摇功能
一 什么是重力感应 二 什么是陀螺仪 三 Egret中的摇一摇是利用什么原理实现的 四 摇一摇代码 一 什么是重力感应 二 什么是陀螺仪 三 Egret中的摇一摇是利用什么原理实现的 大概是利用手机 ...
- C#开发微信门户及应用(38)--微信摇一摇红包功能
摇一摇周边红包接口是为线下商户提供的发红包功能.用户可以在商家门店等线下场所通过摇一摇周边领取商家发放的红包.我曾经在<C#开发微信门户及应用(28)--微信“摇一摇·周边”功能的使用和接口的实 ...
- C#开发微信门户及应用(28)--微信“摇一摇·周边”功能的使用和接口的实现
”摇一摇周边“是微信提供的一种新的基于位置的连接方式.用户通过“摇一摇”的“周边”页卡,可以与线下商户进行互动,获得商户提供的个性化的服务.微信4月份有一个赠送摇一摇设备的活动,我们有幸获得赠送资格, ...
- Android 摇一摇功能的注意事项
/**开始重力传感器的检测*/ public void start() { // 获得传感器管理器 sensorManager = (SensorManager) mContext.getSystem ...
- 【WP开发】实现“摇一摇”功能
尽管我的微信是每八个月登录一次,但我相信各位玩得比我多.微信有一个“摇一摇”功能,这个功能其实是利用了加速度传感器来实现的,这个传感器,我估计再低端的手机都会有的,这是严重基本的传感器. 重力加速度既 ...
- 利用HTML5的一个重要特性 —— DeviceOrientation来实现手机网站上的摇一摇功能
介绍之前做两个声明: 以下代码可以直接运行,当然你别忘了引用jQuery才行. <script> // DeviceOrientation将底层的方向传感器和运动传感器进行了高级封装, ...
- html5实现微信摇一摇功能
在HTML5中,DeviceOrientation特性所提供的DeviceMotion事件封装了设备的运动传感器时间,通过改时间可以获取设备的运动状态.加速度等数据(另还有deviceOrientat ...
- IOS开发之——类似微信摇一摇的功能实现
首先,一直以为摇一摇的功能实现好高大上,结果百度了.我自己也模仿写了一个demo.主要代码如下: 新建一个项目,名字为AnimationShake. 主要代码: - (void)motionBegan ...
- Android 摇一摇之双甩功能
Android 摇一摇之双甩功能 最近做一个摇一摇的功能 网上相关代码很多 但是这次的需求有点奇葩 要求是摇两次才生效 看起来好像很简单 但真正要做遇到的问题还是很多 时间限制 机型灵敏性 摇动的方式 ...
随机推荐
- Mac OS终端中设置颜色高亮和自动补全
已测试通过,原文:http://blog.csdn.net/songjinshi/article/details/8945809 一.颜色高亮显示 针对terminal采用bash模式: 编辑 ~/. ...
- Oracle:使用二进制工具修改高版本的 exp (dump)文件,以便 低版本 imp 工具 导入
printf "\x31" | dd of=product_2018-10-08.dmp conv=notrunc bs=1 count=1 seek=12
- python 在windows 中文显示
今天看到mechanize,在网上找例子实验,发现只要代码里出现中文,就会报错 SyntaxError: Non-ASCII character , but no encoding declared; ...
- tomcat设置debug模式
1.设置 编辑catalina.bat,在 rem Guess CATALINA_HOME if not definedset "CURRENT_DIR=%cd%"if not & ...
- QT编译错误: multiple definition of `qMain(int, char**)'
QT使用过程中来回添加修改代码,结果出现了编译错误:error: multiple definition of `qMain(int, char**)' 一直看我的源文件是都哪里有错误,最后发现是在p ...
- js提取新浪邮箱的信用卡
js提取用户新浪邮箱中的信用卡信息,是js非nodejs. 对比py,之前就做不好,出现了复杂点选验证码.js的开发速度只需要py的三分之一,甚至十分之一. js在客户端执行,py在后端执行,py要实 ...
- [原]unity调Android(三)
private UnityPlayer mUnityPlayer; @Override protected void onCreate(Bundle savedInstanceState) ...
- Centos6.3 下使用 Tomcat-6.0.43 非root用户 jsvc模式部署 生产环境 端口80 vsftp
一.安装JDK环境 方法一. 官方下载链接 http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260 ...
- photoshop制作简单ico图标
新建16 * 16透明画布 字体20px 半径4px
- trim思考
今天发现后台订单商品名称没有的时候出现了HTML代码,然后看了一下源代码(下图是简化版本的) <?php $name = trim('<span style="font-weig ...