Embed Size (px)
DESCRIPTION
第一章 认识 App Inventor. 四川师范大学 Supported by Google. 学习目标与内容 : App Inventor 的编程基本方法. 01. 02. 选择需要的组件 并告诉这些组件去做些什么. 把组件组合成一个应用程序. 目标 App Inventor. 03. 04. 如何通过组件设计窗口 来选择组件. 通过属性设置来改变组件 的属性和添加多媒体元素. 05. 06. 通过语句块窗口把不同的 语句块组合起来控制 组件的行为. 完成一个完整的 App Inventor 应用程序 , 并在手机上运行该程序. - PowerPoint PPT Presentation
Citation preview
第一章认识 App Inventor
四川师范大学Supported by Google
目录页 CONTENTS PAGE
认识 App Inventor
程序设计的基础要素
“轻游戏”与
动画
数据交互与
移动开发
计算思维下的程序设计教学
第一章 CHAPTER 1
认识 App Inventor
程序设计的基础要素
“轻游戏”与
动画
数据交互与
移动开发
计算思维下的程序设计教学
4
目标App
Inventor
02
04
03
01
06
05
学习目标与内容 :App Inventor的编程基本方法
选择需要的组件并告诉这些组件去做些什么
把组件组合成一个应用程序
如何通过组件设计窗口来选择组件
通过属性设置来改变组件的属性和添加多媒体元素
通过语句块窗口把不同的语句块组合起来控制组件的行为
完成一个完整的 App Inventor应用程序 ,并在手机上运行该程序
5 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
1 组件设计窗口 选择需要的组件，并设置它们的属性，添加多媒体元素等
6 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
2语句块窗口 组合不同的语句块，控制组件的行为和用户交互等功能
7 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
3 测试手机（窗口） 组合不同的语句块，控制组件的行为和用户交互等功能
8 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
调色板 (Palette)视口（ view） 组件列表(Components)
调色板显示的是 App Inventor
提供的所有组件的列表。你可以从调色板中选择你所需要的组件来构成你的应用程序。这些组件在调色板中被分类摆放：包括基础组件、多媒体组件、动画组件、感应组件等
该视口显示的是你正在开发的App Inventor应用程序在手机上运行起来时是什么样子，即是应用程序在手机上的用户界面
该列表显示你的应用程序用到的组件和它们的关系等
组件属性编辑界面(Properties)
该界面显示的是你选中的某一个组件的所有具体属性，你可以在该界面中查看和更改这些属性，也可以把多媒体文件上传到该组件中。
9 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
组件标签是用来设置在应用程序显
示的文字，并可以按你的需要配置他们的大小、字体、颜色、位置等
标签（ Label）当用户按下该按钮时，应用程序产生指定的行为和反馈
按钮（ Button）
10 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
您的标题
找到标签组件
添加到应用程序
设置标签属性
打开调色板 (Palette)中的基础组件（ Basic）
把标签拖到视口（ Viewer）中你需要的位置
在组件属性编辑界面 (Properties)中，更改：文字— Text 字体— fontsize 颜色—
TextColor
11 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
请通过在应用程序中添加标签，使你的手机上呈现下图所示的界面
案例案例【标签图示】
12 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
多个标签怎么加到应用程序中的
不同标签的不同位置、颜色是怎么实现的
怎么删除一个不用的标签
欢迎你来演示
13 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
您的标题
找到按钮组件
添加到应用程序
设置按钮属性
打开调色板 (Palette)中的基础组件（ Basic）
把按钮拖到视口（ Viewer）中你需要的位置
在组件属性编辑界面 (Properties)中，更改：按钮上面的文字— Text 按钮颜色— BackgroundColor
按钮大小— Width， Height
14 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
请通过在应用程序中添加按钮，使你的手机上呈现下图所示的界面
案例案例
15 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
怎样设置按钮上面文字的大小
按下按钮后为什么没给出我们想要的答案？（ 1+1=?）
欢迎你来演示
16 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
17 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
打开语句块窗口
18 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
语句块库
19 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
怎样生成一个自己的语句块？
提问
从语句块库找到需要的语句块，拖到中央窗口中
按钮对应的语句块在哪里？
如果按下按钮将显示答案，是哪个语句块在控制按钮的这种行为
20 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
按钮的行为实现我的语句块（ My Blocks ） Button1Button1.Click
set button1.text to text
实践
21 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
结果论证Button1代表什么，可以修改吗？
显示 1+1=2后，再按按钮是什么反应？为什么？怎么让按钮恢复反应呢？
讨论
22 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
如下图所示，给按钮命名，给应用程序命名【按钮图示】
案例案例
23 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
24 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
25 01 App Inventor的基本窗口
03 语句块窗口
04 测试手机（窗口）
02 组件设计窗口
选择需要的组件并告诉这些组件去做些什么 ;把组件组合成一个应用程序
课堂小结
如何通过组件设计窗口来选择组件 ; 通过属性设置来改变组件的属性和添加多媒体元素
通过语句块窗口把不同的语句块组合起来控制组件的行为
完成一个完整的App Inventor应用程序 , 并在手机上运行该程序
