《微跑步小程序的设计与实现.docx》由会员分享，可在线阅读，更多相关《微跑步小程序的设计与实现.docx（43页珍藏版）》请在三一办公上搜索。
1、目录摘要：1Abstract:11引言31.1研究背景31.2 研究目的及意义31.3 国内外研究现状41.3. 1国内研究现状41.3.2国外研究现状52微跑步小程序系统需求分析62.1小程序系统功能需求分析62.Ll普通用户端62.L2后台管理端62.2微信小程序系统安全性需求72.2.1用户数据的安全性需求72.2.2系统安全性需求72. 3开发工具的选择83项目总体设计103. 1总体功能结构图103. 1.1实体104. L2实体及联系123.2 功能流程图153. 2.1微信用户的功能流程图154. 2.2管理员的功能流程图163.3 数据库设计173. 3.1逻辑结构设计174.
2、 3.2物理结构设计184系统详细设计234.1前端设计与实现234. 1.1注册登录页面234. 1.2微跑步首页页面和检测BMI页面254. L3运动音乐界面274. L4我的页面284. 2后端管理员web端的设计与实现294. 2.1管理员登录页面294. 2.2音乐管理页面304. 2.3跑步记录管理334. 2.4用户管理355. 2.5管理员管理365系统测试396. 1测试方法397. 2测试环境395.3测试阶段405.4维护阶段416总结与展望42参考文献43致谢44微跑步小程序的设计与实现摘要：近年来，大量的人群因运动不足而导致身体素质下降和健康问题的出现，据统计，中国成
3、年人中运动不足率已近半数，健身运动逐渐成为人们日常生活中不可或缺的一部分。在健身领域中，跑步是一种非常受欢迎的运动方式，因其简单易行、效果明显而备受推崇。微跑步小程序则是一款基于微信的专注于跑步运动的小程序，为用户提供一个方便、快捷的轻量级跑步记录平台，用户能够轻松记录跑步里程、消耗的热量等数据，并通过社交互动的功能增加跑步的趣味性和参与性，以促进国民健康和运动的普及化。研究中，采用了前后端分离的架构，使用SSM框架进行后端开发，使用微信开发者工具进行前端开发，并经过测试和验证，成功实现了微跑步小程序的基本功能。研究开发微跑步小程序具有重要的现实意义和科学价值，为推进国民健康事业和健身运动的普
4、及化贡献一份微弱的力量。关键字：微跑步；跑步记录；小程序DesignandImplementationofMicroRunningMiniProgramAbstract：Inrecentyears,alargenumberofpeoplehaveexperiencedadeclineinphysicalfitnessandhealthproblemsduetoinsufficientexercise.Accordingtostatistics,nearlyhalfofChineseadultshaveinsufficientexercise,andfitnesshasgraduallybeco
5、meanindispensablepartofpeople,sdailylife.Inthefieldoffitness,runningisaverypopularformofexercise,whichishighlypraisedforitssimplicityandeffectiveness.MicroRunningMiniProgramisaWeChatbasedminiprogramthatfocusesonrunningandsports.Itprovidesuserswithaconvenientandfastlightweightrunningrecordingplatform
6、,allowingthemtoeasilyrecordtheirrunningmileage,time,andotherdata.Throughsocialinteractionfunctions,itincreasesthefunandparticipationofrunning,promotingthepopularizationofnationalhealthandsports.Intheresearch,weadoptedthearchitectureoffrontendandrearendseparation,usedtheSSMframeworkforback-enddevelop
7、ment,andusedWeChatdevelopertoolsforfront-enddevelopment.Aftertestingandverification,wesuccessfullyrealizedthebasicfunctionsofthemicrorunningapplet.Theresearchanddevelopmentofmicrorunningminiprogramshasimportantpracticalsignificanceandscientificvalue,andcontributesweaklytopromotingthepopularizationof
8、nationalhealthandfitnessactivities.Keywords：Micro-runningapplet;Runningrecords;miniprogram1引言1.1研究背景近年来，随着人们生活方式的改变和工作压力的增大，大量的人群因运动不足而导致身体素质下降和健康问题的出现，这已经成为全球范围内的一个普遍现象。据统计，中国成年人中运动不足率已经超过50队这也表明了运动不足已经成为影响国民健康的重要因素。根据中华人民共和国体育法和健康中国2030规划纲要，中国正在积极推动全民健身运动，提高人民的身体素质和健康水平。在全民健身的政策背景下，运动已经成为了现代社会的重要组
9、成部分。在这样的背景下，针对运动不足问题的解决措施就显得尤为重要，健身运动逐渐成为人们日常生活中不可或缺的一部分。在健身领域中，跑步是一种非常受欢迎的运动方式，因其简单易行、效果明显而备受推崇。随着国家提出“健康中国”战略和“全民健身”计划，促进人民身体素质的提高已经成为国家发展的重要战略目标之一。同时，随着智能移动设备和物联网技术的发展，健身数据的收集和分析变得更加方便和高效。基于这些背景，研究开发一款面向大众人群的微信小程序一一微跑步，旨在为用户提供个性化的健身计划和跑步体验，帮助用户更好地进行跑步训练和保持健康。L2研究目的及意义微跑步小程序的研究目的是为了探究一种基于微信平台的个性化运
10、动辅助工具，设计和开发一款轻量级、高效率的跑步记录和社交分享平台一一微跑步小程序，为用户提供方便快捷高效的跑步窗口，随时随地的跑步打卡，检测BML播放运动音乐增加跑步体验，以及社交互动的功能,激发用户的运动兴趣和热情，增加跑步爱好者的互动频率，促进国民健康和运动的普及化。之所以选择小程序作为辅助工具，是因为小程序相较于传统运动类APP具有这几个优势：无需下载、低成本、用户粘性高、更好的用户体验。微跑步小程序具有较高的实用价值。传统的跑步训练通常需要专业的教练和场地，而微跑步小程序则可以随时随地提供个性化的跑步体验，不仅节省了时间和经济成本，同时也提供了更加便捷和自由的运动方式,促进了健康生活的
11、养成。在微信平台的基础上，微跑步小程序还具有社交互动的功能。用户可以通过分享跑步记录和成果，与其他跑步爱好者进行交流和互动，共同打造一个跑步社区，提高跑步的趣味性和参与性。综上所述，微跑步小程序作为一款基于微信小程序开发的跑步记录和社交分享平台，具有广泛的实际应用价值，具有很好的市场前景和用户发展空间。未来可以继续优化和改进，加强用户体验和养成健康生活方式的功能，推动移动互联网应用在健康领域的发展和创新。1.3国内外研究现状近年来，随着智能手机和移动互联网技术的普及，运动类APP和小程序逐渐成为了人们运动健身的重要工具，运动类APP和小程序的研究越来越受到关注。目前，国内外已经出现了众多的运动
12、类APP,包括跑步、健身、瑜伽、健康管理等多个方面，运动类小程序方面的研究相对较少。1.3.1 国内研究现状在国内，随着移动互联网的快速发展，越来越多的运动类APP和小程序涌现出来，包括跑步、健身、瑜伽、健康管理等多个方面。跑步类APP是比较受欢迎的一类运动类应用。目前，市场上已经出现了众多的跑步类APP,如Keep、FitTime、悦动圈等，可以记录用户的跑步数据，跑步路线规划、跑步社交、健康报告等多种功能，深受广大跑步爱好者的喜爱。健身类APP,如Keep、七分钟训练、魔力健身等，可以为用户提供个性化的健身计划、动作指导、健身社交等功能，帮助用户更好地管理自己的健康。瑜伽类APP,如瑜伽工
13、坊、自然瑜伽、YogiTime等，为用户提供瑜伽课程、动作指导、瑜伽社交等功能，帮助用户更好地享受瑜伽的乐趣。这些APP为用户提供了多样化、便捷化、个性化的运动健身方案和服务，受到了广泛的欢迎和使用。微信官方推出的“WeRun”小程序，主要提供用户的步数、距离、卡路里等运动数据的记录和排名功能，该小程序曾在微信平台上引起热议，得到了广泛的用户关注和使用。此外，还有一些为特定群体设计的运动类小程序，例如针对女性用户的“闺蜜圈”小程序，针对跑步爱好者马拉松赛事的“线上跑吧”小程序等。现有一些类似微跑步小程序的相关研究。例如，王志伟等人设计开发了基于微信小程序的步数统计应用，可以通过微信小程序对用户
14、的步数进行记录和管理。陈振华等人开发了一款基于微信小程序的健康管理应用，用户可以通过该应用进行健康数据记录和监控。唐海霞等人则开发了一款基于微信小程序的运动数据分析应用，可以对用户的运动数据进行统计和分析。然而，目前国内缺乏专门针对大众用户和跑步爱好者记录日常跑步的小程序的研究。L3.2国外研究现状国外的运动类应用发展相对成熟，智能运动跟踪技术和相关应用得到了广泛的研究和应用。例如，美国的MapMyRun”应用程序可以通过GPS技术记录用户的跑步轨迹、速度和距离等信息，帮助用户制定跑步计划和目标。此外，欧洲的Endomondo”应用程序还提供了社交功能，允许用户分享运动数据和与朋友一起参加虚拟
15、挑战赛。这些应用程序都取得了较好的用户反馈和市场表现。MyFitnessPal和RunKeeper等应用被广泛应用于跑步记录和健身管理。MyFitnessPal是一款集合饮食记录、运动跟踪和健康数据分析于一体的应用，用户可以通过输入食物、运动和体重等数据进行健康管理。RUnKeePer则是一款专门用于跑步记录和分析的应用，用户可以利用GPS定位技术记录跑步轨迹、时间、速度等信息，并提供训练计划和社交分享等功能t41o这些APP和小程序提供了多样化的运动模式、运动数据记录和分析、社交分享等功能，成为了用户健康生活的重要支持。同时，随着智能手表、智能穿戴设备等智能健康产品的兴起，运动类APP和小程
16、序也逐渐与这些智能健康产品进行了深度融合，为用户提供更加全面、个性化的运动健康服务。因此，Fitbit等智能手环、手表等穿戴设备也成为了健身跑步记录和管理的重要工具。其内置的传感器和算法可以实现更加精准的跑步数据记录和分析。这些设备还可以与手机等其他设备进行数据同步，方便用户查看和管理自己的运动数据。综上所述，运动类APP和小程序已成为了当前移动互联网发展的热门领域,其应用范围广泛、功能丰富、用户群体庞大。针对不同用户需求和运动习惯，运动类APP和小程序在运动计划设计、运动数据记录、社交分享等方面提供了不同的解决方案。2微跑步小程序系统需求分析微跑步小程序是一款针对运动爱好者的微信小程序，旨在
17、提供一种简便、便捷的运动方式，帮助用户建立良好的运动习惯，增强身体素质。本章对微跑步小程序进行系统需求分析，主要包括功能需求、系统安全性需求以及开发工具的选择等方面。2.1 小程序系统功能需求分析2.1.1 普通用户端主要用于微信用户授权登录并通过填写信息注册登录后跑步记录生成跑步日历。通过体重监测BMIo在跑步过程中可以播放自己喜欢的音乐增加跑步体验。（1）用户登录注册：用户在第一次进入小程序时仅需一次微信授权，在我的界面点击登录注册，填写必要信息完成注册，系统跳转至登录界面，填写用户名和密码进行登录。（2）用户修改信息：用户在修改信息页面进行昵称、密码、邮箱、身高、体重等信息的修改。（3）
18、跑步记录：用户在主界面通过地图主动规划跑步路线，点击开始跑步记录跑步时间，根据位移换算跑步消耗的热量；点击结束跑步，自动跳转跑步日历，查看跑步信息。（4）地图：用户可以通过放大缩小地图查看周边环境，利用主观能动性规划最佳路线。（5）运动音乐：用户可选择喜欢的音乐播放、点赞、收藏，为用户提供更好的跑步体验。（6）点赞收藏：用户可以查看点赞收藏的音乐。2.1.2 后台管理端管理员用来管理音乐、跑步信息、用户信息和管理员信息。（1）管理员登录：管理员在登录页面输入账号和密码，进行身份验证，验证通过后进入后台管理主页面；否则，返回登录页面。（2）音乐管理：在后台管理主页面，管理员可以选择进入音乐管理模
19、块。在音乐管理模块中，管理员可以查看现有的音乐列表，选择编辑音乐信息（名称、类型、类别、销量、发行日期）或删除不需要的音乐。（3）跑步记录管理:管理员可以选择进入跑步记录信息管理模块。在该模块中，管理员可以查看用户的跑步记录信息列表，选择查看详细信息或删除不需要的记录。（4）用户管理：管理员可以选择进入用户管理模块。在该模块中，管理员可以查看注册的用户列表，选择查看用户详细信息或删除不需要的用户账号。（5）管理员的管理：管理员可以选择进入管理员管理模块。在该模块中，管理员可以查看现有的管理员列表，选择编辑管理员信息或删除不需要的管理员账号。2.2微信小程序系统安全性需求2.2.1用户数据的安全
20、性需求用户数据包括用户的个人信息、跑步记录、跑步计划等，是微跑步小程序的核心资产，需要受到有效的保护。（I）用户数据需要进行加密传输。微跑步小程序采用HTTPS协议，将用户的数据加密传输到服务器端，以防止黑客窃取数据。同时，服务器端采用MD5加密算法对数据进行加密存储，确保用户数据不会因为服务器端的被攻击而被窃取。（2）需要采取相应的身份验证措施，确保用户的身份信息的安全性。该小程序采用用户名和密码的方式进行身份验证。对于敏感操作，比如修改个人信息和删除账户等，采用双重身份验证的方式，如输入密码和邮箱验证。2.2.2系统安全性需求确保系统安全是微跑步小程序的关键需求之一。为了防止信息泄露和其他
21、安全问题，可采取的措施：（I）定期安全审计：开发人员应定期对系统进行安全审计，检查是否存在安全漏洞，并及时修复和更新系统。（2）数据备份和存储：系统应定期进行数据备份，并将备份数据存储在安全的位置，以便在系统故障时能够快速恢复数据。（3）访问控制和权限管理：系统管理员对系统进行访问控制和权限管理，确保只有经过授权的用户可以访问敏感数据和功能。通过这些措施，微跑步小程序可以确保对用户操作的控制和监控，及时修复系统中的安全漏洞，并防止信息泄露等安全事故的发生。这样可以提高系统的安全性，保护用户的隐私和数据安全。2.3开发工具的选择系统采用SSM框架，使用微信开发者工具、js、JSP.CSS、Ser
22、viceServletJavaBean等在WindowslO系统下实现，以下是本次系统实现的主要技术环境。（1）开发工具：JDKI.8.0是一个开源的JaVa开发工具；Eclipse2018是一个集成IDE,以方便JaVaWeb网页的开发;微信开发者工具有利于微信小程序的开发。（2）辅助工具：图片压缩工具ImageoPtim,微信小程序中使用的图片大小不能超过2MB,因此需要对图片进行压缩，以减小图片大小，加快图片加载速度。CSS预处理器可以让开发者使用类似于编程语言的语法来编写CSS样式,提高开发效率和可维护性。微信开发者工具自带调试功能，有时候需要使用调试工具Chrome开发者工具来定位和
23、解决问题。Photoshop设计工具可以快速制作出漂亮的界面和图标。MockJs数据模拟工具可以帮助开发者在没有真实数据源的情况下进行开发和测试。（3）数据库：MYSQL8.0数据库，总体占用操作系统的资源较少、处理数据速度快、成本低，开放源码；支持大多数操作系统使用；Ul界面友好，操作简单，提供的接口可支持多种语言连接操作。（4）小程序的限制：微信小程序有一些限制，如代码包大小不能超过2MB、单次上传的图片不能超过2MB等。开发者需要了解这些限制，并根据实际需求进行优化。数据安全：小程序涉及到用户数据，需要注意数据安全问题，对用户数据进行加密、禁止明文传输。用户体验：小程序的用户体验非常重要
24、，需要考虑到用户的需求和习惯，尽可能地提供良好的交互和界面设计。页面加载速度：小程序的页面加载速度对用户体验影响很大，需要注意优化页面加载速度，减少加载时间和流量消耗。兼容性：小程序需要在多种不同的设备和操作系统上运行，需要注意兼容性问题,尽可能地保证在不同平台上的运行效果一致。(5)SSM框架：SSM框架是一种JaVaWeb开发框架，它由SpringSpringMVC和MyBatis三个框架组合而成。SSM框架的主要特点是：Spring框架负责应用程序的整个生命周期管理和依赖注入；SPringMVC框架负责应用程序的MVC架构设计和请求处理；MyBatiS框架负责数据库访问和SQL映射。SS
25、M框架采用松耦合的设计方式，使得各个组件之间的依赖关系较小，易于维护和扩展。SSM框架的配置文件较为简洁，易于配置和使用，同时也支持注解方式进行配置。SSM框架提供了很多可插拔的组件和扩展点，开发者可以根据自己的需求进行定制和扩展。3项目总体设计在开发微跑步小程序前，需要进行全面的项目设计，确立项目的总体方案，以满足用户的需求。本章针对微跑步小程序进行了全面的项目设计，包括需求分析、总体架构设计、系统功能设计和数据库设计等方面。在项目设计过程中，选择微信小程序作为开发工具。微信小程序具有使用方便、开发成本低、运行效率高等优点，是一个非常适合开发微型应用的工具。3.1 总体功能结构图3.1.1
26、实体实体：用户、跑步日历、运动音乐、管理员(1)用户实体图如图3.1所示。图3.1用户实体图(1)跑步日历实体图如图3.2所示。里程日期评毛热霞密步日历图3. 2跑步日历实体图（2）音乐实体图如图3. 3所示。图3.3运动音乐实体图（3）管理员实体图如图3.4所示。图3.4管理员实体图3.1. 2实体及联系在微跑步小程序中，存在以下关系：用户与跑步日历：用户与跑步日历之间是一对一的关系，每个用户对应一个跑步日历，用于记录用户的跑步计划和历史记录。用户与音乐：用户与音乐之间是一对多的关系，每个用户可以拥有多个音乐，用于在跑步过程中选择播放的音乐。管理员与用户：管理员与用户之间是一对多的关系，一个
27、管理员可以管理多个用户账号，包括添加用户、编辑用户信息和删除用户等操作。管理员与音乐：管理员与音乐之间是一对多的关系，管理员可以管理多个音乐资源，包括添加音乐、编辑音乐信息和删除音乐等操作。管理员与跑步日历：管理员与跑步日历之间是一对多的关系，管理员可以管理多个用户的跑步日历，包括查看和编辑跑步记录等操作。通过以上关系的建立和管理，用户可以拥有自己的跑步日历和音乐，而管理员可以管理用户和系统中的音乐资源和跑步记录。这样可以实现对用户数据和系统功能的有效管理和控制。总实体-联系图如图3.5所示。图3.5实体-联系图3.1.2功能结构图微跑步小程序共有五个功能模块：授权登录、跑步打卡、查看地图、运
28、动音乐、我的。其中跑步打卡有三个功能模块：开始跑步、更多：计算BMI。运动音乐模块播放收藏点赞音乐。我的模块有三个功能模块：修改信息、跑步日历、点赞收藏。结构图如图3.6所示。微信用户我 的授权登录图3.6用户的功能结构图管理员后台共设置五个功能模块。分别是：登录、音乐管理、跑步记录管理、用户管理、管理员管理。包括对音乐的删除，编辑音乐名称、作者、类别、销售量和发行时间等信息；对跑步记录和用户的删除；对管理员信息的编辑和删除,编辑管理员姓名、密码、性别、年龄、手机、邮箱信息。结构图如图3.7所示。图3.7管理员的功能结构图3.2功能流程图3.2.1微信用户的功能流程图用户进入微信小程序授权登录
29、成功后，进入“跑步首页”，在“我的”界面点击“登录注册”，填写完整信息注册成功后，输入账号和密码登录使用小程序完整功能。跑步首页点击“开始跑步”记录跑步时间和里程，点击“结束跑步”记录并跳转“跑步日历”查看跑步记录。点击“更多”输入身高体重检测BMl是否正常。点击“运动音乐”，点击“歌曲”播放音乐并跳转音乐界面；点击“点赞”和“收藏”可在“我的”收藏内查看。点击“暂停”音乐暂停播放，点击“左/右”即播放上一曲或下一曲。点击“我的”界面可查看和修改“个人信息”；点击“跑步日历”可查看跑步记录。如图3.8所示。I开始踏步I我的图3.8用户的功能流程图3.2.2管理员的功能流程图管理员输入账号和密码
30、登录后台管理员界面。管理员可以查看音乐列表；可以添加新音乐；编辑音乐信息；可以删除音乐，以实现对音乐的管理。管理员可以查看跑步记录信息列表；可以删除跑步记录信息，以实现对跑步记录信息的管理。管理员可以查看用户列表；可以删除用户账号，以实现对用户的管理。管理员可以查看管理员列表；可以编辑管理员信息；可以删除其他管理员账号，已实现对管理员的管理。如图3.9所示。色乐*S（蛹i）图3.9管理员的功能流程图3.3数据库设计3.3.1逻辑结构设计（1）数据库实体有：用户表（用户昵称、密码MD5加密、手机号、邮箱、性别、年龄、身高、体重）；音乐表（歌名、歌手、年龄、销售量、发行时间）；跑步记录表（时间、姓
31、名、开始时间、结束时间、跑步里程、消耗热量）；管理员表（性别、密码、邮箱、电话、年龄）维护记录表（姓名、网址、时间、文本、回复）；日历表（日期、里程、消耗热量）（2）数据关系模式有：管理1：管理员一音乐表（歌名、歌手、类别、销售量、发行时间）管理2：管理员一用户表（用户ID、姓名、性别、密码、手机号、邮箱、身高、体重）管理3：管理员一跑步记录表（用户ID、跑步时长、跑步里程、消耗热量、日期）3.3.2物理结构设计微跑步小程序系统共存储了八个表。分别是储存音乐播放记录的COlmusic表，储存用户信息的customer表,存储音乐搜索记录的的msarticle表,存储音乐信息music表,存储跑
32、步记录信息的record表,存储维护记录的SUgg表,存储管理员信息的user,存储BMI检测的vdz表。表3-1Colmusic序号列名数据类型长度小数位标识主键外键允许空默认值说明1idint11是是否auto-increment2vidint11是3vnamevarchar255是4vimgIongtext是5vopcnidvarchar255是COlmusic表是用来存储小程序中音乐搜索记录的表，其中id是主键也是标识。表的栏目有歌名、图片地址、播放的用户ID。表3-2customer序列名数据类型长小数标主外允默认说明号度位识键键许值空1idint11是是否auto_incremen
33、t2namevarchar255是3pwdvarchar255是4telvarchar255是5openidvarchar255是6emailvarchar255是7sexvarchar255是8ageint11是9heightvarchar11是10weightvarchar255是CUStOmer表是用来储存用户注册的信息。其中id是主键，该表没有外键。表3-3msarticle序号列名数据类型长度小数位标识主键外键允许空默认值说明1idintH是是否autojncrement2namevarchar255是3logoIongtext是4contentvarchar255是5imgvarc
34、har255是67timeopenidvarcharvarchar255255是是msarticle表是用来储存用户注册的信息。其中id是主键，该表没有外键。表3-4music序列名数据类型长小数标主外键允默认说明号度位识键许值空1idint11是是否autojncrement2mimgvarchar255是3mifcvarchar255是4mp3varchar255是5mtitlevarchar255是6msingervarchar255是7numint11是O8salesint11是O9timevarchar255是MUSiC表用来存储音乐信息的表，歌名id主键。表3-5record序列名
35、数据类长小标主外允HLh默说明号型度数识键键许认位空值1idint11是是否auto_increment2timevarchar255是3namevarchar255是4openidvarchar255是5Stimevarchar266是6etimevarchar255是7Iichengvarchar255是8relangvarchar255是record表用来存储跑步记录信息的表，即跑步日历表。id是主键。表3-6sugg序列名数据类长小标主外允默说明号型度数识键键许认位空值1idintU是是否auto_increment2namevarchar255是3logovarchar255是4te
36、xtvarchar255是5timevarchar255是6replyvarchar255是7statusint11是08openidvarchar255是9buildingvarchar255是10ifcvarchar255是Sugg表是用来存储维护记录的。表3-7user序列名数据类长小标主外允默说明号型度数识键键许认位空值1idint11是是否auto_increment2user_namevarchar255是3user_passwordvarchar255是4user_genderint11是5user_emailvarchar255是6user_telvarchar255是7use
37、r_agevarchar255是User表是用来存储用户信息的。表3-8vdz序列名数据类型长小数标主外键允默说明号度位识键许认空值1idint11是是否auto_increment2vidintH是3vopenidvarchar255是Vdz表是用来存储BMl检测信息的。4系统详细设计本章节将详细介绍微跑步小程序的系统详细设计，包括前端和后端的设计。在本章中，将会对微跑步小程序的系统结构进行描述，并介绍系统的具体实现细节,包括系统的数据结构、页面的主要功能以及实现过程中使用的技术和工具等。其中使用墨刀模拟美化页面，使其页面具有完整性。4.1 前端设计与实现微跑步小程序中的用户页面和按钮功能在
38、微信环境下进行编写，数据处理则在微信开发者工具和eclipse环境中共同完成。为用户提供的功能模块有：跑步首页（包括开始/结束跑步和BMI检测）、运动音乐的播放、暂停、点赞、收藏、个人信息修改、查看跑步口历、查看收藏歌曲。4.1.1 注册登录页面用户进行注册时，输入昵称、密码、性别、年龄、电话、邮箱、身高、体重即可注册成功。注册成功后将会跳转返回登录界面。如图4.1所示图4.1用户注册界面用户输入正确的账号和密码即可显示登录成功；如用户输入错误，货位进行输入,小程序会提醒账号密码错误。如图4.2所示。图4.2用户登录界面微跑步小程序端注册登录部分代码如下：!-密码-4.1.2微跑步首页页面和检测BMI页面首页页面设有自动轮滑图片，用于鼓励跑步精神；“更多”用于检测BMl是否正常，输入身高体重后点击“检测”弹出测试结果；地图可放大缩小及滑动，以供用户根据需求规划跑步路线；点击“开始跑步”开始记录跑步时长，跑步路程，和消耗的热量，并出现“结束跑步”按钮，点击“结束跑步”按钮结束跑并跳转到跑步日历查看跑步记录信息。如图4.3和图4.4所示。图4. 5跑步首页界面检测BMI代码如下:饮食健康-健康等级!-体重一)inputname=compa
