写给大家看的安卓应用开发书:App Inventor 2快速入门与实战(txt+pdf+epub+mobi电子书下载)


发布时间:2020-06-29 17:44:46

点击下载

作者:沃尔贝(David Wolber)

出版社:人民邮电出版社

格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT

写给大家看的安卓应用开发书:App Inventor 2快速入门与实战

写给大家看的安卓应用开发书:App Inventor 2快速入门与实战试读:

前言

想象一下,你像往常一样,正在一条熟悉的路上慢跑,突然脑中产生了一个想法——一款全新的杀手级移动应用!一路上,你甚至忘记了时间,一心想着要把这个想法付诸实践。但是该从哪里下手呢?你并不是一名程序员,而要成为程序员怎么也得花上几年的时间,何况时间就是金钱,等你真的成为程序员的时候,可能早已有人把它做出来了。于是就这样,你的灵感胎死腹中了。

现在来设想一个全然不同的世界,在那里,创建应用不需要有多年编程经验,艺术家、科学家、人道主义者、卫生保健工作者、律师、消防员、马拉松运动员、足球教练等各行各业的人,都可以自己动手创建应用。设想一下,在这个世界里,不必雇用专业程序员,就可以把想法转变为应用的原型;你还可以创建只属于你个人的应用,利用移动计算技术来满足自己独特的需求。

这就是 App Inventor 的世界,一个用于创建移动应用的可视化编程工具。实践证明,这种基于“块”语言的可视化编程方法,显著地降低了为安卓设备开发应用的门槛,就连孩子们也能够运用自如。让我们来想象一下,把电子游戏里的角色替换成你和你的朋友;或者做一款“买牛奶”的应用,当你下午 3 点钟之后路过某个超市时,手机会主动提醒你买牛奶;或者是一款问答应用,把它作为一种别出心裁的求婚方式,发给你的那一位:“问题 4:你愿意嫁给我吗?如果愿意,按下按钮发送短信。”真的有人创建了一个类似的 App Inventor 应用来求婚,而对方居然说“愿意”!面向手机的块语言

App Inventor 是一款采用拖曳操作的可视化编程工具,主要用于构建运行在安卓平台上的移动应用。App Inventor 提供了基于 Web 的图形用户界面设计工具,你可以用它设计应用的外观,然后像玩拼图游戏一样,将“块”语言拼在一起来定义应用的行为。

图 P-1 显示的代码块来自于一款应用的早期版本,它的开发者 Daniel Finnegan 是一名从未学过编程的大学生。你能猜出这是一款什么样的应用吗 ?图 P-1:一款自动回复短信的应用

这是一款短信“应答机”应用。开车时启动它,就可以对收到的短信进行自动回复。

相比传统的程序代码,这些代码块更容易理解,于是你立刻被深深地吸引住。结合自己的切身体会,你也提出了一些问题:能不能将收到的短信大声地读出来?我能自定义回复内容吗?能不能做一个像《美国偶像》(American Idol)那样的应用,让人们用短信来投票?以上所有问题的答案都是肯定的。这本书就是要告诉你怎么做。用App Inventor做什么

可做的事情简直是太多了!● 把开发当作游戏为手机编写应用本来就很有意思,而使用 App Inventor 则更

增添了探索和发现的乐趣。只需在 Web 浏览器中打开 App

Inventor,连上手机,并像图 P-1 中那样把一些块拼在一起,立

即就能在手机上看到你的应用,并且能够与之交互。于是你开始

编程,你发邮件给朋友们,让他们发短信来测试你的应用;或者

用刚写好的应用来控制一个乐高 NXT 机器人;再或者拔下手机,

走到户外,去验证一下应用中的位置传感器是否有效。● 创建原型应用有了创建一款应用的灵感,是吗?那就快速地创建一个原

型,切莫随手记在餐巾纸上,或者干脆让它随风飘散。什么是原

型呢?它是你构思的模型,是有待完善的作品。用文字来表达想

法,就像是写一篇散文给你的朋友或爱人;而用 App Inventor 创

建一个原型,就像是写给风险投资人的一首诗。因此我们说,对

于移动应用的开发来说,App Inventor 就像一张电子餐巾纸。● 构建个性化应用目前,在移动应用的世界里,我们只能被动接受那些推送过

来的应用。你就没有抱怨过吗?我们更期待那种个性化的应用,

或者至少让我们能够有所取舍。使用 App Inventor,你就可以创

建出更贴近自己需求的应用。例如,第 3 章的“打地鼠”游戏

中,有一个随机移动的地鼠,每次触碰到它你都可以增加得分,

你完全可以把教程中的地鼠替换成你想要的形象,比如你弟弟妹

妹的照片,或者随便什么你能想到的东西,只要你喜欢!同样,

在第 8 章的出题应用中,我们给出的问题都与美国总统有关,

你可以轻而易举地将那些问题替换成你感兴趣的问题,比如,你

最喜爱的音乐、你的家族历史,等等。● 开发完整的应用App Inventor 不只是一个原型开发系统或界面设计器,它也

可以用来创建各种完整的应用。它所使用的块语言提供了所有基

础的编程指令,如循环语句及条件语句等,只不过是以“块”的

方式来呈现而已。● 教学无论是对于初中、高中还是大学的学生,App Inventor 都是

一个非常出色的教学工具。它的出色不仅仅是对计算机科学而言,

对于数学、物理、工商管理以及几乎任何其他学科来说,它也是

一个了不起的工具。重要的是在创造中学习,而不是死记公式。

例如,你创建了一个寻找最近医院(或商场)的应用;又比如,

用马丁 · 路德 · 金和马尔科姆 · X 的视频或演讲的录音片段来创

