基于iOS的微课视频学习APP的设计与实现

第21卷第8期

2018年8月

文章编号：

2096-1472(2018)-08-46-04

软件工程

SOFTWARE ENGINEERING

Vol.21 No.8

Aug. 2018

DOI:10.19644/2096-1472.2018.08.014

基于iOS的微课视频学习APP的设计与实现

黄浏展

(武汉职业技术学院计算机与软件工程学院，湖北 武汉 430074)

摘 要：

移动学习日益成为一种流行的新型学习模式，针对高职院校学生学习特点及微课特征，借助基于iOS的移

动应用开发技术，设计并开发一款可用于微课学习的APP。该软件实现了微课视频在线观看、下载收藏、课程问答、课

后练习、资源搜索、历史查看等功能，为学习者提供了一个随时随地的进行学习与互动交流的移动平台，能够满足个性

化学习、移动化学习、碎片化学习的需求。

关键词：

微课；视频；iOS；应用开发

中图分类号：

TP311.1

文献标识码：

A

Design and Implementation of Micro-Lesson Video Learning APP Based On iOS

HUANG Liuzhan

(

School of Computer and Software Engineering

,

Wuhan Polytechnic

,

Wuhan

430074,

China

)

Abstract:Mobile learning is becoming a popular learning view of the characteristics of students' learning and

the micro-lessons in higher vocational colleges,the mobile application and development technology based on iOS is used

to design and develop an app for micro-lesson software realizes the functions of micro-lesson video online

watching,downloading collection,questions and answers,after-class practice,resource search,history review and so

provides a mobile platform for learners to learn and interact with each other anytime and anywhere,and can meet the needs of

personalized learning,mobile learning and fragmentation learning.

Keywords:Micro-lesson;video;iOS;application development

1 引言(Introduction)

近年来智能手机的普及加速了对于移动学习的研究和实

践。各类资源网站将微课应用的各项功能全部在移动终端上

实现。而学校这一块相对落后，部分高校和中小学虽然建立

了自己校内的资源网站，但基本上没有针对本校的资源应用

的移动平台。为了满足学生随时使用移动终端上网的碎片化

学习的需要，设计和开发一款基于iOS的移动终端学习APP。

通过搜索和展示学校已有的微课资源，方便学生随时学习与

课程相关的微课视频。

应用层和表示层，数据层由通常所说的服务器端后台构成，

后台以Mysql+PHP的模式，其主要功能是响应服务层，以及

系统的数据存储和管理。表示层向应用层发送HTTP请求并显

示应用层响应的JSON数据；应用层主要响应表示层的HTTP

请求、处理业务逻辑及对数据层返回的数据进行格式化处

理，处理后将数据在表示层显示

[1]

。

2.1 iOS 系统

iOS是苹果公司早在2007年专为其手机产品开发的操作系

统，随着苹果产品的发展，iOS逐渐演变为苹果移动产品的专

有操作系统，被广泛应用在苹果的各种移动终端。iOS系统因

为其相对封闭，对软件产品安装审核要求较严，因此生态坏

2 相关技术(Related technology)

本系统在iOS平台基础上采用B/S三层模式，即数据层、

基金项目：湖北省教育厅2017年科学技术研究计划指导性项目“基于iOS的微课视频学习App设计与开发”(项目编号：B2017516).

第21卷第8期

47

黄浏展：基于iOS的微课视频学习app的设计与实现

境较其他应用系统安全性更高

[2]

。iOS系统作为苹果设备的专

属系统，软硬件可以较好的配合，运行更为流畅和稳定。同

时，苹果系统界面设计美观，其人性化的设计给用户很好的

体验，是当前手机用户青睐的移动终端操作系统。

2.2 PHP+MySQL

PHP是一种脚本语言，被广泛应用于各类服务器端，和

其他技术相比，PHP是开源的，可以免费使用。由于PHP支

持开放数据库互连，因此PHP可以连接任何支持该标准的数

据库，如MySQL、SQL Server和DB2等。PHP还支持将数

据转为XML/JSON格式。目前被广泛用于APP数据接口的开

发，PHP和MySQL经常被一起使用作为后台开发

[3]

。

MySQL是一种中小型关系数据库系统，体积小、速度

快，支持标准的SQL查询语言，广泛应用于中小型网站数据库

