自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

PhoneGap API幫助文檔翻譯Camera攝像頭

作者：佚名
移動開發(fā)
PhoneGap API幫助文檔翻譯Camera攝像頭是本文要介紹的內(nèi)容，主要是來了解并學習PhoneGap API文檔的內(nèi)容，具體關(guān)于PhoneGap API文檔內(nèi)容的詳解來看本文。

PhoneGap API幫助文檔翻譯Camera攝像頭是本文要介紹的內(nèi)容，主要是來了解并學習PhoneGap API文檔的內(nèi)容，具體關(guān)于PhoneGap API文檔內(nèi)容的詳解來看本文，camera對象提供對設(shè)備默認攝像頭應(yīng)用程序的訪問。

方法：

camera.getPicture

參數(shù)：

  1. cameraSuccess  
  2. cameraError  
  3. cameraOptions 

camera.getPicture 

選擇使用攝像頭拍照，或從設(shè)備相冊中獲取一張照片。圖片以base64編碼的字符串或圖片URI形式返回。

簡單的范例：

  1. navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] );    
  2. navigator.camera.getPicture( cameraSuccess, cameraError, [ cameraOptions ] ); 

說明：

camera.getPicture函數(shù)打開設(shè)備的默認攝像頭應(yīng)用程序，使用戶可以拍照（如果 Camera.sourceType 設(shè)置為 Camera.PictureSourceType.CAMERA，這也是默認值）。一旦拍照結(jié)束，攝像頭應(yīng)用程序會關(guān)閉并恢復用戶應(yīng)用程序。

如果Camera.sourceType = Camera.PictureSourceType.PHOTOLIBRARY或Camera.PictureSourceType.SAVEDPHOTOALBUM，系統(tǒng)彈出照片選擇對話框，用戶可以從相集中選擇照片。

返回值會按照用戶通過cameraOptions參數(shù)所設(shè)定的下列格式之一發(fā)送給cameraSuccess回調(diào)函數(shù)：

一個字符串，包含Base64編碼的照片圖像（默認情況）。

一個字符串，表示在本地存儲的圖像文件位置。

你可以對編碼的圖片或URI做任何處理，例如：

通過標簽渲染圖片（參看后續(xù)范例）

存儲為本地數(shù)據(jù)（LocalStorage，Lawnchair*等）

將數(shù)據(jù)發(fā)送到遠程服務(wù)器

備注：較新的設(shè)備上使用攝像頭拍攝的照片的質(zhì)量是相當不錯的，使用Base64對這些照片進行編碼已導致其中的一些設(shè)備出現(xiàn)內(nèi)存問題（如IPHONE4、BlackBerry Torch 9800）。因此，強烈建議將“Camera.destinationType”設(shè)為FILE_URI。

PhoneGap API支持的平臺：

Android

BlackBerry WebWorks (OS 5.0或更高版本)

iOS

簡單的范例：

拍照并獲取Base64編碼的圖像：

  1. navigator.camera.getPicture(onSuccess, onFail, { quality: 50 });    
  2. function onSuccess(imageData) {    
  3.    var image = document.getElementById('myImage');    
  4.    image.src = "data:image/jpeg;base64," + imageData;    
  5. }    
  6.     
  7. function onFail(message) {    
  8.    alert('Failed because: ' + message);    
  9. }    
  10. navigator.camera.getPicture(onSuccess, onFail, { quality: 50 });  
  11.  
  12. function onSuccess(imageData) {  
  13.    var image = document.getElementById('myImage');  
  14.    image.src = "data:image/jpeg;base64," + imageData;  
  15. }  
  16.  
  17. function onFail(message) {  
  18.    alert('Failed because: ' + message);  
  19. } 

