15-1相机.pptVIP

第15章 相機與多媒體 15-1 相機 15-2 播放音樂與錄音 15-3 抓取多媒體資料 15-4 應用實例：上傳圖檔至伺服器 15-1 相機 15-1-1 照相 15-1-2 選取圖片 15-1-1 照相-說明 PhoneGap是使用Camera物件存取行動裝置預設的相機程式，我們可以使用物件唯一的getPicture()方法來照相或從預設圖庫程式來選取圖片，其傳回值是Base64編碼字串，或圖檔URI。 15-1-1 照相-getPicture()方法 首先建立CameraOptions物件options後，使用navigator.camera屬性取得Camera物件來呼叫getPicture()方法來執行照相，成功呼叫第1個參數onPhotoDataSuccess()回撥函數取得圖片資料；失敗呼叫onFail()回撥函數，最後1個參數是CameraOptions物件的選項，如下所示： var options = { quality: 50, destinationType: Camera.DestinationType.DATA_URL }; navigator.camera.getPicture(onPhotoDataSuccess, onFail, options); 15-1-1 照相-CameraOptions物件選項的屬性 15-1-1 照相-onPhotoDataSuccess()回撥函數 在onPhotoDataSuccess()回撥函數可以將取得的Base64編碼字串顯示在img標籤，如下所示： function onPhotoDataSuccess(imageData) { var image = document.getElementById(image); image.src = data:image/jpeg;base64, + imageData; } 函數在取得img標籤物件後，指定src屬性的內容是取得的圖片資料，前方字串指定使用Base64編碼，圖片格式是預設JPG。 15-1-1 照相-onPhotoFileSuccess()回撥函數 如果是使用Camera.DestinationType.FILE_URI傳回格式，呼叫的回撥函數為onPhotoFileSuccess()，如下所示： function onPhotoFileSuccess(imageData) { var image = document.getElementById(image); image.src = imageData; } 函數直接將參數imageData的圖檔路徑指定給src屬性（Android不是圖檔路徑，而是媒體資源的索引）。 15-1-1 照相-onFail()回撥函數 如果失敗，就呼叫onFail()回撥函數顯示錯誤訊息，參數是錯誤訊息字串，如下所示： function onFail(message) { alert(照相錯誤: + message); } 15-1-1 照相-圖例 15-1-2 選取圖片-getPicture()方法 Camera物件的getPicture()方法除了可以使用預設相機程式來照相外，還可以選取圖庫程式中的圖片，如下所示： var options = { quality: 50, destinationType: Camera.DestinationType.FILE_URI, sourceType: source }; navigator.camera.getPicture(onPhotoURISuccess, onFail, options); 程式碼在CameraOptions物件新增sourceType屬性指定圖片來源的常數。 15-1-2 選取圖片-sourceType屬性值 CameraOptions物件sourceType屬性的圖片來源常數，其說明如下表所示： 15-1-2 選取圖片-視訊檔案 一般來說，因為圖庫程式不只有圖片檔案，可能還有視訊檔案，我們可以指定mediaType屬性來指定選擇的檔案類型，其常數如下表所示： 15-1-2 選取圖片-圖例 15-2 播放音樂與錄音 15-2-1 播放音樂 15-2-2 錄音 15-2-1 播放音樂-Media物件 PhoneGap的Media物件可以播放儲存在行動裝置，或是從Internet取得的音樂檔案。首先，我們需要建立Media物件（目前Android、iOS和Windows Phone 7支援），如下所示： var audio = new Media(src, onSuccess, onError); 程式碼使用建構