App Inventor移动应用开发标准教程3_App Inventor编程基础
变量
变量名称必须以英文字母、下划线或中文开头，可 包括英文字母、下划线、数字和中文，如Sum，S1 ，求和，_a2都为合法的变量名。 AI中变量可以接受任何类型的值 任何时候都可以对变量的名称进行重命名，所有引 用过该变量原有名称的块将自动更新。 AI中的变量类型有数字、文本、逻辑、列表、颜色 。
成绩等级判定
下面首先分析该项目的输入、处理和输出。 输入：成绩。 处理：按照给定的判定规则判断成绩的等级。 输出：输出成绩的等级。 对应到App Inventor：输入（文本输入框组件）、 成绩等级（按钮，逻辑设计）、输出（文本输入框 组件或标签）。
成绩等级判定
组件说明
组件 所属组件组 命名 用途 供用户输入 分数 成绩等级判 定 属性
阶乘计算器1
组件 所属组件组 命名 用途 属性
文本输入框
用户界面
文本输入框_n
输入正整数n
默认
按钮
用户界面
按钮_计算
计算1+2+…n
文本：计算1到n的和
标签 标签
用户界面 用户界面
标签1 标签_结果
提示 显示结果
文本：结果为： 文本：空
注：组件和变量的名称一般按照其含义命名，做到见名知义。
阶乘计算器1
F 条件1
T
条件2 T
语句பைடு நூலகம்块1
语句模块2
选择
例2：成绩等级判定，开发一个App，输入一个成 绩，单击判定按钮输出其等级。判定规则如下：如 果成绩大于等于90分，等级判定为优秀；如果成绩 大于等于80分并且小于90分，等级判定为良好； 如果成绩大于等于70分并且小于80分，等级判定 为中等；如果成绩大于等于60分并且小于70分， 等级判定为及格；如果成绩小于60分，等级判定为 不及格。
阶乘计算器1
问题1：用户输入1个n，怎样计算n的阶乘？
◦ 0！=1 ◦ 5! = 1×2×3×4×5 ◦ n! = 1 ×2×3×……×n
问题2：用户界面的设计？
◦ 用户输入n，计算阶乘，显示结果
阶乘计算器1
对应到App Inventor：输入（文本输入框组件）、计算阶乘 （按钮，逻辑设计）、输出（标签）
在程序设计中，大部分程序都可以看成是由输入、 处理、输出三部分组成。对应到要实现的计算器。 输入：两个数。 处理：计算两个数的和。 输出：把计算出来的和展示给用户。 对应到App Inventor：输入（文本输入框组件）、 计算（求和）（按钮，逻辑设计）、输出（文本输 入框组件或标签）。
计算器
组件 文本输入框 文本输入框 文本输入框 按钮 标签 标签 所属组件组 用户界面 用户界面 用户界面 用户界面 用户界面 用户界面 命名 TextBox1 TextBox2 TextBox3 Button1 Label1 Label2 用途 输入第一个加数 输入第二个加数 显示和 成绩等级判定 显示加号 显示等号 属性 默认 默认 默认 文本：计算 文本：+ 文本：=
成绩等级判定
(2)如果满足分数大于等于80分，并且小于90分， 则等级为“良好”。这里用到的逻辑运算符“并且 ”
选择
下面改写成嵌套结构
循环
在AI中存在计数循环(for)、逐项循环(for……in list) 和条件循环(while)三种循环结构。
循环
（a）计数循环从循环计数变量的起始值(如1)开始 执行循环体内语句块，执行完成后，循环计数变量 增加循环间隔指定的增量（如1），然后重复执行 上面的操作，值到终止值(如5)。 例3：阶乘计算器1
网址
服务器网址
◦ / ◦
资源
◦ /
变量块
变量是在内存中占据一定的存储单元,其值
可以改变的量。在AI中，变量必须先进行 声明，然后才可以使用。AI的变量块里面 有五种类型的块
文本输入框
用户界面
文本输入框1
默认
按钮
用户界面
按钮1
文本：成绩等级
标签
用户界面
标签1
显示等级
文本：空（删除掉原有文 本不输入任何东西）
成绩等级判定
代码块
成绩等级判定
关于代码几点说明： （1）用于条件判断的“大于等于”、“小于”等 关系运算符如图所示进行添加。关系运算符可以通 过单击“=”号，在弹出的下拉列表框中进行选择 改变。
变量
在AI中，变量包括全局变量和局部变量二种 全局变量可以用在应用的所有过程及事件处理函数 中，是一个独立的块。在应用的运行过程中，可以 在应用的任何部分对全局变量的值引用和修改。
全局变量
定义
使用
全局变量
修改变量的值
计算器
例1、定义一个简单的计算器，计算两个数字的和
计算器
带返回值的局部变量块的使用
控制块
顺序结构、选择结构和循环结构是程序设计的三种 基本结构，已经证明：任何可解问题的解决过程都 是由这三种结构通过有限次组合而成的。 控制块是AI编程的基本结构，主要包括流程控制块 ：选择和循环，屏幕控制相关操作等。
选择
选择
三种基本结构
选择
（a）“如果...则...”进行条件测试：如果测试结 果为真(T)，则按顺序执行“则”右边的块；否则(F)跳 过这些块。
F
条件
T 语句模块
选择
（b）“如果...则...否则...”进行条件测试：如果 测试结果为真，则按顺序执行“则”右边的块；否则 ，按顺序执行“否则”右边的块。
F 条件 T 语句模块1 语句模块2
选择
（c）“如果...则...否则，如果...则...”进行条件测 试：如果测试结果为真，则按顺序执行第一个“则” 右边的块；否则做下一步的条件测试“否则如果”， 如果测试结果为真，则按顺序执行第二个“则”右边 的块，否则按顺序执行最后一个“否则”右边的块。
代码块
局部变量
局部变量块是一个可扩展块，用于在过程或事件处 理函数中，创建一个或多个只在局部有效的变量， 因此每当过程或事件处理函数开始运行时，这些变 量都被赋予同样的初始值。它的有效作用范围仅限 于块内。
局部变量
定义局部变量
局部变量
初始化局部变量
局部变量
使用局部变量
局部变量
将例1的计算器修改成局部变量来实现
App Inventor智能手机编程与开发 教案 项目二 AI编程基础
课程名称
AppInventor移动应用快捷开发
课程内容
AI编程基础
学时
2
上课地点
网络配置室
任课教师信息
教学设计作者信息
一、教学对象分析
教学对象主要是中职计算机动漫设计专业的一年级的学生。
二、教学内容分析
学生在前面的项目中，已经学习了AppInventor的基本知识，也对AppInventor有了进一步的了解，为使学生对编程有一个整体的认识，本次课学习A1编程基础。通过实际操作来学习和熟悉相关内容。
参与评价，总结自己所学的知识
通过评价总结，巩固所学习的知识
作业提交(2min)
应用程序提交
打包应用程序提交
接收作业
分析学生的应用程序，及时提
出反馈意见
教学评价
通过学生在完成的作品，对学生个体的学习情况分析；以判断学习目标的达成度；根据学习情况，进一步修改教学设计，进一步完善教学，提高教学效果。
教学特色与
一、教学对象分析
教学对象主要是中职计算机动漫设计专业的一年级的学生。
二、教学内容分析
学生在前面的项目中，已经学习了APPInVentOr的基本知识，也清楚了如何去调试应用程序，用具体的应用事例来学习程序的基本控件，通过“动物之声”应用程序来学习按钮、表格布局、音频播放器等控件。
三、教学目标
1会导入图片
七、教学媒体
计算机、电子教室系统、多媒体投影仪、教学课件、AppInventor程序开发平台、无线网络。
八、教学过程(这是教学设计的主体部分。分几个环节具体说明教师指导活动、学生学习活动及师生交互活动。一般应采用文字叙述加点评的格式。)
教学环节
(时间分配)
教学内容
第3讲 - 安安猜价格
• App Inventor将各种常用的功能，封装为多个控件，供用 户调用
– 这些控件类型可以看做是类 – 具体的某个控件就是对象
面向对象程序设计思想 • 事件
– 指在某个时刻发生的某种特定事情 事件类型 例子 当用户点击了 button1，做… 用户触发事件 提供访问设备的内建功能 系统初始化事件 当App启动，做… 当过了500毫秒，做… 时间事件 动画事件 外部事件 当两个对象碰撞时，做… 当收到一条短信时，做…
谷歌精品课程
App Inventor 零基础Android移动应用开发 安安猜价格
浙江大学城市学院 吴明晖 教授 mhwu@
本章目标
• • • • 定义全局变量 如何产生随机数 学习“如果…则…”条件判断模块 控制屏幕的布局
谷歌精品课程
谷歌精品课程
App Inventor 零基础Android移动应用开发
讲解
按钮的背景颜色
TextColor
Visible Width
按钮中文字的颜色
按钮是否可见 按钮的宽度
Height
按钮的高度
设置加速度传感器组件属性
加速度传感器（AccelerometerSensor）组件是加速度传感 器，从三维响应晃动和测试加速度。加速度的单位为m/s2
可以用于检测手机晃动等事件
作业和思考题
• 动手实践“安安诞生”App的开发和调试运行过程
• 给“安安诞生”换一个图标 • 思考一下，能给“安安诞生”加一些新的功能么？
• 自学Media组的Player控件，尝试开始创建一个新的App， 可以用来播放一首长时间的mp3音乐
28
– 模拟器
– WIFI连接
– USB连接 由于这里用到了加速度传感器，所以在模拟器中运行时 某些功能不能使用。
Appinventor
Appinventor安装1. 单机版特点：使用注意事项1. 首次使用，请将war\WEB-INF\下的 appengine-generated.test 目录重命名为appengine-generated，默认管理员用户test，密码test账号；2. 32位编译出错，请添加系统变量：“_JAVA_OPTIONS” 值为“-Xms512m -Xmx512m ”。
解决方法：使用方法：1. 启动设计服务器：运行：rundev.batchrome浏览器打开http://127.0.0.1:8888 即可使用，默认管理员账号：test 密码：test。
停止设计服务器：Stopdev.bat。
2. 启动编译服务器：运行：runbud.bat (若命令行中文乱码，修改命令窗口的属性–字体为字体"LucidaConsole"或"新宋体"；)3. 启动桌面版AI伴侣：3.1 运行：AI伴侣.bat3.2 Rendezvous Server已经设置为127.0.0.1:8888及默认勾选使用旧版方式连接。
调试方法要能扫码下载,或者,使用手机上的AI伴侣,要让AI2离线服务器工作在自己的IP地址上.1. Rundev.bat要修改:start “DevAppServer” /min chcp 65001 &&java -cp“%APPE_HOME%\lib\appengine-tools-api.jar”com.google.appengine.tools.KickStartcom.google.appengine.tools.development.DevAppServerMain %* --port=8888 --disable_update_check --address=127.0.0.1 war要将127.0.0.1修改为自己电脑网卡的IP地址.2. 修改 war\WEB-INF\appengine-web.xml中<property name="use.rendezvousserver" value=""/>为<property name="use.rendezvousserver" value="自己电脑IP:8888"/>；3. 修改桌面版AI伴侣、手机AI伴侣的Rendezvous Server为自己电脑IP:8888，并勾选UseLegacy Connection。
App Inventor移动应用开发标准教程1_App Inventor初步
使用第二种和第三种连接方式，首先需要安装 JAVA和配置环境变量。
App Inventor开发环境配置
安装Java运行环境
下载Java Development Kit (JDK)。
安装Java运行环境
安装Java运行环境
简单设置，我的电脑->属性->高级->环境变量>系统变量 在Path后加入(JDK的bin路径)： C:\Program Files\Java\jdk1.7.0_03\bin
使用安卓设备和无线网络进行开发
问题排除
如果你的App没有出现在案作安卓设备上，最可能 原因如下： 安卓设备上配套安装的App Inventor Companion App已经过期，请从AI2网站下载最新的 Companion App。 安卓设备没有连接到无线网络，确认在安卓设备上 AICompanion App屏幕下方显示了IP地址。 安卓设备和计算机没有连接到同一无线网络。 你的学校或组织可能不允许无线网络连接协议。
Harold (Hal) Abelson教授
IEEE理事、ACM理事 MIT MacVicar教师理事之一 1995 IEEE Taylor L. Booth 奖 2012 ACM SIGCSE奖 1980 Logo编程语言 1982 《Turtle Geometry》 •几何学教学和学习方法的革命性改变 1984《计算机程序的结构与解释》（SICP） •计算机程序设计经典书籍 •在全世界范围计算机教育界形成了极为重要的影响 自由软件运动的发起人和倡导者。 •自由软件基金会（Free Software Foundation）董事 •Creative Commons的发起和领导者
APP-Inventor实例及讲解
第1章Hello Purr本章将开启你的创建应用之旅。
这里介绍了App Inventor的关键要素——组件设计器及块编辑器，并手把手地引导读者创建第一个应用：HelloPurr。
在完成本章的学习之后，就可以开始创建自己的应用了。
每当搭建了新的开发环境，通常运行的第一个程序就是显示“Hello World”，来证明系统已经就绪。
这个传统可以追溯到20世纪70年代，从Brian Kernighan 在贝尔实验室使用C语言开始（Brian现在是谷歌App Inventor团队的访问学者！）。
使用App Inventor，即便是创建最简单的应用，也可以实现声音的播放以及对屏幕触摸的响应，而不只是显示文字。
想想都令人感到兴奋，那么，让我们马上开始吧。
第一个应用是“HelloPurr”（如图1-1），当你触摸这只猫时，它会发出“喵呜”声；当你摇晃它时，则将发出嘟嘟的震颤。
图1-1 HelloPurr应用学习要点本章用到了以下组件和概念：∙选择组件来创建应用：决定了应用的外观；∙为组件设定行为：做什么以及何时做；∙使用组件设计器选择组件，在Android设备上，有些组件可以显示，有些则不可见；∙从本地计算机加载媒体文件（声音或图像），并添加到应用中；∙用块编辑器来组装程序块，以此来设定组件行为；∙用App Inventor的实时测试功能对应用进行测试。
你可以一边创建应用，一边在手机上看到它们外观以及运行情况；∙将应用打包并下载到Android设备上。
App Inventor的开发环境App Inventor的编程环境包括以下三个重要组成部分，如图1-2所示：∙如图1-2A所示，组件设计器运行在浏览器中，创建应用过程中，用它来进行组件的选择，并进行属性设置；∙如图1-2B所示，像组件设计器一样，块编辑器也在浏览器中运行，用于创建组件的行为；∙测试设备：在开发应用过程中，可以用Android设备对应用进行同步的运行与测试；如果你手边没有Android设备，你可以使用系统中集成的Android模拟器来测试应用。
信息技术《初识App Inventor》教案.pptx
*MM4βM
5.⅜⅝,⅜则.拒.柳E,“ 保存项目： 在APPlnVentor中编辑完成时,单击''项目"，在弹出的菜单中选择“保存项目”.完成保存。
信息技术《初识App Inventor》教案
第11课初识APPInventor 一、厚积11发 (引导策略；如何启动APPInventor?). 1.启动APPInventor. 双击软件图标，启动APPInventor的后台服务程序，启动浏览器，建议使用谷歌浏览器，在浏览器地址栏中输入 扇动涔提示的网出，回车键进入登录界面，郎击"1.ogin”进入主程序界面二、SMMfi 认识AppInventor的工作界面 初次运行RPPInVCnIor时，界面会弹出“新建项目”提示,单击“新建项目”按钮. 可视组件与不可视组件:拖动组件到工作区域时，可视组 件可在手机模拟屏幕上显示，同时也会出现在组件列表中：非可视组件则只在手机模拟屏幕卜方提示，并出现 在组件列表中 编程界面可划分为8个部分：
App Inventor 安卓手机应用开发简易入门 第二章第1节
第二章One and One——组件入门本章概要本章将通过引导创建OneAndOne、HappyBox、HappyDay的课程实例，熟悉组件的基本应用，了解Block编程的风格，学会测试和调试自己的App。
在界面设计和可视化块编程有一个应用的实践，达到入门级的熟悉状态，可以真正步入自己创建应用的起点。
第1节个人专属App就这么简单本节概要：学会启动App Inventor 的工作界面，熟悉各个界面布局，和各个工具栏相应位置和相应方式，通过OneAndOne的课程例子引导，开始学生对App Inventor 的启程之旅。
学习要点●启动离线App Inventor、熟悉相应流程●用户组件Label和Button的使用●如何利用简单级组件创设有趣的应用实例探究：OneAndOneOneAndOne 的定义:一个组件加一个组件，这样的前提下可以做出什么样的应用？我们可以通过这个课程实例的应用，来实践验证一下：点击应用中的按钮之后Label标签跳出设置好的名字。
图2-1-1：程序界面图2-1-2：运行结果离线环境的启动离线环境的启动，打开前文所提资源列表中离线服务器包，启动的AIServer 和Bulidserver 两个，如果App Inventor 客户端没有打开的话也一并打开，机房里我把这三个快捷方式放在一起，合并成启动三项。
图组2-1-3启动各项服务命令并提示成功启动Tip ：离线版本有可能会出现无法正常使用的时候，在都启动的时候无法正常进入。
一般只需右键Google 浏览器重新加载即可。
如果不行，也只需关闭再打开，基本都能解决问题。
界面设计与组件构成：组件的拖放和设置图2-1-5 Label 标签和Button 按钮的设置组件重命名在用户组件区（C 区）选择组件，点击rename （重命名）(图2-1-6)图表2-1-7：提问思考：组件为什么需要重命名？从用户组件区拖曳组件到视图设计，并修改相应属性，课例所用组件属性修改如下（表2-1-8）：例子——文本框label 截图如下：图2-1-9：组件对应属性栏Block 块编程拼接搭建切换到blocks 界面，观察发现组件设计界面与左侧blocks 下组件相互对应图组2-1-10可以发现design界面和block界面关于 screen1下的组件是一一对应的具体操作如下图所示○1点击BtnGetName按钮拖曳一个click事件框图2-1-11○2点击labName的设置text属性框与click框相接（接口正匹配）图2-1-12Tip：在下图2-1-13操作中，从Built-in处选择text 拖入一个空白文本模块拼接后键入字符，也可以先键入字符再拼接，此处无影响，即模块以最后形状为准，中途没有先后操作关系。
初步认识App+Inventor+教学设计
初步认识App Inventor 教学设计教学内容分析：本节课是AppInventor的第一课，主要让学生了解手机编程的基础知识，以及AppInventor 的一些基础操作，一些常用的控件的使用和常用功能的编程过程。
教学对象分析：八年级学生已经学习过了python编程，之前使用的海龟编辑器也有积木模式，所以对积木式编程有初步的了解，所以有一定的编程思维和编程基础，但是学习python的时候，没有深入涉及到界面设计的学习，所以这是全新的领域，需要建立学生对程序前端和后端的理解。
教学目标：1、知识与技能：(1)了解AppInventor程序设计环境。
(2)体验手机应用程序的设计过程，认识项目，设计和逻辑编程界面。
(3)掌推新建项目，ai伴侣调试，添加和删除组件，进行基础编程。
2、过程与方法：学生通过在AppInventor桌面版环境下进行手机应用程序的设计，初步掌握AppInventor 的各种开发操作。
3、情感态度与价值观：培养学生的编程思维，体验程序解决实际问题的思想方法，激发学生学习手机应用程序、设计程序的求知欲，形成积极主动地学习和使用信息技术的态度。
教学重难点：1、教学重点：对程序前端和后端的理解，ai伴侣的连接使用，控件的设计和编程。
2、教学难点：按钮、图片组件的编程，图片控件的隐藏和显示。
教学过程：教学环节教学活动设计设计意图教师活动学生活动导入介绍AppInventor与python的区别，引导以春游为契机，创作一款介绍长隆欢乐世界的app，老师先展示app的最终效果让学生了解python编程和AppInventor的共同点和不同点AppInventor 环境的认识教师演示打开编程环境，初步介绍编程环境的界面学生打开编程环境，初步认识界面了解编程的环境手机模拟器、AI伴侣的使用演示连接AI伴侣自行连接AI伴侣了解程序编译测试的方法图片控件的使用演示把APP的首页设置成长隆的欢迎界面导入素材，设置首页的图片了解图片控件，掌握上传素材的方法按钮控件的使用演示添加按钮控件，修改按钮文本，提出如何把三个按钮横向摆放添加按钮，尝试自主掌握水平布局了解按钮控件和水平布局按钮控件的编程演示第一个按钮的编程，按下按钮打开图片1.jpg学生自己尝试给三个按钮进行编程了解按钮控件和图片控件的编程逻辑Web浏览器的使用添加web浏览器，对按钮4进行编程，点击打开购票网页，提出问题，如何才能显示浏览器添加web浏览器，自主尝试隐藏图片控件Web浏览器控件的认识和编程，图片控件的隐藏和显示总结老师进行整体总结对基础知识进行梳理。
5App Inventor编程基础
College of Mathematics and Computer Science, Hunan Normal University
变量
在AI中，变量包括全局变量和局部变量二种 全局变量可以用在应用的所有过程及事件处理函数 中，是一个独立的块。在应用的运行过程中，可以 在应用的任何部分对全局变量的值引用和修改。
选择
代码块
College of Mathematics and Computer Science, Hunan Normal University
选择
下面改写成嵌套结构
College of Mathematics and Computer Science, Hunan Normal University
College of Mathematics and Computer Science, Hunan Normal University
全局变量
定义
使用
College of Mathematics and Computer Science, Hunan Normal University
全局变量
College of Mathematics and Computer Science, Hunan Normal University
局部变量
定义局部变量
College of Mathematics and Computer Science, Hunan Normal University
局部变量
局部变量
将例1的计算器修改成局部变量来实现
College of Mathematics and Computer Science, Hunan Normal University
五下第三单元第11课《初识App Inventor》【教案】
第11课初识App Inventor
第二环
节他山之
石一、厚积薄发
（引导策略：如何启动App Inventor？）
1.启动App Inventor。
双击软件图标，启动App Inventor的后台服务程序。
启动浏览器，建议使用谷歌浏览器，在浏览器地址栏中输入启动器提示的网址，回车键进入登录界面。
单击“Log In”进入主程序界面
二、急速重组
认识App Inventor的工作界面
初次运行App Inventor时，界面会弹出“新建项目”提示，单击“新建项目”按钮。
（1）App Inventor程序界面课分为设计界面和编程界面。
设计界面可划分为9个部分：
可视组件与不可视组件：拖动组件到工作区域时，可视组
件可在手机模拟屏幕上显示，同时也会出现在组件列表中；非可视组件则只在手机模拟屏幕下方提示，并出现在组件列表中
编程界面可划分为8个部分:
保存项目：
在App Inventor中编辑完成时，单击“项目”，在弹出的菜单中选择“保存项目”，完成保存。