服务器。同时，MySQL支持Java、C#、PHP等高级语言的

数据接口开发，因此本应用选择PHP+MySQL用于测试服务

器后台数据的管理与接口的开发。

2.3 JSON数据解析

JSON是一种轻量级的数据交换格式，是基于Java Script

的一个子集。它是一种与开发语言无关的数据格式，可以实

现在多种语言之间进行数据交换的能力，是一种广泛应用的

数据交换格式，当前被常应用于安卓和iOS应用开发的数据

交换。JSON主要有两种数据结构。第一种是由键值对组成

的数据结构，这种数据结构在不同的语言中实现也不同，在

Objective-c中是一种NSDictionary对象。第二种是有序集

合，这种数据结构在不同语言中可能有NSArray、vector、数

据和序列等实现，在Objective-c中是以NSArray来实现。因

为JSON数据的这些特征，因此JSON数据可以转换成不同语

言的数据类型，JSON数据解析就是将JSON数据转换成对应

语言的数据格式

[4,5]

。

3 需求分析与系统功能设计(Requirement analysis

and system function design)

3.1 需求分析

微课是以教学视频为主要呈现形式,围绕课程知识点、

例题习题、疑难问题、实验操作等开展的简短、完整的教学

活动，以及相关资源的有机结体。从这个概念可以得出“微

课”是简短又完整的教学活动,它不仅仅包含视频，而且包括

与之相关的ppt、习题等

[6]

。

本项目根据微课的这些特点进行设计。首先微课视频都

是限制在几分钟之内，视频文件较小，适合网络传输和移动

设备播放；其次APP除了可以播放微课视频，还可在线或下

载学习微课相关资源。

APP除了根据微课的特点设计相关功能外，还结合学生

的学习特点，从易用性、趣味性着手。界面和功能设计力求

简单，APP主要包括账户管理、视频学习、在线咨询、课后

练习等功能。注册登录也以简单实用为原则，仅需通过手机

号进行注册和登录，还可以利用iPhone的的指纹识别技术，

实现APP指纹登录，对于在线咨询采用QQ在线咨询。课后练

习从趣味性考虑采用游戏答题积分的方式。

根据以上分析，项目主要实现以下几个功能。账号管理

实现用户的注册、登录，注册功能以学号作为主键，绑定学

生的手机号。登录可以学号登录，或者手指指纹识别登录。

视频学习功能可以在线播放或者下载视频在本地播放。课后

练习功能设计成答题积分游戏，课后练习的积分可以作为老

师给学生平时成绩的参考。在线咨询可以利用腾讯QQ的第三

方接口，实现QQ在线交流。

3.2 系统功能设计

针对项目需求分析，对基于iOS的微课视频学习系统进行

详细的功能设计，系统结构图如图1所示。

图1 系统结构图

Fig.1 System structure chart

系统总体框架主要包括登录注册模块、主页面模块、视

频分类模块、视频练习模块和个人中心模块。登录注册模块

设置师生两种不同角色的登录界面，涉及用户注册、登录、

密码修改，以及找回等内容。主页面模块包括App启动，以

及视频列表加载和展示。视频分类模块包括视频的分类、播

放、下载、收藏、分享和评论等，页面采用了左侧导航的设

计，使分类清晰简洁，方便用户寻找与观看等一系列操作。

视频练习模块包括视频的观看和对应习题的练习，用户通过

练习来了解自己对知识点的掌握情况，以便调整学习进度和

学习计划。个人中心模块包括个人信息、我的收藏、我的缓

存、我的历史、我的练习、安全升级、系统设置和意见反馈

等，该模块主要是用户观看视频和练习的状态的记录，以及

账户信息和安全的管理，由于版块功能过多，采用列表式的

设计显示模块，清晰简洁，使用户一目了然。

48

软件工程

2018

年

8

月

4 APP实现及关键技术(APP implementation and

key technologies)

4.1 总体架构

APP客户端整体采用MVC(Model View Controller)框

架。MVC是一种将业务逻辑、数据、界面分离的方法组织代

码的框架。在改进界面及用户交互的同时，不需要重写业务

逻辑，将app的输入、处理和输出分离。其中Model表示数据

模型，它是应用程序的核心，用来对应用所需数据进行加工

处理，为应用提供统一的数据形式。View表示视图，也就是

