Fotocamera

Fotocamera

Il camera oggetto fornisce l'accesso all'applicazione fotocamera di default del dispositivo.

Nota importante sulla privacy: Raccolta e utilizzo delle immagini dalla fotocamera del dispositivo solleva questioni di privacy importante. Politica sulla privacy dell'app dovrebbe discutere come app utilizza la telecamera e se le immagini registrate sono condivise con altre parti. Inoltre, se l'uso dell'app della fotocamera non è evidente nell'interfaccia utente, è necessario fornire un preavviso di just-in-time prima della tua app di accedere alla telecamera (se il sistema operativo del dispositivo non farlo già). Tale comunicazione deve fornire le informazioni stesse notate sopra, oltre ad ottenere l'autorizzazione (ad esempio, presentando scelte per OK e No grazie). Per ulteriori informazioni, vedere la guida sulla Privacy.

Metodi

La funzionalità di accesso

A partire dalla versione 3.0, Cordova implementa le API a livello di dispositivo come plugin. Utilizzare la CLI plugin comando, descritto in Command-Line Interface, aggiungere o rimuovere questa funzionalità per un progetto:

    $ cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
    $ cordova plugin rm org.apache.cordova.core.camera

Questi comandi si applicano a tutte le piattaforme mirate, ma modificano le impostazioni di configurazione specifiche della piattaforma descritte di seguito:

Alcune piattaforme possono supportare questa funzionalità senza richiedere alcuna configurazione speciale. Per una panoramica, vedere supporto della piattaforma.

camera.getPicture

Prende una foto utilizzando la fotocamera, o recupera una foto dalla galleria di immagini del dispositivo. L'immagine viene passata al metodo di callback successo come una codifica base64 String , o come l'URI per il file di immagine. Il metodo stesso restituisce un CameraPopoverHandle che può essere utilizzato per riposizionare il Muffin di selezione file.

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

Descrizione

il camera.getPicture funzione apre predefinito fotocamera applicazione il dispositivo che consente agli utenti di scattare foto. Questo comportamento si verifica per impostazione predefinita, quando Camera.sourceType è uguale a Camera.PictureSourceType.CAMERA . Una volta che l'utente scatta la foto, si chiude l'applicazione fotocamera e l'applicazione viene ripristinato.

Se Camera.sourceType è Camera.PictureSourceType.PHOTOLIBRARY o Camera.PictureSourceType.SAVEDPHOTOALBUM , quindi un display finestra di dialogo che consente agli utenti di selezionare un'immagine esistente. La camera.getPicture la funzione restituisce un CameraPopoverHandle oggetto, che può essere utilizzato per riposizionare la finestra di selezione immagine, ad esempio, quando l'orientamento del dispositivo.

Il valore restituito viene inviato alla cameraSuccess funzione di callback, in uno dei seguenti formati, a seconda che l'oggetto specificato cameraOptions :

Si può fare quello che vuoi con l'immagine codificata o URI, ad esempio:

Nota: Risoluzione foto sui più recenti dispositivi è abbastanza buona. Foto selezionate dalla galleria del dispositivo non è percepiranno di qualità inferiore, anche se un quality è specificato il parametro. Per evitare problemi di memoria comune, impostare Camera.destinationType a FILE_URI piuttosto cheDATA_URL.

Piattaforme supportate

Stranezze Android

Android utilizza intenti a lanciare l'attività della fotocamera sul dispositivo per catturare immagini e sui telefoni con poca memoria, l'attività di Cordova può essere ucciso. In questo scenario, l'immagine potrebbe non apparire quando viene ripristinata l'attività di cordova.

iOS stranezze

Compreso un JavaScript alert() in entrambi il callback funzioni possono causare problemi. Avvolgere l'avviso all'interno di un setTimeout() per consentire la selezione immagine iOS o muffin per chiudere completamente la prima che viene visualizzato l'avviso:

setTimeout(function() {/ / fai la tua cosa qui!}, 0);

Windows Phone 7 capricci

Richiamando l'applicazione nativa fotocamera mentre il dispositivo è collegato tramite Zune non funziona e innesca un callback di errore.

Tizen stranezze

Tizen supporta solo un destinationType di Camera.DestinationType.FILE_URI e un sourceType diCamera.PictureSourceType.PHOTOLIBRARY.

Esempio rapido

Scattare una foto e recuperarla come un'immagine con codifica base64:

navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
    destinationType: Camera.DestinationType.DATA_URL
});

function onSuccess(imageData) {
    var image = document.getElementById('myImage');
    image.src = "data:image/jpeg;base64," + imageData;
}

function onFail(message) {
    alert('Failed because: ' + message);
}

Scattare una foto e recuperare il percorso del file dell'immagine:

navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
    destinationType: Camera.DestinationType.FILE_URI });

function onSuccess(imageURI) {
    var image = document.getElementById('myImage');
    image.src = imageURI;
}

function onFail(message) {
    alert('Failed because: ' + message);
}

Esempio completo

