基于小程序云开发的垃圾分类小助手的设计与实现
2020-02-03徐文超焦诗琪
徐文超 焦诗琪
(广州大学华软软件学院 广东省广州市 510990)
1 引言
随着经济的发展,人民的生活水平逐渐提高,垃圾的产量如喷发式地剧增。垃圾分类回收问题已日益严峻,垃圾分类回收已逐渐成为居民日常生活中不可或缺的一环[3]。然而,垃圾分类效果并不明显。主要原因,一是国内缺乏对垃圾分类回收的宣传和普及教育,二是人们对垃圾分类的知识不够完备。
很多人都表示愿意支持垃圾分类行动,在日常生活中也会有意识地主动去将垃圾放入标明分类的垃圾桶内,但是由于对垃圾分类的知识不够完备,常常出现不知道将垃圾放入哪类垃圾桶的情况[4]。
微信小程序具有非常好用用户体验,无需安装,有微信就可以使用。所以,本文使用微信小程序云开发技术,设计开发了垃圾分类小助手小程序,帮助人们解决垃圾分类知识学习,物品分类查询,以及垃圾分类点定位和查找的问题。
2 系统设计
2.1 系统总体设计
该小程序主要分为用户端和管理端。用户端有4 个功能模块,分别是词典模块、驿站模块、资讯模块以及我的模块。而管理端主要是有2 个功能模块,一个是词库管理,另一个是资讯管理。该小程序的系统功能架构如图1 所示。
用户端模块功能说明:
(1)垃圾分类词典:通过输入关键词查询垃圾的所属分类,投放要求。词典中查询垃圾分类的物品数据是都真实可靠的,来源于聚合数据。目前,数据足够丰富,记录有2000+条。
(2)驿站管理:驿站中自动定位用户当前所在位置,显示当前区域及其垃圾分类相关地点的地址信息。同时用户可自主选择不同省市区,显示选择区域的垃圾分类相关地点的地址信息。也可以直接通过输入垃圾分类点,查询到该点对应的地址信息。
(3)咨询管理:资讯中用户可浏览有关垃圾分类最新最热门的文章。
图1:系统功能架构图
图2:垃圾分类小助手首页
图3:词典搜索界面
图4:小程序驿站界面
(4)用户中心:用户绑定,我的收藏,我的评论等。
管理端模块说明:
(1)词库管理:对词库数据进行管理,新增,修改,删除。
(2)资讯管理:对热门垃圾分类资讯进行发布,删除。
2.2 系统模块设计
2.2.1 分类词典模块
按关键词查询:用户可以输入关键词进行模糊查询,查询物品相应的所属的分类。
按分类查询:也可以通过点击代表着生活垃圾的四大分类,来查看对应分类下的详情,如分类的介绍,分类的投放要求以及分类下的物品,而分类下的物品还可以通过点击26 个字母作为索引,快速地查找。
2.2.2 驿站模块
垃圾分类点定位查询:用户定位自己所在的位置,获取当前所在区域附近的垃圾分类点。
省市区垃圾分类点查询:通过选择不同省市区来获取其他省市区对应的垃圾分类点。
按关键词查询:还可以通过分类点关键词,直接查询垃圾分类点的准确位置。
2.2.3 资讯模块
用户在资讯可以对文章进行浏览、点赞、收藏、评论,对感兴趣的文章进行查询等操作。
2.2.4 用户中心模块
用户在个人中心点击登录,进行注册登录,登录后的用户可以查看用户对应的数据,如可以查看自己文章评论的记录,已收藏的文章,以及可以查看自己点赞了的文章。
2.2.5 词典后台管理
管理员在后台的词典管理中可以丰富词典内容,对词库进行新增物品的操作。
2.2.6 资讯后台管理管理员在资讯后台管理中,可以对文章进行新增,修改,删除操作,还可以对文章评论进行删除。
3 系统实现
3.1 首页
添加该小程序后,会来到小程序的首页。如图2 所示。
3.2 词典模块实现
从首页点击词典,点击搜索框后,输入关键词,可进行模糊查询物品对应的垃圾种类,如图3 所示。
从首页点击生活垃圾的四大分类中的任一种类,可查看到分类的有关介绍内容及对应物品。
该模块的开发的核心处理是数据绑定和渲染。在词典页面上,通过两个大括号将对象数组kindList 包起来进行数据绑定,通过wx:for 遍历循环对象数组kindList,从而重复渲染页面上对象数组kindLsit 中各对象里的数据属性color、imgPath 和categroy,使用bindtap 绑定onClick 事件。
由于生活垃圾日常分类是四大分类,但还是有特殊的分类,如装修垃圾、大件垃圾和非生活垃圾。所以,设计上,常见的四大分类是显示在首页词典界面的,而特殊的分类,则是通过搜索生活垃圾可以查见到该垃圾属特殊分类。显示生活垃圾日常的四大分类图片而不显示特殊的垃圾分类图片,则需要用到条件渲染wx:if 来做显示隐藏的处理。
3.3 驿站模块实现
用户点击驿站界面,会自动定位用户位置,显示用户当前位置所在区域垃圾分类相关的地址列表,如图4 所示。
还具有的功能是通过选择省份城市地区来查询不同省份城市区县垃圾分类相关点地址。还可以输入垃圾投放点关键词,查询垃圾分类相关投放点。
该模块主要涉及到的技术有:
3.3.1 实例化核心类
在使用腾讯地图服务前,首先需要申请密钥,开通webservice服务,下载JavaScriptSDK, 在设置的开发设置中设置request 合法域名,添加https://apis.map.qq.com。完成这些操作后,引入SDK文件,再实例化SDK 类的对象。实例化核心类的关键代码如下所示:
3.3.2 获取位置信息及逆地址解析
调用wx.getLocation(),获取到的信息只是当前位置的经纬度,对用户而言,是不够直观地表现用户当前的位置的,用户体验性不够好,所以需要借助第三方地图服务,本文使用的是腾讯地图服务来实现获取当前位置所在的省份、所在的城市、所在的区县。通过wx.getLocation 获得的经纬度为基础,基于获取到的经纬度,再通过调用reverseGeocoder 来进行地址逆解析,简单而言就是坐标位置描述,调用成功会返回结果集,将结果集中含有当前地址的省份城市地区信息的对象,赋值给currentRegion。关键代码如下:
3.4 资讯模块实现
用户可浏览有关垃圾分类最新最热门的文章。文章分为两类,最新文章和热门文章。
最新:最新的垃圾分类政策或者知识。按发布日期降序排列。
热门:是在所有已经发布的文章的基础上,进行数据统计后,形成新的显示分类。热门文章主要是按浏览、点赞、收藏和评论四个维度划分,按次数降序排列。
3.5 个人中心模块实现
个人中心,用户可以进行登录注册,查看“我的收藏”,“我的评论”,“我的点赞”。若是管理员,会有“后台管理”模块。
4 结语
本文基于微信平台结合微信小程序,云开发技术,设计实现了垃圾分类小助手,并对实现的关键代码进行了说明。该小程序满足了使用者对垃圾分类知识的学习,以及对物品所属分类进行快速查询的需求。并且还结合腾讯地图的地址解析服务,帮助用户定位和查找附近的垃圾分类点,具有较好的应用和推广价值。