拍照并獲取圖像文件路徑：

  1. navigator.camera.getPicture(onSuccess, onFail, { quality: 50,    
  2.                 destinationType: Camera.DestinationType.FILE_URI });    
  3.                     
  4. function onSuccess(imageURI) {    
  5.     var image = document.getElementById('myImage');    
  6.     image.src = imageURI;    
  7. }    
  8.         
  9. function onFail(message) {    
  10.     alert('Failed because: ' + message);    
  11. }    
  12. navigator.camera.getPicture(onSuccess, onFail, { quality: 50,  
  13.     destinationType: Camera.DestinationType.FILE_URI });  
  14.       
  15. function onSuccess(imageURI) {  
  16.  var image = document.getElementById('myImage');  
  17.  image.src = imageURI;  
  18. }  
  19.    
  20. function onFail(message) {  
  21.  alert('Failed because: ' + message);  
  22. } 

完整的范例：

  1. <!DOCTYPE html>    
  2. <html>    
  3. <head>    
  4. <title>Capture Photo</title>    
  5.     
  6. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script>    
  7. <script type="text/javascript" charset="utf-8">    
  8.     
  9.     var pictureSource;      //圖片來源    
  10.     var destinationType;        //設(shè)置返回值的格式    
  11.         
  12.     // 等待PhoneGap連接設(shè)備    
  13.     document.addEventListener("deviceready",onDeviceReady,false);    
  14.         
  15.     // PhoneGap準備就緒，可以使用！    
  16.     function onDeviceReady() {    
  17.         pictureSource=navigator.camera.PictureSourceType;    
  18.         destinationType=navigator.camera.DestinationType;    
  19.     }    
  20.         
  21.     // 當成功獲得一張照片的Base64編碼數(shù)據(jù)后被調(diào)用    
  22.     function onPhotoDataSuccess(imageData) {    
  23.         
  24.         // 取消注釋以查看Base64編碼的圖像數(shù)據(jù)    
  25.         // console.log(imageData);    
  26.         // 獲取圖像句柄    
  27.         var smallImage = document.getElementById('smallImage');    
  28.                  
  29.         // 取消隱藏的圖像元素    
  30.         smallImage.style.display = 'block';    
  31.             
  32.         // 顯示拍攝的照片    
  33.         // 使用內(nèi)嵌CSS規(guī)則來縮放圖片    
  34.         smallImage.src = "data:image/jpeg;base64," + imageData;    
  35.     }    
  36.            
  37.    // 當成功得到一張照片的URI后被調(diào)用    
  38.    function onPhotoURISuccess(imageURI) {    
  39.         
  40.         // 取消注釋以查看圖片文件的URI    
  41.         // console.log(imageURI);    
  42.         // 獲取圖片句柄    
  43.         var largeImage = document.getElementById('largeImage');    
  44.              
  45.         // 取消隱藏的圖像元素    
  46.         largeImage.style.display = 'block';    
  47.         
  48.         // 顯示拍攝的照片    
  49.         // 使用內(nèi)嵌CSS規(guī)則來縮放圖片    
  50.         largeImage.src = imageURI;    
  51.     }    
  52.            
  53.    // “Capture Photo”按鈕點擊事件觸發(fā)函數(shù)    
  54.    function capturePhoto() {    
  55.     
  56.         // 使用設(shè)備上的攝像頭拍照，并獲得Base64編碼字符串格式的圖像    
  57.         navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });    
  58.    }    
  59.        
  60.    // “Capture Editable Photo”按鈕點擊事件觸發(fā)函數(shù)    
  61.    function capturePhotoEdit() {    
  62.     
  63.         // 使用設(shè)備上的攝像頭拍照，并獲得Base64編碼字符串格式的可編輯圖像    
  64.         navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });    
  65.    }    
  66.            
  67.    //“From Photo Library”/“From Photo Album”按鈕點擊事件觸發(fā)函數(shù)    
  68.    function getPhoto(source) {    
  69.        
  70.         // 從設(shè)定的來源處獲取圖像文件URI    
  71.         navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,    
  72.         destinationType: destinationType.FILE_URI,sourceType: source });    
  73.    }    
  74.     
  75.    // 當有錯誤發(fā)生時觸發(fā)此函數(shù)    
  76.    function onFail(mesage) {    
  77.         alert('Failed because: ' + message);    
  78.    }    
  79.         
  80. </script>    
  81.     
  82. </head>    
  83. <body>    
  84.     <button onclick="capturePhoto();">Capture Photo</button> <br>    
  85.     <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br>    
  86.     <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>    
  87.     <button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>    
  88.     <img style="display:none;width:60px;height:60px;" id="smallImage" src="" />    
  89.     <img style="display:none;" id="largeImage" src="" />    
  90.     </body>    
  91. </html>    
  92. <!DOCTYPE html> 
  93. <html> 
  94. <head> 
  95. <title>Capture Photo</title> 
  96.  
  97. <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
  98. <script type="text/javascript" charset="utf-8"> 
  99.  
  100.  var pictureSource;  //圖片來源  
  101.  var destinationType;  //設(shè)置返回值的格式  
  102.    
  103.  // 等待PhoneGap連接設(shè)備  
  104.  document.addEventListener("deviceready",onDeviceReady,false);  
  105.    
  106.  // PhoneGap準備就緒，可以使用！  
  107.  function onDeviceReady() {  
  108.   pictureSource=navigator.camera.PictureSourceType;  
  109.   destinationType=navigator.camera.DestinationType;  
  110.  }  
  111.    
  112.  // 當成功獲得一張照片的Base64編碼數(shù)據(jù)后被調(diào)用  
  113.  function onPhotoDataSuccess(imageData) {  
  114.    
  115.   // 取消注釋以查看Base64編碼的圖像數(shù)據(jù)  
  116.   // console.log(imageData);  
  117.   // 獲取圖像句柄  
  118.   var smallImage = document.getElementById('smallImage');  
  119.       
  120.   // 取消隱藏的圖像元素  
  121.   smallImage.style.display = 'block';  
  122.     
  123.   // 顯示拍攝的照片  
  124.   // 使用內(nèi)嵌CSS規(guī)則來縮放圖片  
  125.   smallImage.src = "data:image/jpeg;base64," + imageData;  
  126.  }  
  127.       
  128.    // 當成功得到一張照片的URI后被調(diào)用  
  129.    function onPhotoURISuccess(imageURI) {  
  130.    
  131.   // 取消注釋以查看圖片文件的URI  
  132.   // console.log(imageURI);  
  133.   // 獲取圖片句柄  
  134.   var largeImage = document.getElementById('largeImage');  
  135.      
  136.   // 取消隱藏的圖像元素  
  137.   largeImage.style.display = 'block';  
  138.    
  139.   // 顯示拍攝的照片  
  140.   // 使用內(nèi)嵌CSS規(guī)則來縮放圖片  
  141.   largeImage.src = imageURI;  
  142.  }  
  143.       
  144.    // “Capture Photo”按鈕點擊事件觸發(fā)函數(shù)  
  145.    function capturePhoto() {  
  146.  
  147.   // 使用設(shè)備上的攝像頭拍照，并獲得Base64編碼字符串格式的圖像  
  148.   navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });  
  149.    }  
  150.      
  151.    // “Capture Editable Photo”按鈕點擊事件觸發(fā)函數(shù)  
  152.    function capturePhotoEdit() {  
  153.  
  154.   // 使用設(shè)備上的攝像頭拍照，并獲得Base64編碼字符串格式的可編輯圖像  
  155.   navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true });  
  156.    }  
  157.       
  158.    //“From Photo Library”/“From Photo Album”按鈕點擊事件觸發(fā)函數(shù)  
  159.    function getPhoto(source) {  
  160.      
  161.      // 從設(shè)定的來源處獲取圖像文件URI  
  162.   navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,  
  163.   destinationType: destinationType.FILE_URI,sourceType: source });  
  164.    }  
  165.  
  166.    // 當有錯誤發(fā)生時觸發(fā)此函數(shù)  
  167.    function onFail(mesage) {  
  168.   alert('Failed because: ' + message);  
  169.    }  
  170.    
  171. </script> 
  172.  
  173. </head> 
  174. <body> 
  175.  <button onclick="capturePhoto();">Capture Photo</button> <br> 
  176.  <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br> 
  177.  <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br> 
  178.  <button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br> 
  179.  <img style="display:none;width:60px;height:60px;" id="smallImage" src="" /> 
  180.  <img style="display:none;" id="largeImage" src="" /> 
  181.  </body> 
  182. </html> 

