《PhoneGap移动应用开发手册》——1.2节使用加速计检测设备的移动

简介:

本节书摘来自异步社区《PhoneGap移动应用开发手册》一书中的第1章,第1.2节使用加速计检测设备的移动,作者 【英】Matt Gifford,更多章节内容可以访问云栖社区“异步社区”公众号查看

1.2 使用加速计检测设备的移动
PhoneGap移动应用开发手册
加速计可捕捉设备在x,y,z这3个空间轴上的移动。加速计是一种移动传感器,它能检测当前设备位置的相对移动变化。

实现步骤
使用PhoneGap API提供的加速计相关函数检测设备的反馈信息。

(1)首先,创建HTML初始化框架,并添加需求脚本文件cordova-2.0.0.js的引用。


6ef2eed58d492ae441f1a4ac710466baa9c4991f

通过http://www.packtpub.com.网站购买Packet相关书籍的用户,可以下载已购买书籍的示例代码。其他读者可以访问网站http://www.packtpub.com/support,通过注册后,可将相关文件直接发送到您的电子邮箱。
(2)在Cordova JavaScript引用的下面,新建一个JavaScript标签块,进行下一步之前,定义一个确保设备准备就绪及本地代码加载完成的侦听事件。


2cb4a4c1b36ca8f56b034b89a70d65fd980e3263

(4)加入onSuccess函数处理从加速计返回的信息。

(5)定义accelerometer div元素对应变量,保存生成的加速计结果。

(6)接下来,将accerlation对象的返回值赋给accelerometer via元素中的HTML以显示给用户,将acceleration对象访问的可用属性赋值给字符串变量。


89af543421ff608fe6cc6e19a0f6a90122d95e30

实现原理
通过注册deviceready事件的侦听事件,保证在JavaScript代码执行时本地的PhoneGap代码已经执行完毕。一旦准备就绪,程序将调用加速计API中的getCurrentAcceleration函数,并加载两种方法,分别处理成功返回和错误信息。

onSuccess函数返回的加速计信息,包含以下4种属性:

acceleration.x:Number类型变量,单位是m/s^2,用于测量设备在x轴方向上的加速度。也就是当屏幕垂直放置时,设备从左向右的移动。从左向右移动时,加速度值为正,反之,为负。
acceleration.y:Number类型变量,单位是m/s^2,用于测量设备在y轴方向上的加速度。也就是当屏幕垂直放置时,设备从下向上方向的移动。当设备往上移动时,获取的加速度值为正值,从上往下移动时则为负值。
acceleration.z:Number类型变量,单位是m/s^2,用于测量设备在z轴方向上的运动。也就是设备垂直方向的变化。当设备朝向天空移动时,获取的加速度为正值,当设备向地面方面移动时,加速度为负值。
acceleration.timestamp:DOMTimeStamp对象,用于测量从程序初始化开始运行的时间(毫秒),可以用来存储、更新以及追踪从上次加速计更新开始时间内的变化。
图1.2显示了x,y,z轴与设备的关系。


30c04cf1535d9e4330bfd27cfcbf66eeac312b85

之前提到的加速度对象返回的acceleration.x、acceleration.y和acceleration.z值,都受到重力加速度的影响,其值精确到9.81 m/s^2。

相关内容
从设备获取加速度数据在一些移动手机游戏的开发中必不可少,这些游戏往往需要平衡控制,以及对设备转向、视图控制、设备倾斜的移动检测。

读者可在下面地址了解getCurrentAcceleration方法,及获取加速计数据的官方Cordova文档:
``
http://docs.phonegap.com/en/2.0.0/cordova_accelerometer_accelerometer.md.html#accelerometer.getCurrentAcceleration.

相关文章
|
移动开发 JavaScript Android开发
PhoneGap:免费开源的 HTML5 移动应用开发平台
  PhoneGap 是一个免费开源的开发框架,让 Web 开发人员能够使用熟悉的 HTML,CSS 和 JavaScript 构建跨平台的移动本地应用。通过 PhoneGap 框架提供的 JavaScript API 能够以非常简单的方式调用移动设备的核心功能,包括地理位置,摄像头,加速器,通讯录,多媒体,文件和网络等功能。
1391 0
|
开发框架 Dart Android开发
移动应用开发中的创新之路:探索跨平台解决方案
【9月更文挑战第21天】在移动应用的海洋中,开发者们面临着一个不断变化的挑战——如何在多个操作系统上提供无缝的用户体验。本文将探讨跨平台开发的魅力与挑战,并深入分析Flutter框架如何成为现代开发者的利器。我们将通过实际代码示例,揭示Flutter简化开发流程、提高生产效率的秘密。从Dart语言的基础到热重载的便捷性,本文旨在为读者提供一次全面而深刻的跨平台开发之旅。
|
C# Android开发 虚拟化
C# 一分钟浅谈:MAUI 跨平台移动应用开发
.NET MAUI 是 Microsoft 推出的跨平台框架,支持 Windows、macOS、iOS 和 Android。本文从基础概念入手,探讨 MAUI 的常见问题、易错点及解决方案,并通过代码示例详细说明。涵盖平台特定代码、XAML 语法、数据绑定、性能优化和调试技巧等内容,帮助开发者更好地掌握 .NET MAUI。
1302 55
|
开发框架 前端开发 Android开发
移动应用开发中的跨平台策略与实践
【9月更文挑战第34天】本文将深入探讨移动应用开发的跨平台策略,包括对React Native、Flutter和Xamarin等流行框架的比较。文章还将分享一些实用的跨平台开发技巧和最佳实践,帮助开发者在多个平台上高效地构建和维护应用。无论你是初学者还是有经验的开发者,这篇文章都会为你提供有价值的见解和指导。
|
开发框架 数据安全/隐私保护 开发者
Flutter 是一款强大的跨平台移动应用开发框架,本文深入探讨了其布局与样式设计
Flutter 是一款强大的跨平台移动应用开发框架,本文深入探讨了其布局与样式设计,涵盖布局基础、常用组件、样式设计、实战应用、响应式布局及性能优化等方面,助力开发者打造精美用户界面。
385 7
|
开发框架 Dart 前端开发
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。
Flutter 是谷歌推出的一款高效跨平台移动应用开发框架,使用 Dart 语言,具备快速开发、跨平台支持、高性能、热重载及美观界面等特点。本文从 Flutter 简介、特点、开发环境搭建、应用架构、组件详解、路由管理、状态管理、与原生代码交互、性能优化、应用发布与部署及未来趋势等方面,全面解析 Flutter 技术,助你掌握这一前沿开发工具。
1188 8
|
前端开发 Android开发 开发者
移动应用开发的未来:探索跨平台解决方案##
在移动开发的海洋中,跨平台框架如同一艘能够穿梭于iOS和Android两大操作系统之间的航船。本文将探讨这艘航船的构造—从它的起源、它的引擎(技术架构),到它能抵达的岸边(应用场景)。我们将启航,一探究竟如何在波涛汹涌的市场中找到自己的航线。 ##
201 3