建一个多媒体的问答应用,远比写一段黑人历史的文章来得生

动。我们坚信 App Inventor 以及本书将成为你学习中贯穿始终的

强有力的工具。为什么要用App Inventor

很多人说 App Inventor 之所以易用,是因为它采用了可视化操作界面以及可拖曳的块语言。但这背后究竟意味着什么呢?为什么 App Inventor 会易于使用?● 无需记忆和输入指令对于初学者来说,学习编程有两大困难:一是要输入代码,

二是要面对那些计算机弹出的令人费解的错误信息。这种困难带

来的挫折感,往往使初学者还没体会解决逻辑性问题的乐趣,就

中途放弃了。● 你要做的只是选择在 App Inventor 中,组件和代码块被分门别类地放在不同的

抽屉中,触手可得。编程的过程就是找到这些块并把它们拖到程

序中来实现你预想的功能,你不需要记住那些指令或查阅参考手

册。● 限定代码块之间的匹配同那些让程序员感到挫败的神秘错误信息相比,App

Inventor 的块语言从一开始就排除了很多犯错的机会。例如,如

果一个代码块要求你输入数字,你就无法输入数字以外的任何字

符。这虽然不能消除所有的错误,但起码会排除很多低级错误。● 事件的即时处理在传统编程语言诞生的那个年代,编写程序就是按照特定的

顺序输入一组命令,就像厨师照着菜谱的流程做菜一样。但是在

图形用户界面中,特别是在移动应用中,程序将不再按照某个特

定的顺序执行,而是由那些随时可能发生的事件(例如,收到短

信或来电)触发运行。因此,大多数的程序都不再采用这种菜谱

的模式,取而代之的是对事件的处理。事件处理程序的工作方式

是“当某事件发生时,做某事”。在传统的语言(如 Java)中,

你要了解类、对象,以及一种叫作“事件侦听器”的特殊对象,

每个侦听器代表一个事件。而在 App Inventor 中,你可以拖曳出

一个“事件块”来表示“用户点击按钮”或“收到短信”之类的

事件。适合创建哪些类型的应用

用 App Inventor 可以创建各种不同类型的应用。只需发挥你的想象力,就能创建出各种既有趣又实用的应用来 。● 游戏一般人们都会从简单的应用开始,例如,第 3 章的“打地

鼠”游戏,或者第 2 章的油漆桶应用(在朋友的脸上绘画)。然

后随着不断进步,你可以开始按照自己的想法做一些更复杂的游

戏,如“吃豆子”“太空侵略者”等。你甚至可以使用手机中的

传感器,通过倾斜手机来控制游戏中角色的移动(第 5 章)。● 教学类应用App Inventor 不仅限于制作简单的游戏,也可用于创建信息

和教育类应用。第 8 章的总统问答应用可以帮助学生们在考试

前更好地复习,第 10 章的出题与答题应用,允许用户为自己定

制一份考卷(想想那些长途旅行的家长们会多么喜欢这个应

用!)。● 位置感知应用因为 App Inventor 提供了访问 GPS 位置传感器的功能,因

此可以构建一个定位应用,知道自己在哪儿;也可以构建一个停

车定位应用,帮你记住停车位置(第 7 章);或者一个找人的应

用,在音乐会或大型会议中显示你的朋友或同事的位置;或者一

个定制的导游应用,为你所在学校、工作场所或博物馆预置游览

路线。● 高科技应用你还可以创建以下类型的应用:条码扫描、聊天、听力练习(文字识别)、音乐播放、音乐制作(第 9 章)、视频播放、检

测手机的方向和加速度、拍照以及打电话,等等。如果把智能手

机比作一把功能多样的瑞士军刀,那么编写程序就是操作这把刀

的技术,而 App Inventor 让这门技术更易于掌握。● 短信应用“开车不发短信”(第 4 章)就是一个短信类应用的简单案

例。你还可以编写一个自动问候的应用,定时给你的亲友们发送

诸如“想念你”之类的短信;或者类似于“广播中心”(第 11

章)那样的应用,帮助协调大型活动;再或者像《美国偶像》节

目那样的投票应用,让你的朋友通过短信来投票。所有这些类型

的应用都可以用 App Inventor 来实现。● 控制机器人的应用第 12 章介绍了一个机器人控制类应用,教你如何编写程序

来控制乐高机器人。你的手机可以充当机器人的遥控器,或者说

你的程序就是机器人的“大脑”,可以伴随它到处游走。机器人

与手机之间通过蓝牙通信,你也可以使用 App Inventor 的蓝牙组

件创建其他类似的应用,来控制周围的蓝牙设备。● 复杂应用App Inventor 大大降低了编程的门槛,让你在短时间内就可

以创建出很炫的高科技应用。但这门语言的功能并不简单,它提

供了循环、条件以及其他的语言要素与逻辑结构,可以编写出逻

辑复杂的应用程序。在尝试创建应用的过程中,你会惊奇地发现

解决这些逻辑问题是多么有趣。● 基于 Web 的应用App Inventor 也提供了应用与 Web 之间的通信手段。你可

以写一个应用,从 Twitter 或 RSS 订阅中抓取数据,或者访问亚

马逊网上书店,通过扫描条码来查询一本书的线上价格。哪些人能够创建应用

App Inventor 开发工具是一款在线应用(非桌面程序),向所有人免费开放。只要你能联通网络,就可以在任何浏览器中使用它。你甚至不需要手机:内置的安卓模拟器可用于应用的测试。截至 2014 年 9 月,App Inventor 已经拥有了 190 万注册用户,他们来自 195 个国家,并共同创建了将近 500 万个应用。

是谁创建了这些应用?他们是专职的程序员吗?有些是,但大多数不是。

