65.9K
CodeProject 正在变化。 阅读更多。
Home

Google App Inventor

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.88/5 (17投票s)

2011年9月1日

CPOL

8分钟阅读

viewsIcon

159986

downloadIcon

6053

Google App Inventor是Google Labs开发的一种RAD工具,用于以非常简单易用的方式构建Android应用程序。

引言

Scratch

Scratch 是一种编程语言,可以帮助我们创建自己的故事、动画、游戏等,并可以在网上分享。

Scratch 由麻省理工学院媒体实验室的终身幼儿园小组开发,资金支持来自美国国家科学基金会、微软、英特尔基金会、麦克阿瑟基金会、谷歌、Iomega 以及麻省理工学院媒体实验室研究联合会。

它被全球的学校、学院、博物馆、社区中心和家庭广泛使用。它特别面向 6-16 岁年龄段的人群,但所有年龄段的人都使用过它。
例如,小孩可以用它来娱乐,而成年人可以用它来完成任何学校或大学项目。

通过简单的拖放功能,任何人都可以使用 Scratch 创建应用程序。使用 Scratch 构建应用程序无需编程技能。

Scratch 开发环境的用户界面将屏幕分成几个窗格:左侧是积木面板,中间是当前精灵信息和脚本区域,右侧是舞台和精灵列表。积木面板包含代码片段(称为“积木”),可以将其拖到脚本区域来创建程序。

App Inventor

AppInventor 由 Google 开发,用于创建 Android OS 的应用程序。
它与“Scratch”非常相似,因为它也使用拖放和连接积木的概念来使应用程序工作。此应用程序面向不熟悉编程语言的人群。

据 Google 称,“即使是六年级学生也可以使用 AppInventor 构建 Android 应用。”
从 AppInventor 开发的应用程序可以在模拟器或手机上进行测试。如果一切顺利,我们可以将应用打包到手机上使用。

基本功能

AppInventor 包含两个基本组件

  1. 设计视图
    • 它包含设计应用程序所需的所有组件。
  2. 积木编辑器视图
    • 它负责将积木组合起来以执行应用程序的实际功能。

设置 AppInventor

设置 AppInventor 的先决条件

  • 应有一个 Gmail 帐户。

设置 AppInventor 的步骤

  • 从以下网站下载设置 AppInventorSetup
  • 然后安装 AppInventor 设置。
  • 这是连接和在模拟器或手机上运行应用程序所必需的。
  • 一旦您在 PC 上安装了设置,您就可以开始通过 AppInventor 构建应用了。

启动 AppInventor 的步骤

  • 输入您的 Gmail 凭据。
  • 点击“我的项目”。

  • 在这里可以看到我们之前创建的现有项目,或者我们可以创建新项目。

  • 点击新建 -> 并为项目命名(例如:Test)。

  • 这将打开 AppInventor 的设计视图。

设计视图

设计视图包含一组不同的组件,每个组件都处理不同类型的方法、操作和事件。根据用户的需求,他可以使用不同的组件来构建应用程序。这些组件由 Google 提供给用户,他们不能根据自己的需求进行修改或自定义。

以下是在设计视图中使用的组件集

  • 基本组件
  • 媒体组件
  • 动画组件
  • 社交组件
  • 传感器组件
  • 屏幕布局组件
  • 其他组件

基本组件

基本组件为构建应用程序提供了基本功能。它包括以下组件

  • Button
  • 画布
  • CheckBox
  • 时钟
  • Image
  • ListPicker
  • PasswordTextBox
  • 屏幕
  • 文本框
  • TinyDB

可以根据自己的需要使用任何组件。

媒体组件

媒体组件提供与语音、图像和视频等媒体相关的功能。
它包括以下组件

  • 相机
  • ImagePicker
  • 玩家
  • 声音
  • VideoPlayer

动画组件

动画组件提供与应用程序中动画相关的功能。它包括以下组件

  • Ball
  • ImageSprite

社交组件

社交组件提供将社交网络功能集成到应用程序中的功能。它有助于为您的应用带来社交网络的感觉。它包括以下组件

  • Contact Picker
  • Email Picker
  • Phone Call
  • PhoneNumber Picker
  • Texting
  • Twitter

传感器组件

传感器组件提供位置跟踪、游戏中加速计的使用等功能。它包括以下组件

  • Accelerometer Sensor
  • Location Sensor
  • Orientation Sensor

屏幕布局组件

屏幕布局组件可用于根据用户需求排列和更改应用程序的屏幕。它包括以下组件

  • Horizontal Arrangement
  • Vertical Arrangement
  • Table Arrangement

其他组件

除了上述组件之外,还有一些其他组件可用于各种应用程序的特殊目的。它包括以下组件

  • Activity Starter
  • 条形码扫描器
  • Bluetooth Client
  • Bluetooth Server
  • 通知器
  • Speech Recognizer
  • Text To Speech
  • Tiny WebDB
  • Web

积木编辑器视图

