`
marcofly
  • 浏览: 8556 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

用phonegap实现摇一摇

阅读更多
最近公司要用phonegap做移动应用,决定先拿公司的IM软件开刀,实现一个移动版的IM。里面有个功能需要用到类似“摇一摇”,于是开始在网上找现成的代码实现;发现《深入浅出phonegap》这书里有这个例子,但就是找不到该书的电子版下载,于是决定照这ios或android的例子做。先贴代码:

var watchID;

//等设备准备完毕后,按250ms的间隔,定期返回加速度值
function onDeviceReady() {
  var options = { frequency: 350 };
  //onWatchSuccess和onWatchError是获取加速信息成功或失败的回调函数
  watchID =   navigator.accelerometer.watchAcceleration(onWatchSuccess,onWatchError,options);
}

//acceleration是加速对对象,包含设备在x,y,z轴上的加速度信息
function onWatchSuccess(acceleration){
  //判断x,y,z任意方向上的加速超过13即为摇动,超过4次就播放摇一摇的声音
  if(Math.abs(acceleration.x)>13 || Math.abs(acceleration.y)>13  ||Math.abs(acceleration.z)>13){
                shakeCount++;
                if(shakeCount > 4){
                    clearTimeout(timeoutFlag);
                    shakeCount=0;
                    myMedia.play();
                }else{
                    //如果超时4秒没有摇动,重新开始计算次数
                    if(timeoutFlag)
                            clearTimeout(timeoutFlag);
                        timeoutFlag=setTimeout(function(){shakeCount=0},4000);
                }
            }
}

要注意的是,phonegap中的加速信息中Z方向是包含地球的重力加速度,即将设备朝天平放,z的值就有9.8;
摇动手机的时候,如果一会往左,一会往右的移动手机,手机在这个方向上就会产生加速度,如果超过加速度阀值(此时是13),就可以判断为摇动。
改变options中的frequency就可以改变监测频率。
myMedia是phonegap提供Media对象
new Media(src, mediaSuccess, [mediaError], [mediaStatus]);
,play方法就可以播放多媒体。
分享到:
评论

相关推荐

    phonegap实现摇一摇打电话

    在这个特定的场景中,我们要探讨的是如何在PhoneGap 3.0版本上实现“摇一摇”功能来拨打电话。 首先,我们要理解PhoneGap的核心原理:通过WebView将Web应用包装成原生的移动应用,利用JavaScript接口调用设备的API...

    使用PhoneGap实现离线功能【技术文档】

    《使用PhoneGap实现离线功能的技术探索》 PhoneGap,一个强大的跨平台移动应用开发框架,以其独特的HTML、CSS和JavaScript技术,让开发者能够轻松构建原生移动应用。在许多情况下,尤其是对于那些需要在无网络环境...

    phoneGap实现android平台登录例子

    在这个“phoneGap实现android平台登录例子”中,我们将探讨如何利用PhoneGap在Android平台上创建一个简单的登录功能,这对于初学者来说是一个很好的入门实践。 首先,我们需要了解PhoneGap的基础知识。PhoneGap是...

    PhoneGap 开发的一个例子

    PhoneGap是一个用基于HTML,CSS和JavaScript的,创建移动跨平台移动应用程序的快速...使用PhoneGap只比为每个平台分别建立应用程序好一点点,因为虽然基本代码是一样的,但是你仍然需要为每个平台分别编译应用程序。

    phoneGap实现android平台应用

    本教程将详细介绍如何使用PhoneGap在Android平台上实现一个新闻客户端,同时连接到MySQL数据库。 首先,我们需要了解PhoneGap的核心概念。PhoneGap提供了一种封装机制,将Web应用程序打包为原生应用,利用WebView...

    Phonegap拍照,图片保存应用

    通常,这涉及到设置Node.js环境,使用npm(Node Package Manager)安装Cordova,然后创建一个新的PhoneGap项目。 2. **配置Android平台**:使用Cordova命令行工具添加Android平台,确保你的机器上安装了Android SDK...

    使用Phonegap实现离线功能详细讲解.doc

    总结来说,PhoneGap 结合 SQLite 实现离线功能的技术流程主要包括:构建 PhoneGap 环境,通过 AJAX 获取并解析 JSON 数据,使用 PhoneGap 的 SQLite API 存储数据,以及在离线状态下从数据库中读取数据并更新 UI。...

    phonegap指南针实例

    这个"phonegap指南针实例"是一个基于PhoneGap的项目,它展示了如何在移动设备上实现类似iPhone上的指南针功能。这个实例是开发者学习和理解PhoneGap硬件访问能力的一个好例子。 首先,我们要理解PhoneGap的核心概念...

    自定义plugin插件实现phonegap与Android交互

    PhoneGap是一种流行的开源框架,它允许开发者使用HTML、CSS和JavaScript来构建原生的移动应用程序。这个框架的主要优点是能够跨平台开发,使得开发者可以用一套代码库为iOS、Android等不同操作系统创建应用。然而,...

    phoneGap实现android程序开发代码

    在这个“phoneGap实现android程序开发代码”中,我们将探讨如何使用PhoneGap进行Android应用开发。 首先,我们需要安装PhoneGap的开发环境。这包括安装Java Development Kit (JDK),Android SDK,以及集成开发环境...

    IONIC+PhoneGap项目源码

    【IONIC】 IONIC是一款基于...综合以上,这个压缩包提供了一个使用IONIC和PhoneGap开发的项目源码,以及关于PhoneGap的深入学习材料,对于想要学习或提升混合移动应用开发技能的开发者来说,是非常宝贵的资源。

    phonegap在iphone手机上pushnotification实现

    总结来说,PhoneGap在iPhone上实现Push Notification涉及了多个层面的技术,包括PhoneGap插件的使用、Apple的APNS服务、服务器端的推送服务集成以及客户端的事件处理。理解和掌握这些知识点,可以帮助你成功地在...

    phonegap调用android插件实现GPS定位

    在本教程中,我们将探讨如何使用PhoneGap调用Android插件来实现GPS实时定位。 一、PhoneGap与Android插件 PhoneGap的插件系统是连接Web层和原生层的关键。当在JavaScript中调用一个PhoneGap API时,实际上是在调用...

    phonegap完整例子!

    "是针对Android平台的一个示例项目,特别适合在pad设备上运行,并且包含了自定义插件的实现,这对于深入理解和使用PhoneGap技术尤其有帮助。 1. **PhoneGap基础概念** - PhoneGap基于Apache Cordova,是一个让...

    PhoneGap实例

    PhoneGap实例是一个深入实践的项目,它展示了如何利用PhoneGap框架结合jQuery Mobile或jqMobi来构建跨平台的移动应用程序。PhoneGap是一个开源框架,它允许开发者使用HTML、CSS和JavaScript来开发原生的移动应用,...

    phoneGap-android实现拍照和选择图库

    在Android平台上,PhoneGap提供了一个便捷的方式来整合设备的功能,比如摄像头和图库,使得Web开发者能够轻松地实现拍照和选择图库图片的操作。 1. PhoneGap基础: PhoneGap的核心是Cordova,一个开源的移动设备...

    phoneGAP2.9.1.zip

    总的来说,PhoneGap 2.9.1是一个历史版本,但它展示了PhoneGap跨平台开发的核心理念和早期实现方式。随着技术的发展,PhoneGap不断改进,以适应不断变化的移动开发需求。尽管有其局限性,但PhoneGap依然是许多开发者...

    phonegap2.0版本android视频播放实例源码

    2. **创建PhoneGap项目**:使用PhoneGap CLI创建一个新的项目,指定目标平台为Android。 3. **导入源码**:将提供的"hellophonegap"目录结构导入到Eclipse或Android Studio的项目中。 4. **配置视频资源**:将视频...

    iOS 使用PhoneGap 开发HTML5 的APP

    总之,PhoneGap为iOS应用开发提供了一条便捷的道路,让开发者可以用熟悉的Web技术构建跨平台的应用。尽管它简化了开发流程,但理解原生iOS开发的基本概念仍然是很有帮助的,因为这将有助于解决PhoneGap无法覆盖的...

    我的第一个PhoneGap应用

    "我的第一个PhoneGap应用"很可能是对初学者的一个教程或示例项目,旨在帮助他们理解如何使用PhoneGap开发移动应用。 PhoneGap的优点在于其跨平台性,开发者可以编写一次代码,然后在多个操作系统上运行,包括iOS、...

Global site tag (gtag.js) - Google Analytics