cameraSuccess 
 
提供圖像數(shù)據(jù)的onSuccess回調(diào)函數(shù)

  1. function(imageData) {    
  2.    // 對圖像進行處理    
  3. }    
  4. function(imageData) {  
  5.    // 對圖像進行處理  
  6. } 

PhoneGap API參數(shù)：

imageData：根據(jù)cameraOptions的設(shè)定值，為Base64編碼的圖像數(shù)據(jù)或圖像文件的URI。（字符串類型）

PhoneGap API范例：

  1. // 顯示圖片    
  2. function cameraCallback(imageData) {    
  3.     var image = document.getElementById('myImage');    
  4.     image.src = "data:image/jpeg;base64," + imageData;    
  5. }    
  6. // 顯示圖片  
  7. function cameraCallback(imageData) {  
  8.  var image = document.getElementById('myImage');  
  9.  image.src = "data:image/jpeg;base64," + imageData;  
  10. } 

cameraError

提供錯誤信息的onError回調(diào)函數(shù)。

  1. function(message) {    
  2.    // 顯示有用信息    
  3. }    
  4. function(message) {  
  5.    // 顯示有用信息  
  6. } 

PhoneGap API參數(shù)：

message：設(shè)備本地代碼提供的錯誤信息。（字符串類型）

cameraOptions 
 
