第1课 认识APP Inventor 教案

本教案仅供教师课前学习使用，具体上课环节以项目式教学为主，以项目为主线、学主教从，在老师的辅助下，引导或指导学生分析。

第1课 认识APP Inventor
一、学习目标
1.认识APP Inventor构成界面，及部分组件使用方法。
2.通过布局组件，根据需要添加删除组件，养成良好的编程习惯。
3.利用按钮组件和音频播放器组件，设计“你好小猫”项目，增强运用信息技术解决实际问题的能力。
4.通过与同伴分享心得方法和思路，提升对信息敏感度和价值的认知。
5.通过数字学习平台、资源，体验数字化学习的方式方法。
二、教学重、难点
教学重点：新建与导出项目以及对组件合理布局。
教学难点：逻辑编程的应用。
三、教具准备
Android平板或手机、USB数据线等
教学设计
环节名称 活动设计（任务、步骤、要求、成果） 目标 评价 反思
第一环节生活发现 生活情境师：同学们，首先咱们一起看一小段视频好吗？播放视频（川流的人群、不同地点的人群，手机无处不在） 视频看完了，你们发现了吗？这个视频想要突出的是什么？ 当今社会，手机已经成为人们必不可少的生活用品，手机的应用已经涉及到各个领域。下面咱们继续一起观看，大家看看，它们都是什么？图片一一展示老师提问，学生回答 这些图标是干什么的？你用过吗？ 智能手机的应用程序叫APP。 我们可以自己制作手机APP，下面咱们就一起来学习这方面的知识，你们准备好了吗？
问题提出我们的手机作用可真大啊，你都用过哪些APP？有没有自己做一个APP的冲动？给大家几分钟时间根据你用过的各种APP的经验和想法，小组汇总每个组的经验、想法和问题。1.学生讨论（1）用过哪些手机APP？（2）如果让你制作让手机发出小猫叫声的APP，你想怎样设计？（操作界面的风格、需要用到的组件、界面布局等）2.生成问题出示课件 可以从这些角度去讨论： 角度1：用什么编写APP 角度2：编写APP，需要有哪些过程和准备 角度3：想用编写APP的软件编写一个什么样的软件，并提出具体想法 角度4：一个简单的APP应该怎么写 角度5：你能想到的其他问题
我的设想（小组讨论____分钟）1.小组代表发言，汇报自己小组想出来的有价值的问题。 2.组间进行评价。
第二环节庖丁解牛 一、解决同学们刚才提出的问题 “公欲善其事，必先利其器，刚才同学们讨论的第一个问题很有意义，我们首先要确定用什么编程软件来编写一个APP” 老师开始介绍APP来历、特点、与SCRATCH的异同点等（解决学生提出的角度1和角度2的问题） 选择一款合适的软件来制作手机APP。（简单易操作的软件） （App是Application的简称，主要指安装在苹果、安卓以及Windows Phone等智能手机中的应用程序。App Inventor 原是Google实验室（Google Lab）的一个子计划，由一群Google工程师和勇于挑战的Google使用者共同参与设计开发，它是一款完全在线的Android编程工具软件。App Inventor于2012年1月1日移交给麻省理工学院 (?https:?/??/?baike.sogou.com?/?lemma?/?ShowInnerLink.htm?lemmaId=968154&ss_c=ssc.citiao.link" \t "https:?/??/?baike.sogou.com?/?_blank?)行动学习 (?https:?/??/?baike.sogou.com?/?lemma?/?ShowInnerLink.htm?lemmaId=7563094&ss_c=ssc.citiao.link" \t "https:?/??/?baike.sogou.com?/?_blank?)中心（MIT），并于2012年3月4日公布使用，目前软件的版本为2.0。它有可视化的界面设计功能。编程就像搭积木一样简单有趣，不需要编程基础、不需要编写代码，只需通过简单的拖曳组合，就可以开发App。）
启动与登陆APP Inventor 流程图设计： 步骤1：启动APP Inventor的后台服务双击桌面图标 ，或者单击“开始”—“所有程序”中的 ，启动后台服务程序。不要关闭这两个窗口，将它们最小化即可。 步骤2：在Google浏览器地址栏中输入：“localhost:8888”，敲回车键进入登录页面。点击“Log In”进入“项目管理”界面。 离线版的登录方式有三种： localhost:8888 127.0.0.1:8888 本机IP:8888
三、认识项目界面和设计界面和逻辑编程界面App Inventor有三个界面：项目界面、设计界面和逻辑编程界面。制作App之前首先要新建项目，然后在设计界面中添加组件（如按钮、标签等）。 项目界面 设计界面 逻辑编程界面步骤1：新建项目（首次运行App Inventor时，会出现提示）单击“新建项目”按钮，弹出“新建项目”对话框。输入项目名称，例如：“你好”，单击“确定”，就会出现设计界面。 步骤2：认识设计界面App Inventor的设计界面主要包括以下六部分：菜单区组件面板屏幕区组件列表素材区属性面板 步骤3：认识组件App Inventor的组件分为两类，一类是可视组件，添加后它们会显示在屏幕上，例如“按钮”、“标签”等；一类是非可视组件（也称API：Application Programming Interface——应用程序编程接口），添加后它们会显示在屏幕下方，例如“语音识别器”、“音效播放器”等。 拖动组件面板中的组件到屏幕中，看看有什么变化？ 将组件从组件面板中拖到屏幕上，你会发现组件会显示在屏幕上或者出现在屏幕区下方，同时，组件列表中也会出现所有添加完成的组件。你能区分可视组件与非可视组件了吗？App Inventor设计界面完成后，在逻辑编程界面中对添加的组件进行合理的逻辑组合来实现App的功能。步骤4：认识逻辑编程界面App Inventor的逻辑编程界面主要由五部分组成：菜单区代码块（积木）素材区积木抽屉工作区 步骤5：尝试逻辑编程在设计界面中添加“按钮1”和“音效播放器1”，在逻辑编程界面尝试组合两个积木。 A.尝试对“按钮1”积木与“音效播放器1”积木进行逻辑组合。B.上传音效素材到素材区，给“按钮1”点击事件添加音效效果。C.在素材区点击“上传文件”按钮，上传“meow.mp3”，然后在属性面板中选择音频文件“meow.mp3”。
四、项目保存、APP编译和测试的步骤界面设计和逻辑编程完成后，需要对项目进行保存。然后根据实际情况对程序进行编译操作，可以使用“下载到本地”的方式，对程序进行安装调试。 步骤1：保存项目。单击“项目”菜单，在弹出的菜单中选择“保存项目”，完成项目的保存； 步骤2：对项目进行编译和调试操作。单击“编译”菜单，在弹出的选项中选择适合自己的方式进行编译操作。可以通过不同方法把程序安装到安卓智能手机上进行调试。 步骤3：观察对比编译方式中“显示二维码”与“下载到本地”有何不同。 “显示二维码”通常用于“AI伴侣”扫码安装；而“下载到本地”则是将程序打包成APK文件，通过手机助手或者USB数据线，把程序安装到安卓智能手机上。
五、其他问题的回答，比如学生想做非常复杂的应用，可以引导学生好好学习，后期再做。
第三环节学以致用 创意研究刚才我们认识了APP Inventor，也写了一个简单的APP，在这个简单的APP里我们用到了哪些程序积木呢？每个小组讨论**分钟，设计一个用这些程序积木完成的程序项目。要讨论出以下几个问题：问题一：要做的程序项目名称叫什么，有什么作用 问题二：为什么要做这个程序项目 问题三：打算怎样去实现这个程序项目（本节课即简单的写步骤，后面哪节课变成流程图后就得写流程图） 问题四：这个程序项目有什么后续升级的需求吗？ 以上几个问题讨论完成后，形成文字方案记录下来。老师对每个小组的方案进行点评。 如果有的小组没有讨论出方案，则老师给出音乐播放器程序的方案，由学生照着方案完成。 学生根据方案制作相应的APP，并在制作过程中完善方案、步骤/流程图。1.根据所学知识，新建项目“你好小猫”。 2.实现效果为：点击按钮，让APP震动并发出“喵”的叫声。小组讨论，并制定方案。
合作交流流程图设计： 步骤1：首先在设计界面中添加按钮和音效播放器组件。步骤2：上传素材“cat.png”和“meow.mp3”。 添加组件 上传文件:步骤3：修改属性音效播放器的属性：源文件选择“meow.mp3” 按钮的属性：图片属性改为“cat.png”；显示文本处清空。步骤4：对按钮点击事件、音乐播放器积木进行编程。 步骤5：保存与调试。1. 保存：项目→保存项目 保存完成后会出现“保存成功，保存时间：**年*月*日 上午/下午 时：分：秒”的提示。 调试可以通过不同方法把程序安装到安卓智能手机上进行调试。
快乐分享根据制定方案完成后进行展示评价。展示流程图，各种情况都列出来 每个小组向全班汇报方案完成情况，同时把完善后的步骤/流程图出示给大家。
第四环节收获展望 我的收获通过本节课的学习，你有哪些收获？和大家一起分享一下吧！（会启动APP Inventor并新建项目；掌握程序的三个界面：项目界面、设计界面和编程界面；能对常用的组件如按钮等进行添加和编程；能保存项目、编译和调试程序。）评价项目同伴评价我的收获 会启动、登录App Inventor，掌握程序的三个界面。 能在逻辑编程界面中拖动积木到工作区并组合，体验积木组合的意义。 通过小组合作，能对项目进行保存；对程序进行编译、安装和调试。
拓展延伸App Inventor常用组件及作用按钮：用户通过点击等动作来完成程序中的某些操作。标签：能显示特定的文本区域。画布：一个长方形画板或容器。精灵：用程序定义它的行为，可以实现在画布中移动和绘画等动作。水平布局：可以实现内部组件自左向右的水平排列。表格布局：可以实现内部组件在单元格中有序排列。音效播放器：属于非可视组件，调用系统中的播放器，播放短小的声音文件。音频播放器：属于非可视组件，调用系统中的播放器，用于播放较长的音频文件。文本输入框：用于输入特定的文本，等待提交。对话框：用来提示重要信息的组件，和Windows的对话框功能相似。Web浏览框：一种类似Web浏览器的组件，可以显示网页内容。语音识别器：属于非可视组件，可以调用系统中的语音识别引擎来工作。语音合成器：属于非可视组件，可以调用系统中的语音合成引擎来工作。本地数据库：属于非可视组件，用来保存和读取信息和数据的组件。尝试在App Inventor2.0中找到这些常用的组件。 通过对APP制作流程的学习了解，你还认识了哪些APP Inventor常用组件和它们的作用？你还有哪些新奇的想法想要实现？

视频设计：
启动与登陆APP Inventor
认识项目界面和设计界面和逻辑编程界面，并在几个界面之间相互切换。
添加按钮、音频播放器到屏幕区的方法；尝试逻辑编程。
项目保存、APP编译和测试的步骤
制作音乐播放器操作过程

设计界面

新建项目

组件列表

屏幕 区

属性面板

素材区

菜单区

组件面板

菜单区

积
木
抽
屉

编程界面

素材区

工作区

代码块