基于微信小程序的Python语言移动学习平台设计研究

2020-09-11 09:04邱煜炎卢小蝶吴福生
安阳工学院学报 2020年4期
关键词:视图代码界面

邱煜炎,卢小蝶,吴福生

(蚌埠医学院卫生管理系,安徽蚌埠233000)

0 引言

在互联网时代飞快发展的浪潮之中,移动学习已经成为教育行业发展的必然趋势。与传统的课堂学习相比,移动学习可以使用户随时随地根据自己安排进行知识获取,从而激发学习兴趣[1]。Python作为一门编程语言,语法简洁优雅、兼容众多平台[2],并且具有丰富而强大的第三方库,近年来随着人工智能应用的广泛普及,Python语言的热度和影响力持续上升。为此,本文设计并实现了基于微信小程序的Python语言在线移动学习平台,使用户快速掌握Python编程语言,并提供自测练习及第三方库的查阅接口,以满足用户随时学习和方便使用的需要。

1 移动在线学习平台与微信小程序

1.1 移动在线学习平台

随着移动互联网的蓬勃发展,各种在线学习平台不断涌现,脱颖而出的有中国大学生慕课网、网易云课堂、学堂在线等。平台发布及使用方式主要分为两类:一类是基于CS架构,另一类是基于BS架构[3]。

CS架构,即客户机-服务器(Client-Server)架构,该类平台需要在手机端安装专门的应用软件与平台进行交互。因此,庞杂的应用势必耗费手机大量的硬件资源。BS架构,即浏览器-服务器(Browser-Server)架构,该类平台依托手机端浏览器进行网页发布,用户虽然无须安装应用软件,但是各种在线学习平台网址冗长、标签收藏混乱,不方便用户管理、查阅困难,用户体验效果不高。

1.2 微信小程序

微信是当前发展最为迅速、使用人数最多的社交应用手机软件。微信小程序是一个基于微信客户端构建的网页版应用程序,它设计理念简单,无须下载安装即可使用,易于传播,实现了应用程序“触手可及”的目标[4]。

基于以上原因,本文设计了基于微信小程序的Python语言在线学习平台,无须安装软件,不占用内存,方便管理,以达到用户高效检索、便捷学习的目的[5]。

2 关键技术

2.1 开发工具

本项目使用的是腾讯公司推出的微信开发者工具,其提供了完整的MINA框架[6]。MINA是一个网络通信应用框架,主要分为两个部分:页面视图层和应用逻辑层。其中,页面视图层进行界面的渲染,渲染部分由wxss和wxml文件共同构成,wxml用来设计页面的结构,wxss用来设计页面的样式[7]。应用逻辑层有处理事务的功能,由Java Script实现逻辑交互、网络请求、数据请求等功能[8]。视图层和逻辑层利用系统层的JSBridge通信,视图层将触发的事件通知逻辑层进行数据处理;逻辑层把数据变化返回到视图层,从而实现视图层页面更新,如图1所示。

2.2 业务逻辑ThinkPHP框架

图1 MINA框架

本文利用ThinkPHP框架实现服务器后台业务逻辑功能。ThinkPHP是一种高效敏捷的Web框架,可以让开发更关注具体业务逻辑实现,不需要关心程序的底层实现原理,提高程序的开发效率[9]。它基于PHP语言,采用MVC设计模式,即模型(Model)、视图(View)和控制(Control)实现业务逻辑。框架已经构建好常用的功能类库,以帮助构建稳定、快速、高效建立在线学习平台系统;其次,该系统因为框架的使用使得本身的扩展性、灵活性、维护性、适应需求方面获得最大化的增强。

2.3 数据库连接

Mysql数据库是互联网行业最流行的关系型数据库管理系统,通过微信小程序开发者工具与数据库连接实现系统的数据管理功能,在微信小程序开发者工具JS中编写请求代码,向数据库发送数据请求,数据库接收到数据请求后在数据库中查询到所需数据并返回给微信小程序的逻辑层,最终的数据通过视图层显示在微信小程序的界面。以获取自测成绩数据为例,微信小程序请求数据代码和数据库返回数据代码如下:

请求数据代码

3 主要功能实现

3.1 架构设计与系统流程

本系统基于ThinkPHP框架的MVC开发模式,系统架构设计见图2。程序运行流程是首先通过微信小程序打开Python语言在线学习平台,进行授权操作,以获取用户的基本信息如头像、用户名等,如果拒绝授权将退出返回。用户身份认证体系采用token令牌请求接口,微信小程序调用接口,经过数据验证层,判断参数是否合法,然后由Controller层访问Model数据层,业务逻辑需要调用Server层里面的方法,最后由Model层访问数据库DB层,返回数据给小程序。Controller层主要进行请求的分发,Model层主要处理业务逻辑和访问数据库获取数据,Server层主要进行业务代码的封装,为Controller层提供调用。

