基于Android平台的在线教育直播系统设计

2019-02-25 13:16许志明瞿文政陈俊填王伟楠万智萍
计算机技术与发展 2019年2期
关键词:视图列表摄像头

许志明,瞿文政,陈俊填,王伟楠,万智萍

(中山大学新华学院,广东 广州 510520)

0 引 言

随着3G、4G移动互联网,视频编解码技术的发展,以实时性为核心的手机视频直播系统在应用市场上越来越流行。当前平台都是以娱乐性直播为主,通过各种方式吸引观众的眼球来增加观看人数,而以在线直播教育为主的平台比较短缺。基于此,文中设计了一种专门在Android平台上使用的在线直播教育系统[1]。

该系统通过手机摄像头采集视频信息,并通过无线网络或移动网络传输到服务器,服务器转发视频至另一接收端[2]。文中先介绍了RTMP协议的可行性,然后再描述Android的开发框架和开发流程,并在Android Studio 2.1.2开发环境下采用模块化编程的思想进行编程开发,重点研究整个在线直播教育系统的设计思路、实现方法以及实现效果。

1 实时信息传输协议(RTMP)

RTMP协议的全称是real time message protocol,即实时信息传输协议,它是Adobe公司为服务器和Flash播放器之间视频、音频和数据传输开发的开放协议[3]。而在客户端方面,其中最知名也最受欢迎的RTMP客户端是Adobe公司的Adobe Flash Player,目前主流的媒体流传输协议便是RTMP,广泛应用于直播领域,可以说市场上的直播平台大都采用RTMP协议进行开发。文中也使用RTMP进行直播平台的开发。RTMP协议是传输层协议,是基于TCP的协议。创建的是长连接。它像一个用来装数据包的容器,这些数据可以是AMF格式的数据,也可以是FLV中的视/音频数据。

RTSP是一种实时流媒体传输协议,专门用于在IP网络上传送实时多媒体数据。RTSP在数据传输时通过TCP或RTP协议。由于RTSP是双向的,因此可以对流媒体提供播放、暂停、快进、慢退等操作。文中选取RTSP作为流媒体传输协议[4]。与RTMP相比,RTSP具有更高的实时性。因此要达到延迟1 s甚至更短时,只有RTSP可以满足要求。

2 Android平台

2.1 Android的开发环境

随着移动互联网技术和通信技术的发展,Android平台已经成为智能手机中用户量最多的操作系统,且能提供良好的人机界面。更多的开发者选择Android平台进行开发[5]。

Android是Google于2007年1月5日宣布的基于Linux平台的开源手机操作系统的名称,该平台由操作系统、中间件、用户界面和应用软件组成,号称是首个为移动终端打造的真正开放和完整的移动软件[6]。

Android平台是开放的,开发的平台允许任何移动终端厂商加入到Android联盟中来[7]。显著的开放性可以使其拥有更多的开发者。随着用户和应用程序的日益丰富,Android平台很快走向成熟。目前Android系统已成为全球最受欢迎的智能手机平台,Android系统不但应用于智能手机,也在平板电脑市场急速扩张。

在2013年之前Android应用的开发工具是Eclipse+ADT,2013年Google在I/O大会上发布了针对Android应用的开发工具Android Studio,它是一款集成开发环境软件,提供了Android应用开发和调试工具。和Eclipse+ADT相比,Android Studio拥有漂亮的UI界面,操作方便快捷,整合了Gradle构建工具使得开发更智能、更方便。

2.2 Android MVC框架

MVC框架是model-view-controller的缩写。作为一种设计模式,它强制性地将一个应用程序拆分成模型、视图和控制器三个核心组件,并让其处理各自的任务,真正实现了高内聚、低耦合的灵活架构,大大降低了程序的复杂性,提高了可扩展性及可重用性[7]。

模型、视图、控制器三者之间的关系和各自的主要功能如图1所示。

图1 MVC组件类型的关系和功能

3 设计思路

3.1 需求分析

根据教师的教学需求以及该在线直播平台的设计初衷,在线直播平台应该达到的目标有以下几点:

(1)直播实时性要好,直播延迟会影响观众观看体验,尽可能降低视频卡顿及延迟是在线直播教育系统的核心[8]。

(2)对所有直播教师进行统计,提供教师查找功能。观众可以在教师列表中查看所有的教师并可从中选出最适合的教师。

(3)具有统计排名功能,能够将直播的相关数据进行统计排名并将排名靠前的推荐给观众。

(4)具有视频观看功能,在观看直播之余还可以观看视频回顾直播内容。