<!DOCTYPE html>
<html>
  <head>
    <title>Capture Photo</title>

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

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

    // Wait for device API libraries to load
    //
    document.addEventListener("deviceready",onDeviceReady,false);

    // device APIs are available
    //
    function onDeviceReady() {
        pictureSource=navigator.camera.PictureSourceType;
        destinationType=navigator.camera.DestinationType;
    }

    // Called when a photo is successfully retrieved
    //
    function onPhotoDataSuccess(imageData) {
      // Uncomment to view the base64-encoded image data
      // console.log(imageData);

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

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

      // Show the captured photo
      // The inline CSS rules are used to resize the image
      //
      smallImage.src = "data:image/jpeg;base64," + imageData;
    }

    // Called when a photo is successfully retrieved
    //
    function onPhotoURISuccess(imageURI) {
      // Uncomment to view the image file URI
      // console.log(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;
    }

    // A button will call this function
    //
    function capturePhoto() {
      // Take picture using device camera and retrieve image as base64-encoded string
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
        destinationType: destinationType.DATA_URL });
    }

    // A button will call this function
    //
    function capturePhotoEdit() {
      // Take picture using device camera, allow edit, and retrieve image as base64-encoded string
      navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 20, allowEdit: true,
        destinationType: destinationType.DATA_URL });
    }

    // A button will call this function
    //
    function getPhoto(source) {
      // Retrieve image file location from specified source
      navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
        destinationType: destinationType.FILE_URI,
        sourceType: source });
    }

    // Called if something bad happens.
    //
    function onFail(message) {
      alert('Failed because: ' + message);
    }

    </script>
  </head>
  <body>
    <button onclick="capturePhoto();">Capture Photo</button> <br>
    <button onclick="capturePhotoEdit();">Capture Editable Photo</button> <br>
    <button onclick="getPhoto(pictureSource.PHOTOLIBRARY);">From Photo Library</button><br>
    <button onclick="getPhoto(pictureSource.SAVEDPHOTOALBUM);">From Photo Album</button><br>
    <img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
    <img style="display:none;" id="largeImage" src="" />
  </body>
</html>

cameraSuccess

funzione di callback onSuccess che fornisce i dati di immagine.

function(imageData) {
    // Do something with the image
}

Parametri

Esempio

// Show image
//
function cameraCallback(imageData) {
    var image = document.getElementById('myImage');
    image.src = "data:image/jpeg;base64," + imageData;
}

cameraError

funzione di callback onError che fornisce un messaggio di errore.

function(message) {
    // Show a helpful message
}

Parametri

cameraOptions

Parametri opzionali per personalizzare le impostazioni della fotocamera.

{qualità: 75, destinationType: Camera.DestinationType.DATA_URL, sourceType: Camera.PictureSourceType.CAMERA, allowEdit: vero, encodingType: Camera.EncodingType.JPEG, targetWidth: 100, targetHeight: 100, popoverOptions: CameraPopoverOptions, saveToPhotoAlbum: false};

Opzioni

Stranezze Android

Stranezze di blackBerry

iOS stranezze

Tizen stranezze

Windows Phone 7 e 8 stranezze

CameraPopoverOptions

iOS solo parametri che specificano l'ancoraggio elemento posizione e freccia direzione il Muffin quando si selezionano le immagini dalla libreria un iPad o un album.

{x: 0, y: 32, larghezza: 320, altezza: 480, arrowDir: Camera.PopoverArrowDirection.ARROW_ANY};

CameraPopoverOptions

Si noti che la dimensione del muffin possa cambiare per regolare la direzione della freccia e l'orientamento dello schermo. Assicurarsi che tenere conto di modifiche di orientamento quando si specifica la posizione di elemento di ancoraggio.

Esempio rapido

 var popover = new CameraPopoverOptions(300, 300, 100, 100, Camera.PopoverArrowDirection.ARROW_ANY);
 var options = {
     quality         : 50,
     destinationType : Camera.DestinationType.DATA_URL,
     sourceType      : Camera.PictureSource.SAVEDPHOTOALBUM,
     popoverOptions  : popover
 };

 navigator.camera.getPicture(onSuccess, onFail, options);

 function onSuccess(imageData) {
     var image = document.getElementById('myImage');
     image.src = "data:image/jpeg;base64," + imageData;
 }

 function onFail(message) {
     alert('Failed because: ' + message);
 }

CameraPopoverHandle

Un handle per la finestra di dialogo di muffin creato dacamera.getPicture.

Metodi

Piattaforme supportate

setPosition

Impostare la posizione dei muffin.

Parametri:

Esempio rapido

 var cameraPopoverOptions = new CameraPopoverOptions(300, 300, 100, 100, Camera.PopoverArrowDirection.ARROW_ANY);
 cameraPopoverHandle.setPosition(cameraPopoverOptions);

Esempio completo

 function onSuccess(imageData) {
      // Do stuff with the image!
 }

 function onFail(message) {
     alert('Failed to get the picture: ' + message);
 }

 var cameraPopoverHandle = navigator.camera.getPicture(onSuccess, onFail,
     { destinationType: Camera.DestinationType.FILE_URI,
       sourceType: Camera.PictureSourceType.PHOTOLIBRARY });

 // Reposition the popover if the orientation changes.
 window.onorientationchange = function() {
     var cameraPopoverOptions = new CameraPopoverOptions(0, 0, 100, 100, 0);
     cameraPopoverHandle.setPosition(cameraPopoverOptions);
 }