EAUML日拱一卒-微信小程序实战:位置闹铃 (15)-实现监控点状态迁移功能
简单地设计以后,就可以开始着手实现了。
接近监控点
enterAlarmCheck: function (distance, accuracy){
if (this.state == 'ready') {
//500m
if (distance < 500) {
this.checkBuffer.push(1)
} else {
this.checkBuffer.push(-1)
}
if (this.checkBuffer.length > CHECK_BUFFER_SIZE){
this.checkBuffer.shift()
}
var sum = this.checkBuffer.reduce(function(x,y){return x + y}, 0)
if (sum == CHECK_BUFFER_SIZE) {
this.setState('armed')
}
} else if (this.state == 'armed') {
//100m
if (distance < 100) {
this.checkBuffer.push(1)
} else if (distance > 500) {
this.checkBuffer.push(-1)
}
if (this.checkBuffer.length > CHECK_BUFFER_SIZE) {
this.checkBuffer.shift()
}
var sum = this.checkBuffer.reduce(function (x, y) { return x + y }, 0)
if (sum == CHECK_BUFFER_SIZE) {
this.setState('fired')
}else if (sum == -CHECK_BUFFER_SIZE) {
this.setState('ready')
}
} else if (this.state == 'fired'){ //fired
this.checkBuffer.push(1)
if(this.checkBuffer.length == 10){
this.setState('accepted')
}
} else{
if (distance > 100) {
this.checkBuffer.push(1)
} else {
this.checkBuffer.push(-1)
}
if (this.checkBuffer.length > CHECK_BUFFER_SIZE) {
this.checkBuffer.shift()
}
var sum = this.checkBuffer.reduce(function (x, y) { return x + y }, 0)
if (sum == CHECK_BUFFER_SIZE) {
this.setState('ready')
}
}
},
补充说明
代码中最难理解的恐怕不是状态迁移本身,而是数组的用法。这里简单地说明一下。
push:在数据最后添加元素
shift:从数组开头删除元素
reduce:函数本身可以提供上次操作的结果并逐一对每个元素进行操作,这里用作数组所有元素地求和。
再回头看一遍,相信程序很容易理解。
最新状态图
在实现状态迁移地过程中,对状态图也进行了适当地修改,以下是最新的状态图。
参考资料
数组用法
0基础学习微信小程序(12)-ECMAScript5数组操作方法
0基础学习微信小程序(11)-ECMAScript3数组操作方法
Alarm.js代码
https://raw.githubusercontent.com/xueweiguo/alarmmap/master/utils/alarm.js
写在文章的最后
EAUML日拱一卒-微信小程序实战:位置闹铃 (15)-实现监控点状态迁移功能相关推荐
- EAUML日拱一卒-微信小程序实战:位置闹铃 (5)-显示所在位置的信息
假设我们指定了多个监控点,接下来的需求就是给每个监控点取名字.如果是手动输入的话,会比较麻烦.所以位置闹铃再向前走一步,从地图上取得监控点所在位置的信息作为监控点的名称. 画面说明 当我们选定监控点以 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (18)-差不多就这样了
经过一段时间地实现和测试,位置闹铃小程序开发也渐渐接近尾声了.作为一个练习,差不多也就这样了. 今天介绍小程序的功能. 启动小程序 扫描下面的二维码即可启动位置闹铃小程序. 功能介绍 首先是主画面,第 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (19)-发布微信小程序
小程序的功能实现之后,经过一段时间地测试,接下来就是发布了. 在开发工具的上面偏右的位置,有一个[上传]按钮,按下它就可以将小程序上传到微信小程序公众号. 登录自己的小程序帐号,进入开发管理页面. 画 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (17)-保存和取出设定信息
设定了监控点之后,小程序会取得最新位置,判断各个监控点的到达,离开情况并播放提示音.很多情况下,用户会希望这些信息可以保存起来以便将来使用. 这就是今天的主题:在小程序中保存设定信息. API 位置闹 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (16)-单元测试是个技术活
程序设计,实现之后的下一个环节就是单元测试了.对于位置闹铃小程序来讲,带着设备到处移动以测试监控点的状态迁移就是一个必经之路,但是如果所有环节都通过实地测试来解决,那将耗费大量的时间和体力. 我们的选 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (8)-WXML条件渲染
需求 按照位置闹铃程序的设计,当设备接近或者离开某个区域时,可以播放提示音,也可触发记时器动作.按照设计,我们的画面是这样的. 提示音选择画面 计时器选择画面 实现方式 一般来讲,根据动作动作类型选择 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (6)-播放音频
昨天停更了一天,不是作者偷懒,而是掉到了一个坑里.本来以为播放音频很简单,但是还是遇到的各种问题,比如: 1)小程序无法播放手机存储目录中的文件,只能播放网上的或者是小程序暂存的文件. 2)播放暂存文 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (20)-发布微信小程序(续)
头一天晚上申请,到第二天早上也没有通过,所以就有了这篇续. 审批通过以后,首先手机的服务通知收到这个: 登录小程序帐号,画面的右上角也会有提示. 这时的开发管理页面是这样的: 可以看到审核版本栏版本号 ...
- EAUML日拱一卒-微信小程序实战:位置闹铃 (14)-分析监控点状态
将监控点包装成一个类以后,接下来应该就是设计和实现监控点功能了.今天先是设计.我们分接近监控点和离开监控点两种情况讨论. 接近监控点 ready状态 监控点工作状态,小程序会对设备位置进行监控,如果有 ...
最新文章
- 浅谈ASP.NET 缓存技术
- 移动硬盘加密方法赏析
- Python scrapy 命令行传参 以及发送post请求payload参数
- 在Android Studio环境下使用ESPRESSO 测试框架进行UI测试
- Ajax:如何运用updatepanle进行局部刷新
- 自适应表格连续字符换行及单行溢出点点点显示
- 中文版Visual Studio 2008 SP1 智能提示为英文的补丁发布
- 05 ansible剧本编写
- archlinux安装个简单桌面icewm
- Linux core文件生成及设置 查看core文件由哪个程序生成的
- 计算机病毒预防措施磁盘格式化,电脑病毒会格式化硬盘怎么办
- flutter开发的即时聊天应用
- java基础常见面试题
- easypoi 语法_高中英语 | 必修1选修8必须掌握的语法重难点汇总 (全八册)
- CentOS配置Jenkins+Android+fir+pyger(蒲公英)+qiniu(七牛)
- 为什么自建 UI 框架?
- c语言printf使用方法,C/C++语言printf命令使用方法
- Android权限——中英文对照表
- qq2013 beta4(6734)木头显ip v10.4.2
- greasemonkey 使用心得