Chọn Nhiều ảnh từ thư viện hình ảnh của thiết bị bằng PhoneGap

Question

Tôi đã có thể xây dựng một ứng dụng thử nghiệm dựa trên ví dụ đầy đủ về camera.getPicture trong tài liệu của PhoneGap. Nó cho phép tôi chụp ảnh hoặc lấy một bức ảnh từ thư viện và đặt nó trong một div.

Tuy nhiên, tôi muốn có thể chọn nhiều hình ảnh từ thư viện và đặt mỗi hình ảnh vào div riêng của nó. Bất cứ ai có thể chỉ cho tôi đi đúng hướng để tìm hiểu làm thế nào để thực hiện điều này?

Cảm ơn.

Đây là javascript Tôi đang sử dụng:

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

Answer 1

bạn cần để tạo ra các div động sau mỗi bức ảnh được chụp. callback Thành công của bạn sẽ là một cái gì đó như thế này:

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

sau đó bạn có thể tạo kiểu tất cả các imgs qua css sử dụng một cái gì đó như thế này

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

Answer 2

Tính đến PhoneGap 3.5 không có sự hỗ trợ cho việc lựa chọn nhiều hình ảnh cùng cùng lúc. Bạn sẽ cần viết hoặc tìm một plugin sẽ hoạt động với mã gốc để cho phép bạn thực hiện việc này. Đây là vấn đề được mô tả trong kế hoạch phát triển Phonegap. https://issues.apache.org/jira/browse/CB-1215

Tôi cũng đang làm việc này. Đây là một liên kết cho một giải pháp Android.

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