其中最有说服力的例子是 David Wolber 教授的一门课程。Wolber 教授是本书的作者之一,就职于旧金山大学。旧金山大学为商科及文科学生开设了一门计算机科学的基础课程,而 App Inventor 是这门课程的一部分。许多参加这门课的学生对数学是既恨又怕,而这门课恰恰满足了这些患有数学恐惧症的学生的核心需求,其中绝大多数学生连做梦也没想到他们会编写计算机程序。

尽管毫无经验可言,但学生们依然学会了 App Inventor,并成功地创建了许多了不起的应用。一个英语专业的学生首创了“开车不发短信”应用;两个通信专业的学生创建了“安卓,我的车在哪儿?”应用(第 7 章);而一个国际研究专业的学生创建了“广播中心”应用(第 11 章)。有一天晚上,已经过了下班时间,一位艺术系的学生去敲 Wolber 教授办公室的门,询问他如何写一个条件循环。这让 Wolber 教授意识到,App Inventor 已经极大地改变了计算机教育的格局。

媒体也开始关注这一意义非凡的变化。《纽约时报》称 App Inventor 为“DIY 应用开发软件”。《旧金山纪事报》撰文报道了旧金山大学的学生们的工作:“谷歌让普通大众变成了应用的生产者。”《连线》杂志则采访了“开车不发短信”应用的作者 Daniel Finnegan,并断言:“Finnegan 的故事表明,编程大众化的时代已经到来。”

