APP下载

基于App Inventor的随机点名App的设计与实现

2021-11-13周开梅

云南教育·中学教师 2021年10期
关键词:管理器列表按钮

周开梅

随着信息技术的高速发展,多媒体技术成了教育教学的得力助手,并呈现出多样化、智能化的发展趋势。运用多媒体技术后,教学内容变得生动、形象,课堂的直观性和趣味性都得到了增强,并极大地激发了学生的学习兴趣,营造出了良好的学习氛围。使用频率最高的多媒体技术要数演示文稿PowerPoint,除此之外还有实物展台、翻页笔、触控屏、平板、电子白板、投屏器等。作为一名信息技术教师,多年来我一直在尝试运用自己的专业知识设计一些辅助教学的程序。其中,我用App Inventor制成的随机点名App,既能减轻教师记名字的负担,增加课堂乐趣,又能督促学生学习,让他们上课更专心,从而提高课堂教学效率。下面我们就一起来看看这款随机点名App是如何设计与实现的:

一、关于App Inventor

STEAM教育越来越受到我国教育界关注,STEAM综合了科学(Science)、技术(Technology)、工程(Engineering)、数学(Mathematics)和艺术(Arts)这五个学科知识,更提倡一种新的教学理念:让孩子们自己动手完成他们感兴趣的,并且和他们生活相关的项目,从过程中学习各种学科及跨学科知识。App Inventor手机编程正是这一教育的具体体现。

近年,手机App应用得到了飞速发展,各种功能的手机App正日益影响和改变着我们的生活。同时,手机App开发课程也开始慢慢步入中学课堂,虽然目前还没有在全国初高中的信息技术课中全面普及,但在很多一线城市中,“App Inventor程序设计”教学已风生水起。2014~2018年,全国已举办了五届中学生App Inventor应用开发挑战赛,欲通过此赛事,全面调动中学生的程序思维与创新能力。由于“App Inventor程序设计”目前尚不属于学考内容,也没被纳入初高中信息技术教材,加之各校初高中信息技术课课时有限,不参与学考的内容要想在有限的课时条件下挤入正课显然还不具备条件。目前,学校要想开设此课程只有依靠选修课。课程开设期间,学生需要应用自带的配有安卓操作系统的手机编写及测试App程序,教学需要在Wifi环境下完成。这对学生和学校环境都提出了不同于常规信息技术教学的更高要求。开设“App Inventor程序设计”课程,也对教师的专业知识提出了更高的要求。由于这个内容是新技术、新知识,教师在授课前必须有较强的自学能力与实践能力才能轻松驾驭。

学生无须任何编程基础,在可视化编程界面下,通过模块拼接的方式,类似搭积木的形式,制作Android手机程序,并可以在手机上运行。App Inventor之父Harold Abelson(MIT教授)曾经说过:“App Inventor编写的应用程序或许不是很完美,但它们却是普通人都能做到的,而且通常是在几分钟之内即可完成。”

http://app.gzjkw.net/login/是目前国内唯一的App Inventor官方服务器(如图1),我们通过浏览器访问,就能进行安卓系统下的App开发,无须安装。登录网站以后,用户只需注册一个账号,就能使用,非常方便。图2是App Inventor的设计界面,中间区域类似手机屏幕,App的外观设计就在这里进行,在进行App外观设计的时候,需要用到设计界面左边的组件,我们可以把它们想象成一件件工具,设计界面最右边是属性面板。

二、文字版点名App

在手机中启动做好后的“文字版点名App”,最终效果如图3。当我们点击“开始”按钮后,名字开始在屏幕中滚动播放,点击“停止”按钮时,名字停止滚动,同时手机念出屏幕中的名字,达到随机点名的功能。那么这样一种呈现效果是如何达到的呢?首先,我们需要把学生的名单保存在“mingdan.txt”记事本文件中,保存要求如图4所示,一行一个名字;然后,再进行如下操作一步步实现。

1. 文字版点名App的界面设计

我们首先在App Inventor中进行文字版点名App的界面设计,也就是点名App的外观设计,最终设计效果如图5。在这个App中,我们用到了如下组件:4个按钮,1个计时器,1个文件管理器,1个文本语音转换器,1个垂直布局,1个水平布局。它们的功能如下表所示。

2. 逻辑设计(后台指令代码)

界面设计好了,下面我们通过逻辑设计编写指令代码,来实現随机点名的功能。在App Inventor软件的右上角,有两个按钮:“组件设计”和“逻辑设计”,通过单击“逻辑设计”按钮,我们可以进入编程的界面。App Inventor是一款图形化编程工具,它的指令代码是一个个封装好的彩色积木块,编程的过程就是拼接搭建这些积木块的过程。这些积木块是按类别存放的,如图6所示,数学类的都在数学模块里,文本类的在文本模块里。内置块中的模块属于一些基础模块,在编程过程中经常要用到。

(1)准备工作

我们先读取mingdan.txt记事本中的名字到程序的“文件管理器1”中。由于文件管理器只是一个从记事本到App Inventor软件的中介,在App Inventor中不能直接处理文件管理器中的文件,故需要创建一个空的列表,用于把文件管理器中的名字取出来存到列表中,方便后期处理。具体的指令代码如图7。在编写指令代码时,一定要注意mingdan.txt的存放路径。

(2)把“文件管理器1”中的文本通过回车符分离到列表中

将“文件管理器1”中的文本通过回车符分离到列表中,即把一个一个名字单独提取出来存入列表中。在记事本中,每个名字是按一行进行存放的,名字和名字之间存在一个回车符“\n”。我们可以利用“文件分隔符”指令块进行名字的分离。