根据上述需求,设计的在线直播平台架构如图2所示[9]。

图2 在线直播平台架构

(1)软件启动时先进入到启动视图层中的欢迎界面Welcome Activity,在欢迎界面中判断是直接进入导航视图层还是跳转至登录界面。

(2)导航视图层主要是提供给用户一个直观的功能选择页面,默认显示的是首页,在首页中有热门的直播视频推荐、教师列表、排行榜、视频列表的跳转选择。用户可以通过点击导航栏中的按钮转换不同的导航页面。

(3)应用视图层是根据导航视图层跳转的选择进行相应功能的实现。

3.2 关键技术

该在线直播平台在开发过程中主要用到了以下关键技术:

(1)导航视图层将导航分为首页、消息、直播、个人四个页面。导航视图层采用Activity内嵌Fragment技术。在Activity中onTabSelected监听底部导航栏的点击事件,根据点击不同的按钮Fragment会进行相应的变换以实现在不跳转的情况下进行不同页面的显示。

(2)教师列表可以直观地查看所有教师的基础资料,具体是利用了RecyclerView控件和其适配器RecycleView.Adapter相结合的方式实现。当用户点击教师的头像时就会触发相应的OnClick事件,根据相应教师的隐藏ID跳转至其详细介绍页面。

(3)视频播放功能是为了方便用户回顾之前的内容,文中利用自定义VideoView来实现此功能。VideoView是安卓自带的播放器控件,继承于SurfaceView主要的功能,用于显示视频文件。通过自定义VideoView修改它的高度和宽度,设置其OnTouch事件来实现手势的控制,使用TextView作为时间的显示、SeekBar作为进度条、ImageView作为控制开关。

(4)直播功能是借助于RTMP协议实现的。主要流程是直播的推流端将视频推流到媒体服务器,媒体服务器再转发给用户观看的拉流端,而视频的推流需要采集直播的视频及音频,对其进行封装处理后才能推流至媒体服务器[10]。

用户观看的拉流端是用于播放RTMP媒体流的视频播放器,需采用第三方框架实现,常用的视频框架有Vitamio和ijkplayer。Vitamio在其商业化后对个人开发者是免费的,对企业是收费的,未避免侵权问题建议采用ijkplaery。文中采用ijkplayer框架,通过封装其播放事件实现RTMP媒体流的播放[11]。

3.3 系统流程

在启动软件后先进行登录检测,只有登录后才能使用软件的功能,登录流程如图3所示。

图3 登录流程

通过登录之后默认进入的是首页,用户可以通过点击软件下方的底部导航栏进行页面切换,也可以点击页面中的按钮使用相应的功能。系统流程如图4所示。

4 系统的设计与实现

4.1 登录的设计与实现

为了实现开启软件时先进入欢迎登陆界面,首先需要在AndroidManifest.xml文件中的Welcome Activity下放置以及属性,在欢迎界面的Activity类中通过延时函数Timer()设置为2 s后跳转至登录界面。

对于登录界面的设计,采用竖状结构排列,界面从上倒下依次为:Logo、账号、密码、登录、注册。账号和密码使用TextInputLayout内嵌EditText。在账号的EditText中设置其hint属性为UserName,而密码的EditText的hint属性设置为Password。

通过登录按钮的OnClick事件对账号密码进行验证,若通过验证则进入主页面,不通过则出现失败提示。注册为Text控件显示通过设置其OnClick事件实现点击跳转至注册页面。

4.2 教师列表及教师资料的设计与实现

为了方便用户选择喜欢的教师,以竖形结构的方式展示所有教师的基本资料以供用户选择。教师列表使用了RecyclerView控件,RecyclerView可以理解为升级版的ListView,拥有比ListView更好的定制功能,在教师列表的Activity类中设置RecyclerView的LayoutManager为LinerLayoutManager便可实现竖形排列,在教师列表的Item设计中,采用传统的头像、名字、简介作为一个教师Item,其中头像使用圆形的ImageView的设计与实现。

图4 系统流程

在教师列表选中点击想查看的教师头像时,会触发教师列表的Activity中OnItemClick的响应事件跳转至相应的教师资料。从教师列表跳转至教师资料的过程中采用了过渡动画中的共享元素变换,只需给教师Item的ImageView添加transitionName属性以及在使用跳转的方法中使用startActivity传入参数Activity、ImageView、transitionName,便可实现共享元素交换。教师资料是教师的个人空间,主要内容为教师的个人简介及其视频的播放地址。教师资料的设计采用CoordinatorLayout布局,在内部使用AppBarLayout作为状态栏内嵌CollapsingtoolbarLayout+Toolbar+ImageView,其中ImageView为教师的图片与教师列表中的圆形头像形成共享元素交换的过渡动画效果,默认显示的是教师图片,当用户往下拉时教师图片会逐渐消失最后变成Toolbar,而CollapsingtoolbarLayout则是用来存放ImageView以及Toolbar的。在AppBarLayout下方为使用RecyclerView制作的自我简介以及视频列表。

