MIT App Inventor 2簡介及 「HelloPurr」程式初體驗 靜宜大學資管系 楊子青

Slides:



Advertisements
Similar presentations
跨平台移动开发框架比较 How many mobile platforms android 拥有最多的 developer. 开发语言-大众脸- java 开发成本最低,不用单独买一台电脑. 开发者账号-免费 发布应用很快-当天提交,当天就能发布 iOS 贵族平台-至少把自己包装的很高大上.
Advertisements

Android App簡介及 App Inventor 2體驗 靜宜大學資管系 楊子青
資訊軟體人才培育先導計畫102年度課程發展專案計畫 資訊軟體人才培育雲端計算與服務課程發展專案計畫- 雲端運算與行動計算課程
課程地圖 (104年入學-日間部) 校通識核心 專業課程 必修與選修 與管理模組 網路技術 App設計與應用模組 學院通識核心 學院專業核心
網站「開外掛」 優化營業人員的戰鬥力 介紹 Web365行動展售網站系統的10大特色
3.2 打地鼠游戏 学习目标: 随机图片的显示 时间控件的用法 函数的定义使用方法 随机数的产生使用方法 数学公式的使用方法 任务目标:
Are you ready to be an e-teacher
MIT App Inventor 2簡介及 「HelloPurr」程式初體驗 靜宜大學資管系 楊子青
MIT AppInventor.
MIT App Inventor 開發Android手機「打地鼠遊戲」 靜宜大學資管系 楊子青
第二章 B4A程式語言的開發環境 課程名稱:程式設計 授課老師:李春雄 博士
小欧操作说明.
Android App 系統開發教學 Luna 陳雯琳 2014/12/18
使用Android Studio 開發Android App 靜宜大學資管系 楊子青
App 晶片一甲 4A 林渼茵.
APP程式與教學應用互動 正創科技.
第 1 章 使用 APP INVENTOR 2 開發 ANDROID APP
第2章 建立Android應用程式 2-1 Java語言、XML文件與Android 2-2 建立第一個Android應用程式
臺北市立大學 資訊科學系(含碩士班) 賴阿福
Introduction to AppInventor 2
MIT App Inventor簡介及 「Hello World」程式初體驗 靜宜大學資管系 楊子青
行動商務與多媒體應用學系 詹啟祥 辦公室:HB35室 分機:
App Inventor 零基础Android移动应用开发
Android程式開發準備 Android智慧型手機程式設計 建國科技大學 資管系 饒瑞佶 2012/4 V1 2012/8 V2
Introduction on Smartphone Platform
HelloPurr 靜宜大學服務學習發展中心、資管系 楊子青
安裝與設置 Android 發展環境 靜宜大學資工系 蔡奇偉副教授 ©.
手機作業系統介紹.
App Inventor 2基礎概念 靜宜大學資管系 楊子青
開發環境 開發環境簡介 十八豆資訊、靜宜大學資訊學院.
Working with Databases (II) 靜宜大學資管系 楊子青
App Inventor 2體驗 靜宜大學資管系 楊子青
Lesson 2 十分钟完成照片雕刻 建议您用大屏幕观看教学,并同时用手机进行操作 官方网站 : cubiio.muherz.com
Working with Databases (II) 靜宜大學資管系 楊子青
R教學 安裝RStudio 羅琪老師.
ASP.NET基本設計與操作 建國科技大學 資管系 饒瑞佶 2007年.
教務行政資訊系統 簡介 資訊科技中心 資訊系統組 徐振琦
認識科學小知識-密室逃脫遊戲(App) 南華大學 傳播學系3年級
安裝JDK 安裝Eclipse Eclipse 中文化
OpenID與WordPress使用說明
Android App簡介及 App Inventor 2體驗 靜宜大學資管系 楊子青
2019/1/13 行動裝置如何使用東海大學SSLVPN.
App Inventor 2體驗 靜宜大學資管系 楊子青
Bluetooth (藍牙) 靜宜大學資管系 楊子青
App Inventor 2初體驗 靜宜大學資管系 楊子青
UpToDate Anywhere 設定方法
Programming Your App’s Memory 靜宜大學資管系 楊子青
開發環境 開發環境簡介 十八豆資訊、靜宜大學資訊學院.
讓Emulator可以 使用Android Market
中信行動祕書,Android安裝「中信行動祕書」
多人開發Screen與專案Merge 靜宜大學資管系 楊子青
創意App實作 課程簡介 靜宜大學資管系 楊子青.
Text To Speech (TTS, 文字轉語音) 靜宜大學資管系 楊子青
基于App Inventor的物联网工程导论课程实验设计
HelloPurr_Extend 靜宜大學資管系 楊子青
App Inventor 2體驗 靜宜大學資管系 楊子青
Visible Body- Human Anatomy Atlas 2017
Repeating Blocks: Iteration 靜宜大學資管系 楊子青
App Inventor 2體驗 及呼叫PHP程式存取資料庫 靜宜大學資管系 楊子青
數位多媒體整合設計 期中報告 進圖三 高常馨.
Video 影像 (VideoPlayer 影像播放器、Camcorder 錄影機) 靜宜大學資管系 楊子青
Text To Speech (TTS, 文字轉 語音)、讀簡訊 靜宜大學資管系 楊子青
實驗十六:匯出APK安裝檔與軟體上架.
打Mole不打Ladybug (IV): 讓使用者控制Ladybug移動 靜宜大學資管系 楊子青
安裝JDK 配置windows win7 環境變數
Activity的生命週期: 播放音樂與影片 靜宜大學資管系 楊子青
明日夫子APP 下載流程與操作說明 中大團隊.
NFC (近場通訊, Near Field Communication) 靜宜大學資管系 楊子青
Visible Body Human Anatomy Atlas
Jquery Mobile開發須知 周季賢.
Presentation transcript:

MIT App Inventor 2簡介及 「HelloPurr」程式初體驗 靜宜大學資管系 楊子青 2014.2.14.

行動應用程式 隨著智慧型手機和平板電腦等行動裝置的快速普及,帶動行動應用程式(Mobile Application,簡稱App)的不斷開發 除了有趣的小遊戲之外,也能提供許多生活相關資訊。 App目前在電子商務的應用大致分成三類: (1)透過有趣的應用,以增強品牌的形象與知名度; (2)將App與社群網站的分享機制結合,達到口碑行銷; (3)直接讓消費者隨時完成消費行為

App開發技術主要分類 原生應用程式(Native App)開發 網頁應用程式(Web App)開發 混合式應用程式(Hybrid App)開發

(1) 原生應用程式(Native App)開發 由手機或平板作業系統廠商,自行提供 SDK或建議的開發方式,例如 iOS App:使用 Xcode與Objective-C開發,上架到App Store上 Android App:使用Eclipse與Java開發,上架到Google Play,或直接執行apk安裝檔 Windows Store App:使用Visual Studio與C/ C++/ C#/ VB.NET/ HTML5與Java Script開發,上架到Windows Store 優點 善用手機的特性(例如GPS定位、相機攝影鏡頭、感應器等)、更好的執行速度和使用者體驗、支持離線運作、提供較豐富的圖形和動畫、在應用商店輕易地找到應用及安裝; 缺點 開發成本較高、上架時間(應用商店審查程序)較長、使用者須手動下載更新版本、下載應用可能需要付費。

(2) 網頁應用程式(Web App)開發 使用HTML5、CSS及Java Script等網頁技術開發的應用程式 優點 缺點 可同時於桌上型或行動設備的瀏覽器中執行 優點 支援不同作業系統與平台的行動設備、開發成本較低、方便快速地部署(無需提交到應用商店)、使用者無須更新即可使用最新版本 缺點 需透過網路連線導致速度較慢、無法充分運用手機的特性、開發者較難藉由使用者下載應用而獲利

(3) 混合式應用程式(Hybrid App)開發 以網頁應用程式開發客戶端程式 再透過PhoneGap等框架工具跟行動裝置互動 最後包裝上原生應用程式的外殼,上架至應用程式商店。 優點 較原生應用程式支援較多的平台、適用於應用程式商店、部分支援離線功能; 缺點 仍須上架時間、速度及使用者體驗不如原生應用程式、 相關技術尚未成熟、無法完全支援各種行動裝置。

智慧型手機作業系統

智慧型手機作業系統

主要的Android手機開發平台 Eclipse + Java程式語言

Android SDK 手機應用程式開發教學 http://blog. chinatimes

1. 初步使用MIT App Inventor 開啟Google Chrome瀏覽器 若需安裝,可連線: http://www.google.com.tw/chrome 進入MIT App Inventor官方網站,按Create http://appinventor.mit.edu/ 用Gmail帳號登入 (或申請一個新帳號)

建立新專案

專案編輯畫面,按Guide線上輔助

What is App Inventor Lets you develop applications for Android phones using a web browser and either a connected phone or emulator. The servers store your projects. The App Inventor Designer: select the components for app. The App Inventor Blocks Editor: assemble program blocks that specify how the components should behave

System requirements

Setting Up App Inventor 2

Option Two: Emulator http://appinventor.mit.edu/explore/ai2/setup-emulator.html

Option Two: Emulator (1) Step 1. Install the App Inventor Setup Software 以Windows為例: http://appinventor.mit.edu/explore/ai2/windows.html 下載以下檔案,進行安裝 AppInventor_Setup_Installer_v_2_2.exe

Option Two: Emulator (2) Step 2. Launch aiStarter (Windows & Linux only)

Option Two: Emulator (3) Step 3. Connect to Emulator

Option Two: Emulator (4) Setup complete!

2. Hello World!

加入Textbox元件,可供輸入

加入Button元件 (送出之按鈕)

加入Label元件 (顯示結果)

選Blocks頁籤

程式撰寫,再以模擬器顯示結果

模擬器執行結果

3. Hello Purr! 加入Label元件,填入Text屬性

加入Button元件 Text屬性清為空白、Image屬性加入kitty.png

選Media群組,加入Sound元件 Source屬性加入meow.mp3

Save後,按Blocks 編輯程式:按Button1時(Click事件),播出聲音(呼叫Sound1.Play)

以模擬器測試執行結果 (若按圖片沒有聲音, 請先reset connection,再重新開啟模擬器)

4. 在手機進行模擬:wifi http://appinventor.mit.edu/explore/ai2/setup.html 條件:撰寫程式之電腦(或NB),需與手機使用相同wifi

Option One: wifi (1) Step 1. Download and install the MIT AI2 Companion App on your phone.

Option One: wifi (2) Step 2: Connect both your computer and your device to the SAME WiFi Network Step 3: Open an App Inventor project and connect it to your device. Choose "Connect" and "AI Companion" from the top menu:

Option One: wifi (3) Step 3: Open an App Inventor project and connect it to your device. (cont.) A dialog with a QR code will appear. On your device, launch the MIT App Companion app just as you would do any app. Then click the “Scan QR code” button and scan the code in the App Inventor window:

5. 手機特色1:讓手機震動(Sound1.Vibrate) 0.5秒

手機特色2:搖晃手機 加入AccelerometerSensor元件

搖晃手機時(AccelerometerSensor.Shaking)即發聲

6.將APP程式下載至行動裝置(方法1) 產生QR code 下載至行動裝置及進行安裝

將APP程式下載至行動裝置(方法2) 將APP程式轉成apk檔 自行放上網路 或將檔案轉存至行動裝置 再進行安裝