应用的数据显示，可以通过iOS提供的UILabel、UIText、

UIButton、UITableView、UICollectionView等控件对应用

所需数据进行页面布局，一般从美观、实用和高效三个方面

来考虑。Controller代表控制器，用于用户交互，和应用逻辑

整体控制。

常用的控制器有UIViewController、

UINavgationController、UITabBarController、

UIViewController用于对某一功能模块的控制或者与用户

的交互，UINavgationController和UITabBarController

用于对一个或多个控制器的管理。本应用包含首页、分

类、练练、我的四个主要模块，以及登录注册模块，应用

UITabBarController和UINavgationController分别对这两

个部分进行控制管理，实现各功能模块彼此之间的控制和跳

转，如图2所示。

图2 APP实现框架

Fig.2 Implementation framework

4.2 界面实现

APP首页主要用于展示用户可浏览的课程，包括我的课

程、最新课程、推荐课程等，这些内容会随着后台数据的变

化而变化，但整个首页面显示形式基本上是固定的。为了不

让APP针对不同的数据反复创建视图对象，可以采用iOS提

供的重用机制，反复使用可重用的视图对象。首页页面如图

3所示，根据其格式特征，以及上述分析，可以很好的利用

UICollectionView的重用功能来实现视频资源的展示。

图3 首页

Fig.3 Homepage

图4 分类

Fig.4 Category

图5 视频播放

Fig.5 Video playing

分类模块用于分类显示系统所有视频资源(图4)，该模块

采用表视图(UITableView)来实现，表视图也是iOS中典型的

可采用重用机制的控件，视频列表采用一个自定义cell来进行

布局，实现界面的统一协调，根据接口返回的数据的不同，

显示不同的视频信息。同时，采用下拉刷新的方式用于加载

最新的数据或者在在网速较慢的情况下重新加载数据。左边

栏采用自定义的视图，通过选择不同的标签得到不同分类的

课程视频资源

[7]

。

第21卷第8期

49

黄浏展：基于iOS的微课视频学习app的设计与实现

视频播放是APP最重要的一个功能，在该页面自定义了

一个播放器(图5)，使用AVFoundation框架中的AVPlayer类

实现播放功能

[8]

。同时在这个界面设置了评论区，用户可以

相互评论交流，也能对微课视频发表评论。视频播放界面左

下角咨询按钮利用腾讯的接口，实现QQ联系授课教师答疑解

惑，在播放界面还可以将视频添加到我的缓存中进行下载方

便以后观看，也可以添加到我的收藏。

5 数据请求(Data request)

数据请求是iOS应用开发最重要的一个环节，没有数据的

应用只是一个空壳。本应用数据均使用MySQL数据库进行存

储，对需要调用的数据，使用PHP技术对数据库进行查询，

转换成JSON数据格式。所有要从网络下载或查询的数据均采

用JSON数据格式作为数据接口，项目中所要使用的图片、问

题和答案等信息均通过数据库查询后转换成JSON文件格式，

这种格式的数据都以键值对的形式表示，APP的界面数据通

过网络获取JSON数据内容，这样可以很好的实现界面呈现

内容与界面版式的分离，即用一种界面版式,读取若干界面内

容,保证了内容呈现风格的一致性,同时减小了文件的大小。

服务器端数据与客户端也保持了相对的独立性，便于数据和

界面的移植。

数据存放于服务器端，客户端使用数据需向服务器端发

起HTTP请求。在应用中，数据获取的方法和顺序会影响获取

数据的速度，进而影响整个应用的速度。在本应用中涉及的

数据有文本数据、图片数据和视频数据等，为满足需求使用

异步POST数据请求方式。在异步请求过程中，会涉及多任务

同时处理的问题，比如请求数据和显示获取到的数据，这时

就必须用到线程来处理问题。一个线程同一时刻只能处理一

个任务，多个任务同时执行就必须使用多线程。因为数据请

求是一个耗时操作，涉及服务器的反应速度、网络延时等问

题，需要等数据请求完成后才能在UI上显示数据，如果在这

个时间段用户得不到任何响应，将是一种很不好的体验。因

此将数据请求操作单独放在一个线程，而与用户交互的操作

放在主线程，以此保证应用及时响应用户操作。

在本应用中凡涉及多任务处理均使用GCD多线程技术。