4.3 视频播放的设计与实现

视频播放是用于播放教师上传的视频,通过自定义VideoView以及重写播放控制器来实现。首先定义一个继承VideoView的类MyVideo并重写onMeasure设置大小,在视频播放的layout文件中将MyVideo放置在RelativeLayout布局中并使用Button作为播放暂停开关、SeekBar作为进度条、TextView作为时间显示、ImageView作为全屏开关。

在视频播放的Activity类中,通过Button的onClick事件响应视频的播放与暂停,Handler来控制进度条的运行以及时间的显示,通过点击ImageView的点击事件判断视频的横竖屏状态而后改变手机的横竖屏状态,从而达到全屏播放与半屏播放切换的效果。通过设置RelativeLayout的layout_below属性使得用于放置简介及评论的控件放置于视频播放器下方,视频的简介及评论使用ViewPager与Fragment结合的方法实现滑动切换简介评论。

4.4 直播推流端与拉流端的设计与实现

直播是该在线直播平台的核心,直播功能分为两部分,一部分是直播者的推流端,另一部分是观看者的拉流端。

为了解决数据同步的问题,在移动终端上通常采用两种方法。一种是移动终端定时去服务器上查询数据,也就是Pull;另一种是移动终端与服务器之间维护一个TCP长连接,当服务器有数据时,实时推送到移动终端,即Push。

推流端的设计是使用SurfaceView显示摄像头拍摄的画面,而声音则是直接调用手机自带的麦克风获取。使用SurfaceView显示拍摄的画面需要获得使用摄像头的权限以及初始化摄像头,同样声音获取也需先获取使用麦克风的权限。

获取到画面及声音后分别赋予到画面的缓冲数组videoDataQueue和声音的缓冲数组audioDataQueue,再调用while函数每隔一定的时间从画面和声音的缓冲数组获取数据发送至媒体服务器。

推流端的布局为任意布局,在其中除去SurfaceView外还设置了Button用于切换前后摄像头,只需在Button的响应事件中先判断当前的摄像头位置再对Camera进行更改,若更改为CAMERA_FACING_BACK是后置摄像头,CAMERA_FACING_FRONT为前置摄像头。

观众观看直播使用的拉流端是使用ijkplayer开发的,使用ijkplayer需先从官网下载源码再通过编码,若能够在xml中调用IjkVideoView控件,则说明成功调用ijkplayer[12]。

ijkplayer有许多调用函数,为了使用方便建议将需要使用的函数封装起来。封装好后在推流端的Activity类中直接调用封装中的play()函数,在参数为媒体服务器的地址便可以实现RTMP媒体流的播放。

5 实验与分析

文中搭建的在线直播教育平台是基于Android系统的,直播测试最基本的需求是两台手机。在开启媒体服务器后,先开启直播的推流端赋予推流端调用摄像头与麦克风的权限便可以将获取到的视频与声音发送至媒体服务器。推流端开始发送媒体流时便可以打开拉流端,拉流端从媒体服务器接收到数据后便会播放媒体流实现在线直播。测试结果如图5所示。

图5 手机端实验采集界面

6 结束语

文中搭建的在线直播平台,是针对在校大学生以及有空暇时间的社会人士开发的。在网络发达的现代社会,直播的应用不应该只限于娱乐休闲,而教育也不应局限于课堂教学[13]。基于RTMP协议开发的在线直播平台将直播应用于教育,大大节省了教育的成本,使得教育更加方便。在学生没有课的时候或者是社会人员闲暇的时候,便可以使用在线教育平台学习自己喜欢的内容,从而满足了大部分人群的需求。可以说直播是现代教育突破时间和空间限制的新方法,文中搭建的在线教育直播平台具有很好的使用价值。

猜你喜欢
视图列表摄像头
浙江首试公路非现场执法新型摄像头
摄像头连接器可提供360°视角图像
学习运用列表法
扩列吧
Y—20重型运输机多视图
SA2型76毫米车载高炮多视图
《投影与视图》单元测试题
Django 框架中通用类视图的用法
列表画树状图各有所长
2011年《小说月刊》转载列表