微信小程序“公交出行”设计与实现开题报告
2020-02-18 20:02:37
1. 研究目的与意义(文献综述)
1、设计目的及意义
微信小程序,简称小程序,英文名mini program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。全面开放申请后,主体类型为企业、政府、媒体、其他组织或个人的开发者,均可申请注册小程序。小程序、订阅号、服务号、企业号是并行的体系。
小程序是一种不用下载就能使用的应用,也是一项门槛非常高的创新,经过将近两年的发展,已经构造了新的小程序开发环境和开发者生态。小程序也是这么多年来中国it行业里一个真正能够影响到普通程序员的创新成果,现在已经有超过150万的开发者加入到了小程序的开发,与我们一起共同发力推动小程序的发展,小程序应用数量超过了一百万,覆盖200多个细分的行业,日活用户达到两个亿,小程序还在许多城市实现了支持地铁、公交服务。小程序发展带来更多的就业机会,2017年小程序带动就业104万人,社会效应不断提升。
2. 研究的基本内容与方案
3、基本内容和技术方案
3.1基本内容
本文将在充分的调研和资料查阅基础上,以微信小程序为平台搭建一个“公交出行”系统。根据软件的需求共设计三个页面:首页、查询页和详情页。这三个页面和需求的对应关系如下:首页需求分析,展示当前位置附近的公交路线、快捷分享该页面信息;查询页需求分析,输入公交线路可以得到公交信息、可快捷分享该页面;详情页需求信息,展示最多三辆驶向当前位置的车辆的实时信息、可一键切换车辆行驶方向、可快捷分享该页面。三个页面的跳转关系如下:在首页点击实时公交查询跳转至查询页,点击下方列表中的路线信息跳转至路线详情页。
首页提供了公交查询的入口以及附近公交车路线的基本信息。在公交查询页面中,输入公交线路编号就可以立即出现查询结果。用户可根据目的地选择相应的行车方向,点击进入详情页面查看详细信息。公交线路详情页面显示该路线的所有相关信息,如首末班车、票价、运行车辆的位置、距离当前位置最近的站点以及到站所需的大致时间等等。如果想查看与当前行车方向相反的路线信息,可一键切换查看。
3.2技术方案
(1)MINA 框架为开发者提供了一套基础的组件,这些组件的风格样式与微信界面的风格习惯一致,自带特殊的逻辑,不需要开发再去花时间调整页面按钮的样式。每个组件包含两个标签,一个是开始一个是结束,内容位于两个标签之内,开发者可以通过组合基础组件,创建出强大美观的微信小程序。 小程序的组件有很多,这里主要介绍基础容器组件、导航组件、媒体组件、地图组件。
1. 基础容器组件主要有:view 是整个小程序的视图容器,icon 为图标容器,text 为文本容器,button 为按钮容器,form 为表单容器,checkbox 为多项选择容器,radio 为单项选择容器,slider 为滑动选择容器,switch 为开关选择容器。
2. 导航组件主要为 navigator,实现页面链接。
3. 媒体组件主要有 audio 为音频组件,image 为图片组件,video 为视频组件。
4. 地图组件为 map 组件,调用就可以实现腾讯地图的展示。
(2)MINA 框架还提供丰富的微信原生 API,直接调用这些 API 就可以方便快捷的使用微信自带的一些功能,下面将介绍部分强大的 API。
1. 网络 API 主要有:wx.request 主要是发起请求;网络通信数据接口主要用到wx.connectSocket 等。
2. 图片 API 主要有:wx.chooseImage 从本地选择图片、wx.previewImag 预览图片、wx.getImageInfo 获取图片的信息。 3. 数据服务 API 主要有:wx.setStorage 存储数据,wx.getStorage 读取数据,wx.clearStorage 实现清除数据。
3. 位置 API 主要有:wx.getLocation 获取地理位置、wx.openLocation 打开地图查看位置、wx.createMapContext 实现多点定位。
微信小程序开发流程 :
(1)获取微信小程序的 AppID 使用微信登录微信公众平台官网 ,注册小程序账号获得 AppID,并补充小程序的基本信息,包含名称图标、描述等。不可直接使用服务号或订阅号 AppID。
(2)载微信开发者工具 在官网下载微信开发者工具,一共有三个版本,Windows64、Windows32、Mac。API变化很剧烈,版本更新频率较高。
(3)创建项目 微信开发者工具下载安装完成后,首先需要开发者的微信进行扫码登录,然后界面会出现填写小程序 AppID 和项目文件存储路径的页面,开发者选好存储文件夹,写好项目名称,点击新建就可以完成项目的创建。 微信小程序研究团队很人性化,为了便于初学者快速掌握了解小程序的代码结构与特性,会帮助初学者建立一个简单的 demo 项目方便学习。
(4)编写代码 在微信小程序中编写代码要符合小程序开发规范,小程序项目主体是app文件,页面由 Pages 创建。描述项目整体的全局文件主要有三个。
表 2.2 小程序文件类型
文件 | 必填 | 作用 |
app.js | 是 | 负责程序生命周期,全局变量,调用API |
app.json | 是 | 全局配置,不支持注释 |
app.wxss | 否 | 页面公共样式表 |
(5) 创建页面 微信小程序创建的每一个页面都在pages目录下,但是创建页面需要在app.json 文件中写出page的页面与路径,才能在pages目录下看到生成的页面。Pages目录下创建每一个小程序页面,页面下都会自动生成四个文件,后缀不同,分别是.js 用于描述页面的脚本文件,.wxml 实现页面结构,.wxss 描述展现样式,.json 用来配置页面文件。
(6)手机预览 开发者工具菜单栏点击预览,会出现当前小程序的二维码,用手机扫一扫可以实现在手机上展示,但是这个二维码具有时效性。
3. 研究计划与安排
(1)2019/1/19—2019/2/28:确定选题,查阅文献,外文翻译和撰写开题报告;
(2)2019/3/1—2019/4/30:系统架构、程序设计与开发、系统测试与完善;
(3)2019/5/1—2019/5/25:撰写及修改毕业论文;
4. 参考文献(12篇以上)
[1]彭守镇.微信小程序应用探究[j].信息与电脑(理论版),2018(22):22-23.
[2]邢榕珊,匡芳君.微信小程序设计[j].计算机时代,2018(08):9-12.
[3]张晓燕.微信“小程序”开发的系统实现及前景[j].电子技术与软件工程,2018(12):49-50.