1 / 25

App Inventor

App Inventor. ——圆程序员之梦. 兰州大学分布式与嵌入式系统实验室 郭守超. 自测题. 自测题. 地震科普知识漫画. 1.1 App Inventor简介、特点. App Inventor简介 : App Inventor是一款谷歌公司开发的手机编程软件 软件使用者不需要掌握任何编程知识 创意 + 代码拼接 = 你自己的应用程序. App Inventor特点: 开发过程简单,易操作 开发创造自己的应用程序 不需要太多的编程知识 代码拼接的编码方法

Download Presentation

App Inventor

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. App Inventor ——圆程序员之梦 兰州大学分布式与嵌入式系统实验室 郭守超

  2. 自测题

  3. 自测题

  4. 地震科普知识漫画

  5. 1.1 App Inventor简介、特点 • App Inventor简介: • App Inventor是一款谷歌公司开发的手机编程软件 • 软件使用者不需要掌握任何编程知识 • 创意 + 代码拼接 = 你自己的应用程序

  6. App Inventor特点: 开发过程简单,易操作 开发创造自己的应用程序 不需要太多的编程知识 代码拼接的编码方法 创意 + 代码拼接 = 自己的程序

  7. Harold Abelson • 麻省理工学院教授 • Father of App Inventor • 计算机程序的构造和解释等

  8. 学习资料 • App Inventor中文网 • 网址:http://www.appinventor.com.cn/ • 参考书目:

  9. 1.2 App Inventor开发环境 • App inventor需要在web浏览器和Java 相关程序上运行 • Java环境配置:Java 6 • 浏览器: Mozilla Firefox 3.6或更高 Apple Safari 5.0或更高 Google Chrome 4.0或更高 IE 7或更高 • 操作系统: • Macintosh: Mac OS X 10.5, 10.6  • Windows: Windows XP, Windows Vista, Windows 7  • GNU/Linux: Ubuntu 8+, Debian 5+

  10. 手机配置 • 勾选未知来源 • 勾选USB调试 • 手机必须还有SD卡 • 有时还需要禁止屏幕自动旋转

  11. 1.3 App Inventor环境搭建 • 从http://www.java.com下载java并安装 • 进入下面链接,下载安装App Inventor • http://dl.google.com/dl/appinventor/installers/windows/appinventor_setup_installer_v_1_2.exe • 利用google邮箱账户登录 • http://beta.appinventor.mit.edu/ • 即可进行程序编辑

  12. 离线开发 • 自己搭建服务器 • 在线开发的基础上,解压以下文件 • appengine-java-sdk-1.7.5.rar • AppEngine.rar • BuildServer.rar • 离线开发时 • 运行AppEngine\startAI.cmd • 运行BuildServer\launch-buildserver32.cmd • 浏览器登录http://localhost:8888即可

  13. 2.1 App Inventor开发过程 • 登录后,首页如图所示 • 点击new,创建新程序 • 点击More Actions, • 可以添加本地程序 • 点击进入程序设计界面

  14. 开发流程

  15. 如图所示,视图设计界面主要包括如下五部分 • Palette • (控件集) • Viewer • (视图区) • Components • (组成控件) • Media • (资源管理) • Properties(属性)

  16. 从Palette拖取所需component(控件)至Viewer中 • 在Components中选择component,并可以重命名或删除 • 在Properties中对component的属性值进行修改 • 在Media中对音乐、图像等资源进行存储 • 完成设计后,点击Open the Blocks Editor • 下载 JNLP 文件,运行该文件 • 启动 Java Web Start,打开Blocks Editor(模块编辑) • 也可点击Package for Phone,把所编辑程序以apk下载至电脑上

  17. Blocks Editor结构如图所示 • 左边部分包含了主要的函数和属性模块 • Built-In • (常用基本函数) • My Blocks • (自定义component) • advanced • (component属性值) • 从图中可以看出 • 在编码过程中, • Built-In中所有基本函数可以直接使用,advanced包含了自定义component的基本属性,把所需函数模块从My Blocks中直接拖拽至右边编码区进行拼接即可。

  18. 点击New Emulator生成模拟器, • 点击Connect to Device • 链接模拟器进行程序测试 • 也可使用USB连接手机进行测试 • 测试完成后,点击Package for Phone • 下载apk安装程序

  19. 2.2 开发一个小程序 • 新建一个hello工程 • 选择Button、label、sound • 添加一个hello.mp3 • 修改相关属性 • 设计完成后,打开 • Blocks Editor

  20. 所要完成功能: • 点击按钮 • 显示hello提示文字 • 播放hello提示音 • 所需操作: • 触发按钮点击事件 • 设置label文本 • 播放音频文件 • 设置参数 • 调试程序,完成后下载安装包

  21. 总结 • App Inventor操作简单 • 开发过程简明易懂 • 有助于掌握计算机基础概念、思想 • 充分发挥想象力,锻炼动手实践能力 • 掌握界面布局、设计等人机交互原理 • 有效培养计算思维、创新思维

  22. 程序设计界面

  23. 模块编辑界面

  24. 程序运行示意图

  25. 谢谢

More Related