正如他们所说,这只猫已经跳出来了(第 1 章的应用里有一只小猫)。现在,在世界各地,App Inventor 已经被列为初中及高中课程。来自 28 个国家的 2500 多位女生参加了“技术创新挑战”项目(一个面向高中女生的课外项目,http://www.technovationchallenge.org/);在高中开设的试点课程——计算机原理的预备课程(http://mobile-csp.org/)中,也加入了 App Inventor 的内容;在许多大学新开设的入门课程中,也都有 App Inventor 的一席之地。数千名爱好者、商人、求婚者以及“能工巧匠”们正漫游在 App Inventor 的网站上,创建自己的应用。你还等什么?开始行动吧,无需拥有编程经验!排版约定

本书使用了下列排版约定。● 楷体表示新术语。● 等宽字体(constant width)表示程序片段,以及正文中出现的变量、函数名、数据库、

数据类型、环境变量、语句和关键字等。● 加粗等宽字体(constant width bold)表示应该由用户输入的命令或其他文本。● 斜体等宽字体(constant width bold)表示应当被用户自定义的值或上下文决定的值所替换的文

本。 这个图标表示提示或建议。 这个图标表示测试环节以及测试说明。使用代码示例

补充材料(代码示例、练习等)可以从 https://appinventor.org/1bookFiles 下载。本书中的各个项目已由译者在中文环境下实现,代码示例请从 1www.ituring.com.cn/book/1704 下载。——编者注

本书是要帮你完成工作的。一般来说,如果本书提供了示例代码,你可以把它用在你的程序或文档中。除非你使用了很大一部分代码,否则无需联系我们获得许可。比如,用本书的几个代码片段写一个程序就无需获得许可,销售或分发 O'Reilly 图书的示例光盘则需要获得许可;引用本书中的示例代码回答问题无需获得许可,将书中大量的代码放到你的产品文档中则需要获得许可。

我们很希望但并不强制要求你在引用本书内容时加上引用说明。引用说明一般包括书名、作者、出版社和 ISBN。比如:“App Inventor 2 by David Wolber, Hal Abelson, Ellen Spertus, and Liz Looney (O'Reilly). Copyright 2015 David Wolber, Hal Abelson, Ellen Spertus, and Liz Looney, 978-1-491-90684-2.”

如果你觉得自己对示例代码的用法超出了上述许可的范围,欢迎你通过 permissions@oreilly.com 与我 们联系。致谢

催生 App Inventor 的动机是教育。基于这样的动机,我们坚持认为,通过主动学习,程序可以成为思想的载体,可以让那些奇思妙想变为现实。因此,App Inventor 是不断发展的计算机及教育事业的一部分,这一事业始于 20 世纪 60 年代 Seymour Papert 及麻省理工学院 Logo 小组的努力,他们策划了众多的活动和计划来支持推广计算思维,其影响一直延续至今。

App Inventor 的设计借鉴了此前的计算机辅助教育的研究成果,并立足于谷歌在线开发环境。可视化编程框架则与麻省理工学院的 Scratch 编程语言密切相关。App Inventor 2 是基于 Blockly 的一个特殊实现,Blockly 由谷歌公司 Neil Fraser 领导的团队开发。将可视化的块语言编译为安卓运行代码的编译器采用了 Kawa 语言框架,而 Kawa 是 Scheme 编程语言的方言,由 Per Bothner 开发,并由自由软件基金会发布,它是 GNU 操作系统的一部分。

我们在此感谢谷歌公司及 App Inventor 原创团队,他们为我们在旧金山大学、密尔斯学院以及麻省理工学院的工作及教学探索提供了支持。特别要感谢 App Inventor 技术主管 Mark Friedman、项目经理 Karen Parker,以及工程师 Sharon Perl 和 Debby Wallach。

同样感谢麻省理工学院的 App Inventor 团队,他们一直致力于 App Inventor 的开发与完善。特别感谢技术主管 Andrew Mckinney、技术全才 Jeff Schiller、教育及推广主管 Shaileen Pokress 及 Josh Sheldon、无名英雄 Jose Domínguez 工程师,以及贡献出宝贵假期的 Franklyn Turbak 和 Ralph Morelli。

还要特别感谢旧金山大学的学生 Cayla Shaver 所做的非凡的编辑工作,以及为本书向 App Inventor 2 改版所提供的帮助。

最 后,我们还要感谢我们各自家庭成员的支 持:Ellen 的丈夫 Keith Golden,Hal 的妻子 Lynn Abelson,Liz 的丈夫 Kevin Looney,David 的妻子 Minerva Novoa。新妈妈 Ellen 还要感谢保姆 Neil Fullagar 的帮助。第一部分App Inventor 2 教程第1章你好猫咪

本章将开启你的创建应用之旅。首先介绍 App Inventor 中两个重要的组成部分——设计视图及编程视图,然后介绍应用开发的基本步骤,并带领你完成第一个应用:你好猫咪。学完本章之后,你就可以独立地创建应用了。

在程序员中有一个惯例,在搭建好新的开发环境之后,运行的第一个程序通常是“Hello World!”:通过输出(在屏幕上显示)文字“Hello World!”来测试系统是否已经就绪。这个传统可以追溯到 20 1世纪 70 年代,从 Brian Kernighan 在贝尔实验室使用 C 语言开 始。使用 App Inventor 的最大优势,就是利用安卓手机的多媒体功能——即便是最简单的应用,也可以实现声音的播放以及对触屏的响应,而不仅仅是显示文字。想想都令人兴奋,那么,让我们马上开始吧。我们创建的第一个应用是“你好猫咪”(如图 1-1)。当你触摸这只猫时,它会发出“喵呜”的叫声;当你摇晃它时,手机将产生振动。加拿大计算机科学家,曾服务于贝尔实验室,现任普林斯顿大1学教授,曾参与了 Unix 操作系统的开发。他与 C 语言之父 Dennis Ritchie 合著了《C 程序设计语言》,该书被公认为计算机技术著作的典范,书中用“Hello World!”为实例开始讲解程序设计,并成为程序设计语言图书的传统。——译者注图 1-1:“你好猫咪”应用1.1 学习要点

本章涵盖了以下要点。● 创建应用包括两个步骤:为应用选择组件以及为组件设定行

为。● 在设计视图中选择组件。有些组件会显示在设备的屏幕上,

有些则看不见。● 从电脑中上传应用中所需的素材文件(图片、音频等)。● 在编程视图中拼装代码块,来定义组件的行为。● 利用 App Inventor 的实时测试功能来测试正在创建的应用。

边创建边测试,观察应用的外观,并体验应用的功能。● 将制作完成的应用打包下载到安卓设备上。1.2 App Inventor的开发环境

打开浏览器,在地址栏中输入 ai2.appinventor.mit.edu,就可以2打开 App Inventor 最新版本 的开发环境,该版本发布于 2013 年 12 月。有人称其为 App Inventor 2,不过它的正式名称依然是 App Inventor,此前的版本则被称为 App Inventor Classic(经典版)。本3书使用的是新版本 。

App Inventor 目前一直处于升级过程中,每隔一段时间都有新的2版本发布,同时更新用于测试的 AI 伴侣。也就是说,App Inventor 与 AI 伴侣在版本上必须相匹配,测试才能完成。——译者注

本书采用的版本发布于 2015 年 8 月 29 日,汉化版编译完成于 32015 年 9 月 8 日,匹配的 AI 伴侣版本为 2.32。——译者注

App Inventor 的编程环境包括以下三个重要组成部分。● 设计视图,如图 1-2 所示,用于为应用选择组件,并对组件

的属性进行设置。图 1-2:设计视图:用于设置应用的外观● 编程视图,如图 1-3 所示,用于定义组件的行为(例如,当

用户点击按钮时,应用作何响应)。图 1-3:编程视图:用于设定应用的行为● 测试设备。在开发应用的过程中,使用安卓设备对应用进行

实时测试。如果你手边没有安卓设备,也可以使用系统中自带的

安卓模拟器来测试应用。

如果你是第一次访问网站 ai2.appinventor.mit.edu,会看到项目页。它多半是空的,因为你还没有创建过任何项目。单击页面左上角的菜单“项目→新建项目”创建一个项目,输入“你好猫咪”作为项目名称(注意不带空格),然后单击“确定”按钮。

新建项目后打开的第一个窗口是设计视图,此时,你可以单击窗口右上角的“编程”按钮来切换到编程视图。

App Inventor 是一个基于云计算的开发工具,也就是说,当你在开发项目时,项目中的所有信息都保存在网络服务器上。因此,当你关闭 App Inventor,然后再重新打开它时,项目依然还在。你不需要像使用微软公司的 Word 那样,在本地电脑上保存任何信息。1.3 设计组件

你的第一步操作是在设计视图中完成的,设计视图也被称为“组件设计器”。组件是应用的组成元素,就像菜谱中的配料。有些组件功能单一,比如标签,它仅用于在屏幕上显示文字;再比如按钮,点击按钮将引发一个活动。有些组件功能复杂,例如画布组件,它可以容纳静态图片或动画;又如加速度传感器组件,它具有运动感知能力,可以侦测到设备的移动或摇晃;另一些组件可以编写并发送短信、播放音乐和视频,或者从网络上获取信息,等等。

设计视图的外观如图 1-4 所示。图 1-4:App Inventor 的设计视图

设计视图被划分为如下几个区域。● 中部的白色区域被称为工作区域,用于放置应用中的所有组

件(可视组件与非可视组件)。工作区域的中央是用户界面的预

览窗口,对应于设备的屏幕,你可以根据自己的需要来安排用户

界面上的可视组件。预览窗口中只能粗略地显示应用的外观,例

如,同样的一行文字,在测试设备上的换行位置,可能与预览窗

口中的不同。如果想看到应用的实际外观,需要用安卓设备或模

拟器进行测试(稍后会详细介绍测试方法)。● 工作区域的左侧是组件面板,其中列出了可供选择的所有组

件。组件按类别分为九个组。默认情况下,只有用户界面类组件

处于可见状态,其他组件隐藏在各自的类别名称下,点击类别名

称,如多媒体,可以显示该类别的组件。● 紧邻工作区域右侧的是组件列表,显示了项目中的所有组

件。拖动到工作区域中的所有组件都将显示在该列表中。此时,

该项目中只有一个组件:Screen1,它代表设备的屏幕。● 组件列表下方是素材区,显示项目中的所有素材资源(图片

和声音等)。本项目中尚未添加任何素材资源,不过稍后就会添

加。● 最右边的部分是属性面板,用于显示组件的属性。在工作区

域或组件列表中单击某个组件,将在属性面板中看到该组件的全

部属性。属性描述了组件的详细信息(例如,如果点击标签组件,

将看到与颜色、显示文本及字体相关的属性),可以在属性面板

中修改组件的属性。当前显示的是屏幕(名为 Screen1)的属性,

包括背景颜色、背景图片及标题。“你好猫咪”应用中需要两个可视组件(可以理解为应用中可以被用户看到的组件):标签组件用于显示文字“可爱的猫咪”,按钮组件用于呈现一张猫咪的图片。应用中还需要两个非可视组件:音效播放器组件,用来播放声音,如猫叫声,以及加速度传感器组件,用于检测设备是否被摇晃。别担心,我们将一步一步地教你如何使用这些组件。1.3.1 创建一个标签

在项目中添加的第一个组件是标签。

(1) 添加标签:在组件面板中,打开用户界面类组件(假设它处于关闭状态),单击“标签”(用户界面组件列表中的第七项),并将其拖动到预览窗口中。你会看到预览窗口的左上角出现一个矩形框,框内有“标签 1 文本”字样。

(2) 修改标签的显示文本属性:观察设计视图右侧的属性面板,其中显示了标签的属性。大约在中间位置有一个“显示文本”属性,它的下方是标签中显示的文字。将文字改为“可爱的猫咪”并按回车键。你会看到在预览窗口上方的文字也改变了。

(3) 修改标签的其他属性:单击“背景颜色”属性下方的方框,可以改变标签的背景颜色。背景颜色的当前值为透明(无背景色),从显示的颜色列表中选择蓝色,将标签的文本颜色属性改为黄色,将字号属性改为 20。

设计视图的外观如图 1-5 所示。图 1-5:应用中有了一个标签1.3.2 添加按钮组件“你好猫咪”应用中的猫咪图片要用按钮组件来实现:添加一个标准的按钮,然后将它的图片属性更改为猫咪图片。在设计视图的组件面板中单击按钮(在用户界面类组件列表的顶部),将它拖到预览窗口中,置于标签下方。你会看到一个矩形按钮出现在预览窗口中。

好,现在按钮已经就位。我们想要实现的功能是,当它被点击时,播放一个声音。但首先我们要把它装扮一下,让它看起来像一只猫,而不是一个呆板的矩形。为此需要完成以下操作。

(1) 首先,下载一个猫咪的图片文件,将其保存在你的电脑桌面上。下载地址为 http://appinventor.org/bookFiles/HelloPurr/kitty.png。图片扩展名为 .png,这是一种标准的图片格式,与 .jpg 和 .gif 类似。 App Inventor 支持所有这些图片格式,同样也支持大多数标准格式的声音文件,如 .mpg 或 .mp3。 你可以从下列网址下载猫叫的声音文件:http://appinventor.org/bookFiles/HelloPurr/meow.mp3。

(2) 此时,属性面板中显示的应该是按钮的属性,如果不是,可以点击预览窗口中的按钮组件,以便在右侧的属性面板中查看按钮的属性。在属性面板中找到“图片”属性,点击其下方的方框(其中显示文字“无 ...”)。

(3) 点击素材区的“上传文件”按钮,点击“选择文件”按钮,从你的电脑桌面上找到刚才下载的文件 kitty.png,点击“确定”,将完成图片的上传。

(4) 这时,kitty.png 将出现在组件列表下方的素材区中。与此同时,在按钮的图片属性的下拉列表中,也将出现 kitty.png 选项。点击该选项,并点击确定按钮。这时,屏幕中的按钮变成了猫咪的图片。

(5) 注意到猫咪的图片上显示了文字“按钮 1 文本”,我们不希望在应用中看到这些字,因此将按钮 1 的“显示文本”属性修改为空(删除所有字符)。

现在设计视图看起来应该如图 1-6 所示。图 1-6:应用中的一个标签和一个显示为图片的按钮1.3.3 添加猫叫声

我们希望当点击按钮时,应用会发出猫叫声。为此需要添加猫叫的声音文件,并通过设定按钮的行为来实现这一功能。

(1) 如果尚未下载 meow.mp3,点击以下链接完成下载:http://appinventor.org/bookFiles/HelloPurr/meow.mp3(保存到你的电脑桌面)。

(2) 在设计视图左侧的组件面板中,单击多媒体类组件,打开多媒体组件列表。向预览窗口中拖放一个音效播放器组件。无论你把它放在预览窗口中的什么位置,它都将出现在工作区域底部的“非可视组件”区。非可视组件在应用中用于实现特定的功能,但它们不会显示在用户界面中。

(3) 点击音效播放器 1 以便显示其属性。设置其源文件属性为 meow.mp3。同猫咪图片一样,需要从电脑中上传这个声音文件。上传完成后,素材列表中将出现 kitty.png 与 meow.mp3 两个文件。

表 1-1 中列出了应用中现有的组件。表1-1:“你好猫咪”应用中的组件组件类型组件类别名称作用用户按钮按钮 1点击之后发出猫叫声界面用户显示文字“可爱的猫标签标签 1界面咪”音效播多媒音效播放播放猫叫声放器体器 11.4 实时测试

在使用 App Inventor 开发应用的过程中,可以随时连接安卓设备,对应用进行测试。这种边开发边测试的方式非常重要,这也是那些经验老道的程序员们的惯常做法,可以节省大量无效的工作时间。

使用安卓设备进行测试需要具备两个条件。首先,你的手机连接了 Wi-Fi。其次,你的手机上需要安装一个叫作“AI 伴侣”的应用(无需在电脑上安装任何软件)。如果你手头没有安卓设备,则需要在电脑上安装一个特殊的软件,来实现模拟器的功能。关于这一点,可以访问以下网址获得更详尽的信息:http://appinventor.mit.edu/explore/ai2/setup.html。

如果你有一部安卓设备,请执行下列操作。

(1) 用安卓设备访问谷歌商店,搜索并下载安装“MIT AI2 Companion”应用。安装成功后运行该应用。

(2) 让你的测试手机与开发电脑连接到同一个 Wi-Fi 上。

(3) 在 App Inventor 开发环境(浏览器)中,从窗口上部的菜单中,打开“连接”菜单,并选择“连接 AI 伴侣”,如图 1-7 所示。图 1-7:点击“连接”并选择“AI 伴侣”

(4) 运行测试设备上的 AI 伴侣,如图 1-8 所示。选择“扫描二维

4码”。当条码扫描程序启动后,将手机摄像头对准电脑屏幕上的条码开始扫描。前提是你的手机中安装了条码扫描软件,但有些型号的手机即4便安装了条码扫描软件,也无法启动扫描程序。——译者注图 1-8:打开测试设备上的 AI 伴侣,点击“扫描二维码”

如果一切顺利,“你好猫咪”应用将运行在测试设备上,你可以看到应用中添加的可视组件。此时,如果你在设计视图或编程视图中做任何修改,测试设备上的应用都将随之发生改变,这就是实时测试的含义。 实时测试设置: 如果在实时测试设置环节遇到麻烦,可以访问以下网址:http://appinventor.mit.edu/explore/ai2/setup.html。

如果应用已经在测试设备上运行起来,试着触摸一下按钮。你想想看会发生什么事情?什么事也不会发生,因为你还没有对它下达任何指令。用 App Inventor 开发应用,首先要明确一点,也是最重要的一点,即:在设计视图中添加的每一个组件,必须在编程视图中为其编写程序,这样它才能具备你预期的那些功能。1.5 为组件添加行为

此前我们已经为应用添加了按钮、标签及音效播放器组件,但它们只是构成应用的“硬件”。现在我们来为这些“硬件”编写必要的“软件”。首先,当触摸按钮时,让应用发出猫叫声。这些工作需要在编程视图中完成,点击设计视图右上角的“编程”按钮,切换到编程视图。

留心观察编程视图,这里将是你向组件下达指令的地方,让它们做什么,何时做,都将在这里实现。眼下,你将命令猫咪按钮,在被触碰(点击)时,发出猫叫声。如果把组件比作菜谱的食材,那么即将使用的代码块就是烹调一道菜的具体步骤。1.5.1 让猫发出叫声

在编程视图窗口的左侧、“代码块”标题下面,你可以看到三个大的代码块分组:内置块、Screen1 以及任意组件。其中 Screen1 分组中列出了这个应用中的全部组件:按钮 1、标签 1 以及音效播放器 1。点击其中任何一个组件的名称,将打开该组件的代码块抽屉,你将看到一组隶属于该组件的可选代码块。点击按钮 1,打开按钮 1 的代码块抽屉,将看到与按钮 1 有关的代码块,可以用它们来设置按钮的行为。最上面的代码块是“当按钮 1 被点击时”,如图 1-9 所示。图 1-9:点击按钮 1 显示该组件的代码块

点击代码块“当按钮 1 被点击时”,代码块将落在工作区内。注意代码块上的文字“当”,那些包含了“当”字的黄色的代码块被称为“事件处理程序”,用来定义某个特定事件发生时,应用中组件的5行为 。在这个例子中,我们感兴趣的事件发生在用户点击猫咪图片时(实际上点击的是按钮),如图 1-10 所示。接下来,我们将在这个程序中添加一些块,来响应这个点击事件。

不只是发生事件的组件。——译者注5图 1-10:在事件处理程序中设置对点击事件的响应

点击“音效播放器 1”打开代码块抽屉,找到并拖出“让音效播放器 1 播放”块。(记得吗,我们之前将音效播放器 1 的源文件属性设置为加载到项目中的文件 meow.mp3。)此时,你可能已经注意到,“让音效播放器 1 播放”块在外形上刚好与按钮 1 的点击事件块相吻合。这是 App Inventor 的特别设计,以便只有那些相匹配的块才能连接到一起。在这个例子中,包含“让”字的块用来引发组件的行为,与点击事件块连接到一起,共同构成一个整体。如图 1-11 所示,当两个块连接到一起时,会发出一个清脆的“咔哒”声。图 1-11:这时如果点击按钮,将发出猫叫声

不同于传统的程序代码(通常像混乱的“天书”一般),在 App Inventor 中,使用事件响应块,以一种简单明了的方式拼出组件的行为。在本例中,我们相当于直接说:“嘿,App Inventor,当有人点击猫咪按钮时,播放猫叫声。”测试:检查一下,确保一切运行正常。每当为应用添加了新的功能,就要及时进行测试,这一点非常重要。在测试设备上点击按钮(或在模拟器上单击它),你应该听到猫叫声。恭喜你,你的第一个应用运行起来了!1.5.2 添加振动效果

当点击按钮时,让猫咪发出叫声,同时产生振动效果,这要借助于手机的振动功能来实现。这听起来很难,其实非常容易,因为用来播放猫叫声音的音效播放器组件也可以使设备产生振动。App Inventor 可以帮助你挖掘设备的核心功能,而无需考虑这些功能(如振动)是如何实现的。现在,不必在设计视图中做任何改动,只需在编程视图中,向按钮点击事件块中添加另一个功能。

(1) 在编程视图中,单击音效播放器 1,打开其代码块抽屉。

(2) 选择“让音效播放器 1 振动”块,将其拖动到“当按钮 1 被点击”块中,置于“让音效播放器 1 播放”块下方,恰好与原来的块吻合,如图 1-12 所示。如果不吻合,可尝试拖动它,使振动块顶部的凹陷恰好与播放块底部的凸起相对。图 1-12:在按钮点击事件中播放声音并产生振动

(3) 注意:在“让音效播放器 1 振动”块的右下角写着“参数:毫秒数”字样,并且旁边还有一个开放的插槽。这种开放的插槽表示需要填入其他块,来设定行为的具体方式。本例中,开放插槽用于设定振动的时长——毫秒数。毫秒是多数编程语言中惯用的时间单位,1 秒 =1000 毫秒。如果想让设备振动半秒钟,需要输入数字块“500”。打开内置块分组中的数学抽屉,会看到一列蓝色的代码块,如图 1-13 所示。图 1-13:打开数学块抽屉

(4) 在数学块列表顶部,是数字块“0”。拖出该块,可以将 0 改写为需要的数字,如图 1-14 所示。图 1-14:选择数字块 0(0 为数字块的默认值)

(5) 选中数字 0,并输入新的值 500,如图 1-15 所示。图 1-15:将数值改写为 500

(6) 将数字块 500 拖到振动块的开放插槽中,如图 1-16 所示。图 1-16:将数字块 500 拖入毫秒数插槽测试:试试看,点击设备上的按钮,你会感觉到半秒钟的振动。1.5.3 摇晃设备

现在继续挖掘安卓设备的特色,为应用添加最后一项功能:摇晃设备时发出猫叫声。为此要用到加速度传感器组件,它可以检测到设备的摇晃或移动。

(1) 在设计视图中,展开组件面板中的传感器分组,将加速度传感器组件拖入到预览窗口中。不必介意把它放在什么位置,因为像任何非可视组件一样,无论放在哪儿,它最终都会落到工作区域底部的“非可视组件”区。

(2) 摇晃设备的事件需要与单击按钮事件分开处理。这意味着需要一个新的事件处理程序。进入编程视图,发现在代码块的 Screen1 分组中增加了一个加速度传感器 1 组件。打开其代码块抽屉,拖出“当加速度传感器 1 被晃动时”块(代码块抽屉中的第二个块)。

(3) 像点击按钮时播放声音一样,将“让音效播放器 1 播放”块放在摇晃事件块的缺口中,摇动设备试试看。

图 1-17 中显示了完整的“你好猫咪”应用中的所用代码块。图 1-17:应用中的全部代码块1.6 将应用下载到安卓设备中

App Inventor 的实时测试功能依赖于开发设备与测试设备在同一个 Wi-Fi 网络中。测试的过程虽然很方便,但问题是,如果设备与 App Inventor 之间的网络连接断开,则应用将无法运行——在设备上根本找不到这个应用,因为从来没有在设备上安装过它,它只是运行在 AI 伴侣应用中。

一个应用在开发完成后,可以将其下载并安装到安卓设备上。这样,即便安卓设备脱离了开发环境,应用也可以照常运行。现在,距离应用的完成还差一步——设置应用的发布图标:当应用安装在设备上时,它会显示为一个小图片,凭借这个图片,你可以在设备中众多的应用中找到它。在设计视图中,选中 Screen1 组件,点击图标属性下面的方框(其中显示“无”),然后选择“上传文件”,从电脑中选择一张可以充当图标的图片(也可以不必另外上传文件,直接使用 kitty.png 作为图标)。

下面来确认一下你的设备,看它是否允许从安卓商店以外的地方下载并安装应用。对大多数的安卓设备来说,都可以通过以下方法进行设置:选择“设置→安全”,并选中“未知来源”项。6

现在再返回到 App Inventor,在设计视图 中,从顶部菜单中选择“编译→显示二维码”。此时,电脑屏幕上将显示一个进度条,这个过程大约需要 1 分钟时间。当编译完成时,屏幕上将显示一个二7维码,打开你设备中的条码扫描软件 ,扫描条码。扫描完成后,设8备可能会提示你输入谷歌账户的密码 。输入密码之后,设备开始下载应用,这时设备的通知栏中会显示下载图标。打开通知栏,等应用下载完成后,选择安装。

也可以在编程视图中。——译者注6有许多适用于安卓设备的条码扫描软件。如果你的设备上尚未7安装该软件,可以从应用商店中下载并安装一个。

很多手机不会有这一项提示。——译者注8

安装完成后,设备上将出现“你好猫咪”的图标,这正是你刚刚创建的应用,现在可以在设备上使 用它了。像运行其他应用一样,运行它。(确保你运行的是刚刚安装的应用,而不是 App Inventor 的 AI 伴侣应用。)现在,你可以退出 AI 伴侣,甚至将设备的连接断开,而设备上新安装的应用依 然还在。

你要知道,一个经过编译并安装到设备上的应用,已经从你创建的 App Inventor 项目中分离出来。此时,你依然可以在开发环境中对项目进行改进,并在 AI 伴侣中进行测试,但这些修改不会体现在设备中已经安装的应用中。如果想让这些修改体现在编译后的应用中,你需要重新进行编译,下载新的版本来替换掉设备上原有的旧版本。1.7 应用的分享

有两种方式可以分享应用:分享安装文件(.apk 文件)或分享项目文件(.aia 文件)。

首先说明如何分享安装文件。在 App Inventor 项目中单击顶部菜单“编译→下载到本地”,此操作将在电脑上生成一个扩展名为 .apk 的文件。将该文件作为电子邮件的附件发送给其他人,收件人可以用安卓设备来接收并打开邮件,安装该应用;或者,也可以将该文件上9传到网络上(例如 Dropbox 上),让其他人下载安装。需要强调的是,设备的安全设置中“未知来源”一项必须选中,才能安装来自于10安卓市场 之外的应用。是 Dropbox 公司的在线存储服务,用户可以存储并共享文件和9文件夹。——译者注是谷歌公司创立的数字化发布平台,是针对安卓操作系统的官10方应用商店,被预置在安卓设备中,用户可以从中搜索、下载或购买安卓应用产品。——译者注

你也可以将 .apk 文件存放在网络上,并生成一个网络地址的二维码(图片),发布在网页上,甚至可以印刷在海报上,人们可以用自己的安卓设备扫描这个二维码来完成下载操作。网络上有很多可以将网址转化成二维码的工具(比如可以访问 qrcode.kaywa.com),你只要将生成的二维码图片发布到网页上,或添加到印刷的文档中即可。

接下来解释源文件的分享。源文件可以在开发者之间分享。在 App Inventor 开发环境中,打开需要分享的项目(如本章的例子“你好猫咪”),点击顶部菜单中的“项目→导出项目 (.aia)”,此操作将生成一个扩展名为 .aia 的文件(你好猫咪 .aia),并保存到电脑上默认的下载文件夹中。你可以用电子邮件把文件发送给其他人。收件人打开 App Inventor,选择“项目→导入项目 (.aia)”,并选择 .aia 文件,就可以在自己的开发环境中还原你的项目。此后使用者对该项目所做的任何修改,都不会影响到你的原有版本。

不久的将来,App Inventor 还将拥有自己的应用发布平台,在这里,你可以分享自己的应用,也可以 获得来自世界各地的开发者分享的项目,并改写这些项目。1.8 改进建议

在这本书里,每当完成一个应用,我们鼓励你做进一步的思考,考虑如何改进你的应用。每一章的结尾处,我们都会给出一些有针对性的建议,供你参考和尝试。这些建议将引导你从组件(设计)以及代码(编程)的角度,来探索程序改进的可能性,而不仅仅满足于教程中提供的那些方法。

下面是“你好猫咪”应用中可以改进的部分。● 当摇晃设备时,猫的叫声听起来有点儿奇怪,好像有回声。

这是因为在 1 秒钟内,加速度传感器多次触发摇动事件,所以

猫叫声是重叠的。在设计视图中,你会发现音效播放器组件有一

个最小间隔属性,它决定了两次声音播放之间的时间间隔。当前

设置为不足半秒钟(400 毫秒),这个间隔小于单次猫叫的持续11

时间 。通过改变播放的最小间隔,可以改变声音的重叠。● 如果你带着安装了这个应用的手机走在街上,每当你突然移

动时,设备就会发出猫叫声,这难免会让你觉得尴尬。通常安卓

应用一旦开始运行,就会一直处于运行状态,即使这时屏幕已经

关闭;也就是说,这时应用程序与加速度传感器之间的通信不会

中断,因而猫叫声也会相继传来。要想真正退出程序,需要唤出

应用,然后点击设备的系统菜单按钮,并选择“退出应用”,如

此才能完全关闭应用。播放软件上显示该音频文件的时间长度为 1 秒钟。——译者注111.9 小结

以下是本章中涵盖的内容。● 创建应用的过程:在设计视图中选择并添加组件,并在编程

视图中设定它们的行为——做什么以及何时做。● 有些组件是可视的,有些则不可视。可视组件会出现在应用

的用户界面中,不可视组件实现诸如播放声音这类的功能。● 通过在编程视图中组装代码块来定义组件的行为。先拖出一

个事件处理程序,如“当按钮 1 被点击时”,然后将命令代码块

嵌在其中,如“让音效播放器 1 播放”。这样,当用户点击按钮

1 时,事件处理程序中的所有代码块(命令)都将被执行。● 有些命令需要附加特定信息才能起作用。例如音效播放器的

振动命令,就需要设定振动的毫秒数。这些附加信息被称为参数。● 数字块用来表示数字。你可以将这些数字块插入到需要数字

参数的命令块中。● App Inventor 支持许多传感器组件,加速度传感器可以检测

到设备的移动或摇晃。● 你可以将创建完成的应用打包并下载到手机上,它们将独立

于 App Inventor 而运行。第2章油漆桶

本章介绍画布组件,用它来绘制简单的二维(2D)图形。具体目标是创建一个名为“油漆桶”的应用,让用户可以用不同的颜色在手机屏幕上绘画;然后改进功能,让用户用手机拍摄照片,并在照片上进行绘画。回顾历史,早在 20 世纪 70 年代,“油漆桶”这一类绘画应用是最早运行在个人电脑上的应用之一,目的是为了证明个人电脑的潜力。那时候,开发这样一款简单的绘画应用是一项极其复杂的工作,而且绘画效果也不尽人意。但现在,使用 App Inventor,任何人都可以快速地创建一个有趣的绘画应用,这也正是创建 2D 游戏的起点。

试读结束[说明:试读内容隐藏了图片]

下载完整电子书


相关推荐

最新文章


© 2020 txtepub下载