定制攝像頭設(shè)置的可選參數(shù)。

  1. {   quality : 75,    
  2.     destinationType : Camera.DestinationType.DATA_URL,    
  3.     sourceType : Camera.PictureSourceType.CAMERA,    
  4.     allowEdit : true,    
  5.     encodingType : Camera.EncodingType.JPEG,    
  6.     targetWidth : 100,    
  7.     targetHeight : 100};    
  8. { quality : 75,  
  9.  destinationType : Camera.DestinationType.DATA_URL,  
  10.  sourceType : Camera.PictureSourceType.CAMERA,  
  11.  allowEdit : true,  
  12.  encodingType : Camera.EncodingType.JPEG,  
  13.  targetWidth : 100,  
  14.  targetHeight : 100  
  15. }; 

PhoneGap API選項：

quality：存儲圖像的質(zhì)量，范圍是[0,100]。（數(shù)字類型）

destinationType：選擇返回數(shù)據(jù)的格式。通過navigator.camera.DestinationType進行定義。（數(shù)字類型）

  1. Camera.DestinationType = {   
  2.  
  3.     DATA_URL : 0,   //返回Base64編碼字符串的圖像數(shù)據(jù)    
  4.     FILE_URI : 1    //返回圖像文件的URI    
  5. }    
  6. Camera.DestinationType = {  
  7.  DATA_URL : 0, //返回Base64編碼字符串的圖像數(shù)據(jù)  
  8.  FILE_URI : 1 //返回圖像文件的URI  
  9. } 

sourceType：設(shè)定圖片來源。通過nagivator.camera.PictureSourceType進行定義。（數(shù)字類型）

  1. Camera.PictureSourceType = {    
  2.     PHOTOLIBRARY : 0,    
  3.     CAMERA : 1,    
  4.     SAVEDPHOTOALBUM : 2    
  5. }    
  6. Camera.PictureSourceType = {  
  7.  PHOTOLIBRARY : 0,  
  8.  CAMERA : 1,  
  9.  SAVEDPHOTOALBUM : 2  
  10. } 