GCD是苹果公司为多核的运算提出的解决方案，会自动利用

更多的处理器核心。GCD是基于c语言的，会负责创建线程和

调度需要执行的任务，有系统提供线程管理。GCD提供了队

列(Dispatch Queue)来对应用中的多任务进行管理。

数据请求成功后，会对服务器返回的数据进行JSON解

析，并刷新UI界面显示结果。

6 系统测试(System test)

APP实现后必须对其进行系统测试，测试可以用模拟器

测试，也可以采用真机测试。Xcode自带有各个版本的iPhone

模拟器，为了确保APP能在各个版本的iPhone可兼容运行，

可以根据需要选择不同大小的屏幕。除了模拟器测试，还可

以采用真机测试，真机测试更能体现APP在真机上的运行效

果。本APP在iPhone6、iPhone6 Plus真机通过了测试。在进

行真机测试时，系统要求提供开发者证书，因此在测试之前

必须注册APP ID，申请开发者证书。系统测试主要包括功能

和性能测试。

6.1 功能测试

根据微课视频学习APP的功能设计，选取了其中的几个

主要功能进行了测试。首先是用户的注册和登录功能，用户

的注册采用的是手机验证码注册，注册成功后采用手机号和

密码进行登录。使用了多个手机号进行了注册登录，均可以

成功实现发送验证码注册，注册后的手机号也可以成功登录

系统，并进行操作。

APP的视频播放功能和习题练习功能也能按照原设计要

求正常运行。在测试服务器中存储了几个微课视频和相关的

习题，可以通过APP对其进行读取，视频可以实现播放、暂

停、快进和停止，练一练可以实现习题的选择和对错判断

功能。

6.2 性能测试

性能测试是在保证APP正常运行，实现所设计的功能

之后的最后一环。本APP开发工具Xcode自带有专门的性能

测试工具—analyze静态分析工具和Instruments-Leaks动态

分析工具，通过运行性能测试工具analyze进行测试，没有

内存泄露、空指针、对象引用、数值赋值等方面的错误。

Instruments-Leaks有很多跟踪模块可以动态分析和跟踪内

存，CPU和文件系统。利用这两个工具，对应用代码进行了

优化改进。除此之外，APP的性能测试还包括负载测试和压

力测试，目的是为了验证能否实现用户提出的性能指标，发

现系统中存在的性能瓶颈，用以进一步优化系统

[2]

。

7 结论(Conclusion)

微课视频学习APP具有较强的针对性和可移植性，通过

简单的数据处理可以较好的将学校现有的微课资源通过APP

进行在线学习，同时APP简单易用，使用方便，教师如能将

APP的使用与教学相结合，可以较好的提高学生的学习兴

趣，将为在校学生利用微课进行随时随地的学习提供便利。

参考文献(References)

[1] 胡俊平,谭颖,热依汗古丽.艾尔肯.基于iOS平台的华阳社区

50

软件工程

2018

年

8

月

资讯共享服务“乐助”的设计与开发[J].西南民族大学学报

(自然科学版),2018(2):184-193.

[2] 尚志会,罗旭,李洪进,等.基于iOS平台的新闻播报系统设计

与实现[J].安阳工学院学报,2018(2):65-68.

[3] 王玉凡.基于PHP的Web查询系统的实现[J].河北软件职业技

术学院学报,2016(4):49-51.

[4] 郭忠南.基于Android的移动微课平台的设计与实现[J].电脑

与信息技术,2016(04):38-43.

[5] 周建亮,朱晓民.基于iOS平台智能点餐系统的设计与实现[J].

软件,2015(1):131-134.

(上接第59页)

获取VPN服务器登录权限，通过实验教学中心开放网络平台

详细查阅相关实验案例指导书，理解基本原理后进行相应实

验操作。在学生申请期间，对应实验设备会接入有ups电源保

障的网格实验室，保证24小时开放共享。学生进行实验时，

可选择网络平台中空闲的虚拟机，启动虚拟机内相关操作软

件，通过网络串口通信模块将源码或命令写入设备，同时读

取对应虚拟串口的反馈数据。下一步我们还计划在虚拟机中

开放网络视频端口，使学生可以实时观察实验结果。

目前可开放RFID读卡器实验、传感器原理基础实验、光

纤传感器应用共三类20个基础实验案例。