什么时候进行名字的分离呢?当文件管理器1获得文本后,我们就可以进行名字的分离。如图8所示,当文件管理器1获得文本时,就会触发该事件。

(3)让名字每隔一定时间在屏幕上滚动播放

要让名字每隔一定时间在屏幕上滚动播放,我们需要用到计时器,并把计时器的“计时间隔”属性设置为500毫秒。名字显示在按钮2上,随机产生需要用列表中的“随机选取列表项 列表”指令块,即我们需要随机选取列表中的名字,每隔500毫秒后将其显示在按钮2上。每隔500毫秒,时间一到,就会触发计时器计时执行事件,如图9。

(4)点击“开始”按钮时,开始随机显示不同的名字

要让名字滚动播放,只需启动计时器1,“停止”按钮可用,同时“开始”按钮不可用,如图10。

(5)点击“停止”按钮时,姓名在屏幕上停止滚动,手机念出当前屏幕上的名字

点击“停止”按钮后,计时器1停止工作,“停止”按钮不可用,“开始”按钮可用,同时利用文本语音转换器1念出当前按钮2上的名字,如图11。

用手机念出按钮上的名字,这里用到了App Inventor中的“文本语音转化器”。同时,手机中要有语音引擎,常见的语音引擎有谷歌、百度、讯飞等。文本语音转换器组件默认调用的是安卓的Pico TTS引擎,如图12,但是该引擎不支持中文,因此我们需要下载中文语音引擎。目前,常用的中文引擎是讯飞引擎,手机中需下载讯飞TTS语音引擎和讯飞语音包。如果安装了讯飞语音引擎,还需要在“手机设置”中进行引擎的设置:设置语言和输入法文字转语音输出,启用“迅飞语记”。

以上准备好后,就可以拿出你的手机下载点名App进行测试了。

三、照片版点名App

在文字版点名App的基础上,我们让手机屏幕中滚动播放的不仅是学生的名字,还显示对应学生的照片,学生的名字出现在照片的下方,点击停止按钮时,照片和名字也都停止滚动,手机念出被选中的名字。可是,由于App Inventor要求上传的图片文件名必须是英文,所以目前能显示的名字是由字母构成的。

1. 照片版点名App的最终效果和界面设计

区别于文字版点名App,照片版点名App的界面还需要图像组件来显示学生的照片。

2. 学生照片的处理

学生的名字是存储在记事本mingdan.txt里的,学生照片对应一张张图片,需要上传到当前项目中,注意图片的文件名和学生名字一一对应,都是由字母构成的。通过文件管理器读取学生姓名,并一个个分离到列表中,如图14。

3. 名字的处理

同样,我们仍然需要把“文件管理器”中的文本通过回车符“\n”分离到列表中,把一个一个名字单独存起来,一行就是一个名字,即一个名字对应一个列表项,如图15。

4. 手机屏幕中滚动显示学生的照片和姓名

利用计时器每500毫秒显示一张照片和对应名字。名字已经放到了列表里,利用列表的“随机选取”功能,每次选出来的名字都不一样。由于图片的文件名和学生名字一一对应,这样就能很快地找到学生的照片名,再将其显示出来。

这里照片对应的图片名字,由两部分构成:学生名字,还有图片的扩展名jpg。为了能正常显示出对应的照片,需要用到“合并字符串”指令块将其合并,如图16。

5. 点击“开始”按钮后,名字和照片开始滚动播放,点击“停止”按钮,停止滚动

这时手机念出当前的姓名,如图17。

这样,照片版的点名App就做好了,下载该照片版点名App试试吧。试了以后,有没有发现一个问题:显示的名字只能是字母构成的。那能不能让显示的名字呈现中文呢?

四、中文名字的照片版点名App

这里我们用Excel文件存储名字,来实现照片版的点名App。如果用Excel文件存储名字,具体学生名字存储方式如图18。

App Inventor要求上傳的文件名必须是英文的,所以学生的照片名必须全部是英文字母构成的。为了能显示中文的学生姓名,要借用2个Excel文件,一个stname.csv,用于存放学生的中文名字,另一个photo.csv用于把中文名字和照片相对应,即一个学生有2个信息:姓名和照片,姓名存储在stname.csv文件中,对应照片名存储在photo.csv文件中。这里我们还需要注意,需用记事本打开CSV文件,选择文件菜单中的“另存为”,将文件编码设置为UTF-8,再点击保存按钮,否则应用中会看到无法识别的字符乱码。在程序中,我们用“Name文件管理器1”来管理姓名,“Photo文件管理器1”来管理照片名,如图19。

用“CAV表转换为列表 文本”指令块可以直接把CSV文件转换为列表,注意转换后是一个二维列表,列表中含列表,每一行也是列表。

完整的程序代码如图20。

这样中文名字的照片版点名App就做好了。

近年来,随着互联网技术的发展,多媒体教学在教育行业中的作用逐渐凸显,这标志着我国教育行业发展到一个新的阶段。作为教师,我们更应该努力学习新技术,利用新技术来辅助教学,让信息技术手段成为我们教学的得力助手,提高教学效率。

责任编辑 邱 艳

猜你喜欢

管理器列表按钮
启动Windows11任务管理器的几种方法
应急状态启动磁盘管理器
扩列吧
死循环
列表法解分式方程问题探索
用好Windows 10任务管理器
列表画树状图各有所长
内心不能碰的按钮
2011年《小说月刊》转载列表
在Win 7下利用凭据管理器提高访问速度等