你的位置：少儿编程 > App Inventor > 2.2 安安诞生组件设计

2.2 安安诞生组件设计

App Inventor 少儿编程 6年前 (2018-11-19) 2359浏览 1评论

零基础Android应用开发

第一章 Android与App Inventor
1.1 Android平台简介
1.2 App Inventor简介
1.3 用App Inventor开发App的过程
1.4 访问App Inventor 2开发平台
1.5 熟悉开发环境
第二章小机器人安安诞生记
2.1 安安诞生了案例展示
2.2 安安诞生组件设计
安安诞生逻辑设计
项目调试和运行
程序设计
App Inventor应用开发体系结构
第三章安安猜价格
3.1 安安猜价格
3.1.1 安安猜价格案例展示
3.1.2 安安猜价格组件设计
3.1.3 安安猜价格行为编辑
3.2 数据与运算
3.2.1 常量、变量和数据类型
3.2.2 运算
3.2.3 赋值运算
3.2.4 算数运算
3.2.5关系运算
3.2.6 逻辑运算
3.2.7 语句与程序控制
3.2.8 顺序结构
3.2.9 分支结构
3.2.10 循环结构
3.3 机器猜价格
3.3.1 笨笨机器模式
3.3.2 聪明机器模式
3.4 算法
3.5 组件属性：内置变量
3.6 思考题与实验
第四章安安爱画画
给安安的礼物：涂鸦画板
安安画画案例演示
安安画画UI设计
安安画画行为编辑
第五章安安抓蝴蝶
来抓我吧：安安抓蝴蝶
安安抓蝴蝶案例演示
安安抓蝴蝶组件设计
安安抓蝴蝶行为编辑
计算思维：数据结构与程序结构
数组
第六章安安历险记
安安历险记
安安历险记案例演示
安安历险记组件设计
安安历险记行为编辑
过程
算法
人工智能
第七章安安通讯助手
安安的通讯小助手
安安的通讯小助手组件设计
安安的通讯助手行为编辑
数据的持久化存储
第八章安安爱弹琴

(1)素材准备

通过以上案例展示，我们对“安安诞生记”的界面、交互和行为都有所了解。为了实现这个效果，需要准备一些素材：

三张图片：孵化基地背景、小机器人安安、应用图标；

一个音频文件：安安诞生后打招呼的声音；

这些素材可以在本案例实验资源包中找到，你也可以将这些换成你自己感兴趣的素材。在App Inventor中，支持的图片文件格式有 .png、.gif和.jpg等；支持的音频文件格式有.arm、.mpg和.mp3等。

(2)设计界面

用自己的账号登录开发网站后，新建一个项目，命名为“AnAnBirth”。

a) 上传素材：把项目要用到的素材先上传到开发网站。如图2.2

图2.2 上传素材

b) 设置屏幕组件属性。在App Inventor中，每一个App都至少有一个Screen组件。在新建项目时就缺省建立了一个Screen1组件，这是后面应用开发的基础。在这个Screen1组件中需要根据需求设置相应属性值，这些属性将会影响到App的界面和交互效果。

如图2.3，以及表2.1，表中默认表示该属性采用缺省的属性值，不作修改。

c) 加入其它组件，设置相应的属性，完成界面设计。

从“用户界面”组件栏中拖放一个“图像”组件到Screen1中，如图2.4。

图2.4 添加“图像”组件演示

并将组件名从自动命名的“图像1”重命名为“图像_显示”；操作过程如图2.5所示。虽然在开发过程中系统会自动以“组件类型+序号”的方式给每个组件命名以保证每个组件名不重复。但这样很难明确每个组件的具体用途，尤其是后期进行行为逻辑编程的时候。所以一个好的习惯是给每个组件都取一个有意义的名字，做到“见名知意”。