Выбор нескольких фотографий из галереи изображений устройства с помощью PhoneGap - PullRequest
6 голосов
/ 06 сентября 2011

Мне удалось создать тестовое приложение на основе полного примера camera.getPicture в документации PhoneGap.Это позволяет мне сделать фотографию или получить фотографию из галереи и поместить ее в div.

Однако я хочу иметь возможность выбрать несколько изображений из галереи и поместить каждое в свой отдельный div.Кто-нибудь может указать мне правильное направление, чтобы узнать, как этого добиться?

Спасибо.

Вот JavaScript, который я использую:

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

// Wait for PhoneGap to connect with the device
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
function onPhotoDataSuccess(imageData) {
  var largeImage = document.getElementById('largeImage');
  largeImage.style.display = 'block';
  largeImage.src = "data:image/jpeg;base64," + imageData;
}


function onPhotoURISuccess(imageURI) {
  var largeImage = document.getElementById('largeImage');
  largeImage.style.display = 'block';
  largeImage.src = imageURI;
}

// A button will call this function
function capturePhoto() {
    //add new div

    var newPhoto = document.createElement("div");
    newPhoto.id = "div";        
    newPhoto.className ="photo";
    newPhoto.innerHTML = "<img id='largeImage' src='' />";
    document.getElementById("photos").appendChild(newPhoto);


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

// A button will call this function
function getPhoto(source) {
    //add new div



  // 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);

Ответы [ 2 ]

2 голосов
/ 20 декабря 2012

Начиная с Phonegap 3.5 отсутствует возможность выбора нескольких изображений одновременно. Вам нужно будет написать или найти плагин, который будет работать с нативным кодом, чтобы вы могли это сделать. Вот проблема, описанная в плане развития PhoneGap. https://issues.apache.org/jira/browse/CB-1215

Я тоже работаю над этим. Вот ссылка на решение для Android.

http://webcache.googleusercontent.com/search?q=cache:http://www.technotalkative.com/android-select-multiple-photos-from-gallery/

0 голосов
/ 31 марта 2012

вам нужно создавать div динамически после каждой фотографии. Ваш успешный обратный вызов будет примерно таким:

function onPhotoDataSuccess(imageData) {
    // the following is all one line.
    document.getElementById("photos").innerHTML+=
    "<div>\
         <img src=\"data:image/jpeg;base64,"+imageData+"\">\
     </div>";
}

тогда вы можете стилизовать все imgs через css используя что-то вроде этого

#photos > div {
    width: 100px;
    margin:10px;
    float:left;
}
...