(2)基于竞赛培训的物联网专业实验室开放制度。

针对竞赛培训的复杂程度不同，建立物联网专业实验室

开放制度，主要包括集中培训与自由开放两类。集中培训在

暑期进行，由实验教师主导，负责由浅入深的进行实验软硬

件操作技能培训。自由开放采取申请授权的方式，将获得授

权的相关人员的生物信息(指纹、人脸等)导入物联网专业实验

室的门禁管理系统，允许其在经过基本安全培训后，在非授

课时段进入物联网专业实验室，实验教师可通过网络摄像头

对其行为进行监控管理。

[2] 周慧颖,郄海霞.世界一流大学工程教育跨学科课程建设的经

验与启示[J].黑龙江高教研究,2014(2):50-53．

[3] Miller K,Pegah lly at the Desktop[C].35th

Annual ACM SIGUCCS Conference on User Services.

USA:Orlando,2007:255-260.

[3] 王勇.理工类高校物联网专业创新工程型人才培养方案研究

与建设[J].计算机教育,2013(8):15-18.

[4] 王华君.物联网专业学生创新实践能力的培养路径解析[J].当

代教育实践与教学研究,2016(2):62.

[5] 王雪峰,曹荣.大工程观与高等工程教育改革[J].高等工程教

育研究,2006(4):20-25．

[6] Creasy Origin of the VM/370 Time-Sharing System[J].

IBM Journal of Research and Development,2010(25):483-490.

[7] 刘强,崔莉,陈海明.物联网关键技术与应用[J].计算机科

学,2010(6):1-4.

[8] 洪大用.在“双一流”建设中大力加强本科人才培养[J].中国

大学教学,2016(4):9-16.

[9] 张长海,熊建文,林冬华,等.全面深化本科入才培养改革的若

干思考[J].学生发展,2015(15):54-58.

[10] 阚江明,张超一,林剑辉,等.物联网专业信号与系统课程教学

改革与探索[J].中国现代教育装备,2017(4):25-27.

[11] Koo B,Duong T E,Lee ping all Interdisciplinary Social

Entrepreneurship Curriculum[J].Entrepreneurship Educafion

in Asia,2011(1):183-198．

[12] 杨丽媛.本科人才培养过程中的课程管理和改革新途径[N].

西南师范大学学报,2015-01-029(1).

[6] 李蕾,李晓丽.基于iOS手持终端的移动学习资源设计研究[J].

中国电化教育,2014(12):93-97.

[7] 黄浏展.IOS重用机制研究与实践[J].软件导刊,2014(11):122-

125.

[8] 曾垂鑫,王加俊,申丽萍,等.基于iOS的移动学习直播互动平

台[J].计算机工程,2013(7):314-317.

作者简介

：

黄浏展

(1975-)，男，硕士，副教授.研究领域：高职教育教

学，移动应用技术.

5 结论(Conclusion)

无论是从教育的起源和本质来讲，还是从人类第一所大

学诞生来讲，任何一所学，特别是高等学校都必须把人才培

养作为首要职责来抓

[12]

。在新工科背景下，新兴产业发展及

传统产业改造升级，对培养相关专业人才产生了极大的社会

需求，因此相应专业的实验教学体系必须不断探索以适应不

断变化的社会需求，其中增强学生的实验实践能力，培养跨

专业、学科的复合型创新能力将会比以往更加重要。探讨、

分享物联网专业实验教学体系建设的优缺点和变革方向，将

会为新工科背景下的各行业提供更多优秀的复合型人才，对

“中国制造2025”等国家重大战略提供有力支撑。

作者简介

：

王 毅

(1984-)，男，硕士，实验师.研究领域：物联网工程.

张沪寅

(1962-)，男，博士，教授.研究领域：计算机科学与

技术.

黄建忠

(1975-)，男，博士，高级实验师.研究领域：计算机

科学与技术.

何承达

(1990-)，男，硕士，助理实验师.研究领域：软件

工程.

彭红梅

(1972-)，女，硕士，讲师.研究领域：软件工程.

参考文献( References)

[1] 中华人民共和国教育部.教育部办公厅关于推荐新工科

研究与实践项目的通知[教高厅函〔2017〕33号]［EB/

OL]./srcsite/A08/s7056/201707/

t20170703_.