allowEdit：在選擇圖片進行操作之前允許對其進行簡單編輯。（布爾類型）

EncodingType：選擇返回圖像文件的編碼方式，通過navigator.camera.EncodingType進行定義。（數(shù)字類型）

  1. Camera.EncodingType = {    
  2.     JPEG : 0,       // 返回JPEG格式圖片    
  3.     PNG : 1         // 返回PNG格式圖片    
  4. };    
  5. Camera.EncodingType = {  
  6.  JPEG : 0,  // 返回JPEG格式圖片  
  7.  PNG : 1   // 返回PNG格式圖片  
  8. }; 

targetWidth：以像素為單位的圖像縮放寬度，必須和targetHeight同時使用。相應(yīng)的寬高比保持不變。（數(shù)字類型）

targetHeight：以像素為單位的圖像縮放高度，必須和targetWidth同時使用。相應(yīng)的寬高比保持不變。（數(shù)字類型）

Android的特異情況：

忽略allowEdit參數(shù)。

Camera.PictureSourceType.PHOTOLIBRARY 或 Camera.PictureSourceType.SAVEDPHOTOALBUM 都會顯示同一個相集。

Camera.EncodingType不被支持。

BlackBerry的特異情況：

忽略quality參數(shù)。

忽略sourceType參數(shù)。

忽略allowEdit參數(shù)。

當拍照結(jié)束后，應(yīng)用程序必須有按鍵注入權(quán)限才能關(guān)閉本地Camera應(yīng)用程序。

使用大圖像尺寸，可能會導致新近帶有高分辨率攝像頭的型號設(shè)備無法對圖像進行編碼（如：Torch 9800）。

Palm的特異情況：

忽略quality參數(shù)。

忽略sourceType參數(shù)。

忽略allowEdit參數(shù)。

iPhone的特異情況：

為了避免部分設(shè)備上出現(xiàn)內(nèi)存錯誤，quality的設(shè)定值要低于50。

當使用destinationType.FILE_URI時，使用攝像頭拍攝的和編輯過的照片會存儲到應(yīng)用程序的Documents/tmp目錄。

應(yīng)用程序結(jié)束的時候，應(yīng)用程序的Documents/tmp目錄會被刪除。如果存儲空間大小非常關(guān)鍵的時候，開發(fā)者也可以通過navigator.fileMgr的接口來刪除該目錄。

小結(jié)：PhoneGap API幫助文檔翻譯Camera攝像頭的內(nèi)容介紹完了，希望通過PhoneGap API文檔內(nèi)容的學習能對你有所幫助！如果想要繼續(xù)深入了解并學習PhoneGap API文檔的內(nèi)容，請參考編輯推薦。

責任編輯：zhaolei 來源： 互聯(lián)網(wǎng)
PhoneGap API
相關(guān)推薦

2011-09-13 13:47:56

PhoneGap AP

2011-09-13 14:40:16

PhoneGap AP

2011-09-13 16:08:58

PhoneGap AP

2011-09-13 10:17:26

PhoneGap AP

2011-09-13 11:06:08

PhoneGap AP

2011-09-13 10:40:25

PhoneGap AP

2011-09-13 14:07:45

PhoneGap AP

2011-09-13 16:24:11

PhoneGap AP

2011-12-19 16:09:32

PhoneGap APCamera

2011-09-13 13:17:27

PhoneGap AP

2011-12-30 14:13:05

PhoneGap APCamera視頻

2013-11-20 11:24:05

AndroidAPI

2013-03-21 09:56:09

2021-03-11 10:21:55

特斯拉黑客網(wǎng)絡(luò)攻擊

2024-11-29 16:51:18

2017-06-20 11:45:52

2011-04-25 09:16:10

Windows 8

2012-06-23 20:13:44

HTML5

2022-06-28 14:30:29

camera組件照片回傳

2011-10-11 09:50:44

PhoneGap常見問題
點贊
收藏

51CTO技術(shù)棧公眾號