Download presentation
Presentation is loading. Please wait.
1
App Inventor 2體驗 靜宜大學資管系 楊子青
2
網頁應用程式(Web App)開發 使用HTML5、CSS及Java Script等網頁技術開發的應用程式 優點
可同時於桌上型或行動設備的瀏覽器中執行 響應式網頁設計(Responsive web design, RWD) 實例及技術 優點 支援不同作業系統與平台的行動設備 開發成本較低 方便快速地部署(無需提交到應用商店) 使用者無須更新即可使用最新版本
3
原生應用程式(Native App)開發 由手機或平板作業系統廠商,自行提供 SDK或 建議的開發方式,例如 優點
iOS App:使用Xcode開發環境撰寫Objective-C或Swift開發,上架到App Store Android App:使用Android Studio(或Eclipse)開發環境撰寫Java,上架到Google Play,或直接執行apk安裝檔 優點 善用手機的特性(如GPS定位、攝影鏡頭、感應器等) 更好的執行速度和使用者體驗、支持離線運作 提供較豐富的圖形和動畫 在應用商店輕易地找到應用及安裝
4
各廠牌智慧型手機市場佔有率
5
智慧型手機作業系統市場佔有率
6
iOS App開發環境:Xcode + Swift程式語言 (資管大三上:iOS APP實務設計 )
7
Android App開發環境:Android Studio + JAVA 程式語言 (資管大二下:行動應用軟體開發)
8
簡易的Android App雲端開發環境: MIT App Inventor (大三通識:創意APP實作)
9
1.初步使用MIT App Inventor 開啟Google Chrome瀏覽器 進入MIT App Inventor 2官方網站
若需安裝,可連線: 進入MIT App Inventor 2官方網站 用Gmail帳號登入 (或申請一個新帳號)
10
拖曳一個Label,將元件名稱更名為LabelHello
11
自行修改LabelHello屬性 Text(顯示文字):改為「App好好玩」 BackgroundColor(背景顏色)
FontSize(字體大小) TextColor(字體顏色) Width(寬度):Fill parent (與母視窗一樣寬) TextAlignment(文字對齊方式)
12
2. Hello Purr! 加入Button元件,命名為ButtonSend Text屬性:空白、Image屬性:上傳kitty.png
13
積木組合式程式語言 按Blocks 編輯程式 按Button1時(Click事件) 播出聲音(呼叫Sound1.Play之方法)
切換到模擬器,按圖片
14
完成以下程式碼
15
3.將APP程式下載至行動裝置(方法1) 產生QR code 下載至行動裝置及進行安裝 (設定→安全性→未知的來源需打勾)
16
備註 可以用Line或掃瞄QR code軟體下載安裝 如果掃瞄後,系統若用Chrome下載,但是直接閃過,可以嘗試:
Android 6以上的裝置,需開放「儲存」權限: 設定→應用程式→Chrome →權限→將「儲存」開啟 把Chrome的所有視窗均關閉
17
將APP程式下載至行動裝置(方法2) 將APP程式轉成apk檔 使用USB連接線連接行動裝置,或是用gmail寄信
方式給自己或朋友,將檔案轉存至行動裝置,再 進行安裝
18
4.加入音效 選擇Media群組,加入Sound元件 Source屬性加入meow.mp3
19
加入其他媒體資源 於螢幕右下角Media,上傳lion.jpg及roar.mp3
20
完成以下程式碼
21
5.測試(Setting Up App Inventor 2)
22
Option Two: Emulator
23
Option Two: Emulator (1)
Step 1. Install the App Inventor Setup Software 以Windows為例: 下載以下檔案,進行安裝 MIT_Appinventor_Tools_2.3.0.exe
24
Option Two: Emulator (2)
Step 2. Launch aiStarter (Windows & Linux only)
25
Option Two: Emulator (3)
Step 3. Connect to Emulator
26
模擬器執行結果(首次可能需要更新)
27
模擬器更新
28
重新模擬
29
6. 行動裝置特色體驗 (1) 讓手機震動(Sound1.Vibrate) 0.5秒
30
行動裝置特色體驗 (2) 搖晃行動裝置隨即震動 從Sensors群組,加入AccelerometerSensor元件
AccelerometerSensor.Shaking 搖晃事件
Similar presentations