| 姓名和学号？ | 王思恩，200023230 |
|---|---|
| 本项目属于哪门课程？ | 中国海洋大学22夏《移动软件开发》 |
| 项目名称？ | 跑步打卡小程序 |
| 博客地址？ | https://rpc.cnblogs.com/metaweblog/wang-si-en |
| Github仓库地址？ | https://github.com/w772552092/MSD-personal-project-code.git |
一、简要介绍项目，典型用户和典型故事场景
1.项目介绍：
名称：跑步打卡小程序
选题原因：老师给定的浪漫的选题范围很广，我认为一个人能始终如一的坚持一件事也是一件很浪漫的事，很显然坚持跑步就是其中的一 种还对身体有好处，所以我就萌生了做一个跑步打卡的小程序。
具体功能：改小程序能实现确定用户所处位置，显示跑步具体路径、距离、和所用时间、可打卡记录跑步次数及每次打卡的时间，跑步的 距离和时间等信息
2.典型用户：喜欢跑步，经常跑步，想记录自己跑步历程的人士
3.典型故事场景：例如在现在的西海岸校区有一条临海的大道，对于想要边跑步边欣赏临海风光又有打卡需求的同学，小程序就派上了用 场。
二、当前完成情况
一中提到的功能都已实现，不过略显简陋
三、包括哪些页面，使用了哪些控件与技术
包括三个页面：主页、实现跑步功能的页面、打卡记录页面
使用了view,text等组件，核心组件是map
1.主页
原理和第一个小实验类似用wx:if 和wx:else控制是否登录
和第一个实验一样，获取用户权限，成功后显示头像、名字、和转到跑步页面、和打卡页面的按钮
转跳到两个页面的函数
2.跑步页面
分为两个视图一个显示四个功能按钮和里程数和时间，另一个显示地图
首先设置四个全局变量counTooGEtLocation是更新位置的计时器，startRun标识跑步状态0时不计时,1时为跑步状态开始计时
全局计时函数，每1秒更新一次时间，每5秒更新一次位置,每10ms增加更新两个计时变量一次
让时间格式化输出的函数
补零函数，当时间为一位数时在其前侧补零
根据两点的经纬度计算两点的距离,toRadians函数将角度转为弧度，lat1,lng1为第一个点的经纬度，lat2,lng2为第二个点的经纬度
meters里程time跑步用时间marks标记点covers覆盖物
开始跑步按钮事件处理函数，开始跑步就开始计时，并更新当前位置
暂停跑步函数
打开当前位置，返回gcj02格式的数据
更新时间函数
获取当前位置并更新相应数据的函数
确定打卡时间的函数
打卡函数，将记录存到缓存里面，将所有全部全局变量和局部变量归零重置
转跳到打卡记录页面
页面加载时调更新一次位置并开始计数
3.打卡记录页面
读取缓存中的信息并存入到数组中，在页面进行循环显示
清空打卡记录，等于清空缓存中的内容
四、测试及上线运行情况
红点标记的位置显示有一定卡顿，发现是wx.getLocation开启高精度定位会有延迟，关闭后发现定位有一定偏差，而wx.onLocationChange有同样的位置偏差问题。
五、实际遇到的问题及解决方法
1.不知到如何计算跑步里程数，去网上搜索得到相关操作公式
2.调用wx.getLocation是总是不更新用户具体位置,上网查得在其内部不能直接通过this调用数据和函数,需要var that = this重新定义一下
3.通过网络学习如何获取当前时间
4.学习如何使用map组件
六、心得体会
学会了如何使用map组件和一些相关的api和函数去设计一个跑步打卡小程序，虽然实际使用体验不是很好，但我相信随着我的学习和成长，我可以做出更好地应用
标签：project,函数,personal,更新,MSDE2,跑步,打卡,wx,页面 From： https://www.cnblogs.com/wang-si-en/p/16640649.html