Unit 10-1 顯示圖片與相機照片 / 作業 11

建立一個顯示圖片的框框

MIT App Inventor 2

http://ai2.appinventor.mit.edu/

首先建立一個專案

放一個 Image 到畫面上

放兩個 HorizontalArrangement 到畫面上

第一個格子放入一個 Button 一個 ImagePicker 第二個格子放入兩個 Label

放入一個 Camera 元件到畫面上

選到 Image 將長寬改為 50%

將 HorizontalArrangement1 以及 HorizontalArrangement2、Button1、ImagePicker1 的寬度 (Width) 都改為 Fill parent

將 Button1 的文字改為 Camera、ImagePicker1 的文字改為 Album

將 Label1 的文字改為 Address:，Label2 的文字改為 “” (空白)

按下右下角 Media 的 Upload File…

隨便上傳一張圖片

將 Image1 的圖片改成上傳的圖片

元件結構

Blocks / 程式碼部分

放入一個 when Button1.Click do call Camera1.TakePicture 到畫面上

放入一個 when Camera1.AfterPicture image 到畫面上

放入 set Image1.Picture to get image 以及 set Label2.Text to get image 到裡面

放入 when ImagePicker1.AfterPicking 到畫面上

再來自己看圖片，懶得打字ㄌ

手機安裝畫面

範例檔案下載：點我下載