此视图定义了可用于根据用户需求使我们的应用程序执行不同操作集的各种积木。
设计视图的每个组件都有自己的积木集,可用于决定该组件在应用程序中的行为。
这些积木有助于以我们想要的方式构建应用程序。它描述了应用程序的行为。
应用程序的行为取决于积木连接的不同方式。
这在某种程度上称为积木编程。因此,即使是不太懂编程的人也可以看到积木并相互连接积木来运行应用程序。

此外,Appinventor 还提供了一些标准的积木集,如下所示

  • 定义积木
    • 这些积木用于在任何时候定义一些变量,以进行一些过程调用等。
  • 文本积木
    • 这些积木用于执行各种文本相关操作,例如比较、拆分、转换为大写或小写等。
  • 列表积木
    • 这些积木用于执行列表操作,例如创建列表、选择列表项、插入列表、从列表中删除等。
  • 数学积木
    • 这些积木允许我们执行所有与数学相关的操作。
  • 逻辑积木
    • 这些积木用于执行逻辑操作,例如 and、or 和 not。
  • 控制积木
    • 这些积木用于执行诸如 if-else、条件、foreach、range 等操作。
  • 颜色积木
    • 这些积木用于执行颜色操作,例如更改颜色、为组件定义新颜色等。
设计视图中的每个组件都有其自己的积木集。

案例研究

使用 Google AppInventor 构建一个简单的 Twitter 客户端

  • 可以根据自己的需求构建许多应用程序。
  • 在这里我们将构建一个简单的 Twitter 客户端。
  • 在此 Twitter 应用程序中,每个应用程序仅与一个人相关联,因为凭据已映射到应用程序中。
  • 如我们所知,我们有两个基本组件用于在 AppInventor 中构建任何应用程序。

首先,我们将查看设计视图

设计 Twitter 客户端设计视图的步骤

  • 我们有一个“登录”按钮,它将使用户能够登录应用程序。
  • 然后我们有一个名为“Label1”的标签,显示消息“未登录?”。此标签有助于识别用户是否已成功登录。
  • 成功身份验证后,标签中的消息将更改为“已登录”。
  • 然后我们有一个名为“tweetMsgBox”的 TextBox。用户在此处撰写他们的推文。
  • 当用户写完推文并想发布时,可以使用名为“tweetButton”的 Button
  • tweetLogoutButton 用于从应用程序注销。
  • 我们还有一个名为“Twitter”的非可见组件,它将帮助我们执行所有与 Twitter 相关的操作。

Twitter 中的身份验证机制

  • AppInventor 中使用的 Twitter 组件没有用于接受用户名和密码的积木,因此无法授权客户端。
  • 由于 Twitter 使用 OAuth 机制进行身份验证,我们需要授权我们的应用程序并授予其访问权限,以便它可以访问 Twitter 功能。
  • 有关 OAuth 的更多详细信息,请参阅https://dev.twitter.com/docs/auth/
  • 所以基本上,Twitter 组件需要“Consumer Key”和“Consumer secret”来进行身份验证。
  • 一旦我们获得 consumer key 和 consumer secret,它就会验证客户端。

获取 Consumer Key 和 Consumer Secret 的步骤

  • 访问网站http://dev.twitter.com/
  • 使用您的 Twitter 凭据登录。
  • 登录后,您需要填写所需详细信息,之后您将拥有您的 consumer key 和 consumer secret。
  • 因此,当您使用 consumer key 和 consumer secret 登录您的 Twitter 客户端时,它会请求授权应用程序的权限。
  • 它还会要求输入 Twitter 用户名和密码。
  • 授权后,您就可以发布推文了。

现在我们可以查看积木编辑器视图

设计积木编辑器视图的步骤

  • 首先,我们需要授权 Twitter 客户端(即需要登录)。因此,在单击 LoginButton 时,我们需要调用积木“Twitter.Authorize”。
  • 此积木使用 OAuth 身份验证机制,利用设计视图中 Twitter 组件定义的 consumer key 和 consumer secret 来验证客户端。
  • 最初,我们将 tweetMsgBoxtweetButtontweetLogout 按钮的可见性设置为 false。
  • 成功登录后,我们将 login 按钮的可见性设置为 false,并将 tweetMsgBoxtweetButtontweetLogout 按钮的可见性设置为 true
  • 用户可以在 tweetMsgBox 中编写任何推文,并通过单击 tweetButton 进行发布。
  • 用户完成发推文后,可以使用 logout 按钮退出系统,该按钮会调用 Twitter.DeAuthorize 积木,并将 tweetMsgBoxtweetButtontweetLogout Button 的可见性设置为 false
  • 然后它将再次返回主登录页面。

结论

借助 Google App Inventor 等 RAD 工具,您可以轻松快速地构建 Android 应用程序。

AppInventor 在其设置中提供了一套功能。如果构建应用程序的需求包含所有组件/积木,我们可以使用 AppInventor 快速轻松地构建应用程序。

最新的 Google App Inventor 已由 Google Labs 开源,现已由 MIT 接管。因此,它现在将在 MIT Labs 下运行。

© . All rights reserved.