3.2 用户模块

用户模块主要有3个功能,一是获取微信用户信息,二是获取用户学习进度,三是浏览收藏的第三方库条目。通过微信小程序自带的登录认证体系获取微信用户信息,如图3所示。

图2 系统架构设计

图3 用户登录界面

打开微信小程序,扫码登录之后,会显示出微信小程序的首页。微信小程序的界面主要是通过wxml和wxss来显示的,对微信小程序来说,视图层就是他们的集合,首页是一个欢迎页面,windows用来设定标题、背景、颜色等属性,代码为

此外,tarBar用来实现与其他功能页面的衔接与跳转。

3.3 视频课程学习模块

视频课程以章节目录方式进行展示,用户通过滑动列表进行点击、选择学习视频,见图4。章节界面代码由wxml与wxss组成,wxml中使用swiper轮播图组件实现图片的动态变化,使用navigator实现章节的对应跳转.wxss中设置了轮播图和图片的长、宽属性,设置了button按钮边框、颜色以及view的属性。

视频播放界面主要由视频跟内容简介组成,简介与视频内容同步以方便用户理解与记忆。视频内容以wxml形式进行播放,文字简介以text文本框进行展示,见图5。视频数据流通过微信小程序开发者工具与云存储服务器建立连接,利用JavaScript脚本向服务器发送请求,当服务器接收到视频请求后将相关视频并返回给微信小程序的逻辑层,最终的视频会通过视图层显示在微信小程序的界面。

图4 课程目录列表

图5 视频播放界面

3.4 自测模块

自测模块主要分为在线测试和成绩解析两部分。习题库通过程序后台管理端进行操作,题型涉及判断、单选、多选和填空四类。题型、分值、题目及答案以数组形式构建数据结构,以单选题为例,其代码为

前端利用微信小程序开发工具的wxml和wxss对习题界面进行布局与构造,见图6。

图6 习题界面

3.5 第三方库查询模块

强大而易用的第三方库,使Python语言在人工智能领域受到学界和工业界的强烈追捧。为方便用户查询,并能做到收集和掌握,平台嵌入了Pyhton第三方库汇总和查询模块。利用Python的Scrapy跟踪github网站,并周期性抓取第三方库资源列表以做到实时更新。抓取内容主要涉及库名、简介以及官网链接地址,此外,小程序界面通过JavaScript设置收藏功能,以方便用户保存利用,代码为

4 平台发布及运行测试

小程序发布的流程如图7所示。

图7 发布流程图

首先在本地计算机设计完成系统的主要功能模块的开发版本,然后,利用微信公众平台提交开发版本程序,当审核通过后就转换成线上版本。用户通过微信扫码关注该小程序即可在线学习。

在服务器端,平台采用阿里云服务器基于Linux内核的Centos7.0操作系统,并需要安装配置相关支持软件如PHP、Python、mysql和nginx等,代码为

为检验平台运行效果,需要进行相关系统评测,相关指标见表1。

表1 系统测试指标

当平台通过以上一系列性能指标评测后,笔者邀请20名在校大学生进行用户体验测试。

参与者通过微信扫描二维码登录,使用学习平台,并给出反馈意见。总体上说,用户对该平台的使用满意度评价较高,体会到基于微信小程序的平台学习Python编程语言带来的新颖性和便利性。此外,评价的反馈缺陷主要体现在3方面,①平台学习模块单一,内容不够丰富,不能满足多层次用户的知识需求;②界面不够美观,颜色搭配不合理,UI交互不够友好;③用户体验不流畅,多并发条件下易出现卡顿现象。

5 结语

随着微信用户体量的不断增加,基于微信小程序无须下载即可使用的特点,本文设计并开发了基于微信小程序的Python语言在线学习平台。实现了在线视频学习、在线测试、Python第三方库查询收藏等功能,具有移动学习便利性的优势。在以后的设计中,逐渐丰富学习平台的功能,如增加学习社群、在线编译等内容;优化设计界面,可参考优秀的小程序模板,对界面及按钮等细节的颜色做合理搭配,以做到统一协调[10];后台增加Redis缓存,已满足多用户并发访问的需要。此外,要设置平台安全机制,增加防火墙以及数据加密功能,以保证用户数据不受侵犯。

猜你喜欢
视图代码界面
微重力下两相控温型储液器内气液界面仿真分析
国企党委前置研究的“四个界面”
扁平化设计在手机界面中的发展趋势
创世代码
创世代码
创世代码
创世代码
视图
Y—20重型运输机多视图
SA2型76毫米车载高炮多视图