使用javascript的iPhone手機差距應用程序

在我的iPhone phonegap應用程序中，我想使用設備的攝像頭捕獲圖像。我已經完成了以下代碼，但它不起作用。無法捕獲圖像。在下面的HTML代碼部分，我有一個按鈕，當它點擊時，我會調用java腳本定義的方法。使用javascript的iPhone手機差距應用程序

<script type="text/javascript" charset="utf-8" src="phonegap.0.9.4.js"></script> 
    <script type="text/javascript" charset="utf-8"> 

     var pictureSource; // picture source 
     var destinationType; // sets the format of returned value 

     // Wait for PhoneGap to connect with the device 
     function onLoad() { 
      document.addEventListener("deviceready",onDeviceReady,false); 
     } 

     // PhoneGap is ready to be used! 
     function onDeviceReady() { 
      pictureSource=navigator.camera.PictureSourceType; 
      destinationType=navigator.camera.DestinationType; 
     } 

     // Called when a photo is successfully retrieved (taken with camera) 
     function onPhotoDataSuccess(imageData) { 
      alert("Your photo was taken successfully.");    
     } 

     // Called when a photo is successfully retrieved (out of the device's library) 
     function onPhotoURISuccess(imageURI) { 

      // Get image handle 
      var largeImage = document.getElementById('largeImage'); 

      // Unhide image elements 
      largeImage.style.display = 'block'; 

      // Show the captured photo 
      // The inline CSS rules are used to resize the image 
      largeImage.src = imageURI; 

      var options = new FileUploadOptions(); 
      options.fileKey="file"; 
      //options.fileName="newfile.txt"; 
      options.mimeType="image/jpeg"; 

      var params = new Object(); 
      params.value1 = "test"; 
      params.value2 = "param"; 

      options.params = params; 

      var ft = new FileTransfer(); 
      ft.upload(imageURI, "http://www.yourdomain.com/upload.php", win, fail, options); 
      // Make sure you use your own site! 

     } 

     // Success reporting 
     function win(r) { 
      alert("Code = " + r.responseCode); 
      alert("Response = " + r.response); 
     } 

     // Error reporting 
     function fail(message) { 
      alert('Failed because: ' + message); 
     } 

     function capturePhoto() { 

      // Take picture using device camera and retrieve image as base64-encoded string 
      navigator.camera.getPicture(onPhotoDataSuccess, fail, { quality: 30 }); 
     } 

     function getPhoto(source) { 
      // Retrieve image file location from specified source 
      navigator.camera.getPicture(onPhotoURISuccess, fail, { 
             quality: 30, 
             destinationType: destinationType.FILE_URI, 
             sourceType: source 
             }); 
     } 

     </script> 
</head> 

<body onload="onLoad()"> 

    <button onclick="capturePhoto();">Take a Photo</button> 
    <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">Upload a Photo</button> 
    <img style="display:none;width:60px;height:60px;" id="smallImage" src="" /> 
    <img style="display:none;" id="largeImage" src="" /> 

</body>

來源

2011-11-10 M007

請你嘗試用下面的代碼片段。
它從相機捕獲圖像，並加載在img標籤。我在設備上測試過。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
    <head> 
    <!-- Change this if you want to allow scaling --> 
    <meta name="viewport" content="width=default-width; user-scalable=no" /> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
    <title>PGCamera</title> 
    <script type="text/javascript" charset="utf-8" src="phonegap.js"></script> 
    <script type="text/javascript" charset="utf-8"> 
    function onBodyLoad() 
    { 
     document.addEventListener("deviceready",onDeviceReady,false); 
    } 
    /* When this function is called, PhoneGap has been initialized and is ready to roll */ 
    function onDeviceReady() 
    { 
     // do your thing! 
    } 
    function PictureSourceType() {}; 
    PictureSourceType.PHOTO_LIBRARY = 0; 
    PictureSourceType.CAMERA = 1; 
    function getPicture(sourceType){ 
    var options = { quality: 10 }; 
    if (sourceType != undefined) { 
      options["sourceType"] = sourceType; 
    } 
    // if no sourceType specified, the default is CAMERA 
    navigator.camera.getPicture(getPicture_Success, null, options); 
    }; 
    function getPicture_Success(imageData){ 
     alert("getpic success"); 
     document.getElementById("test_img").src = "data:image/jpeg;base64," + imageData; 
    } 
    </script> 
</head> 
<body onload="onBodyLoad()">  
    <img style="width:60px;height:60px" id="test_img" src="" /> 
    <!-- for testing, add the buttons below --> 
    <button onclick="getPicture()">From Camera</button> 
    <button onclick="getPicture(PictureSourceType.PHOTO_LIBRARY)">From Photo Library</button> 
    </body> 
</html>

感謝， MAYUR

來源

2011-11-10 12:57:58

使用javascript的iPhone手機差距應用程序

回答

相關問題