Kann mir jemand sagen, oder zeigt mir, wie man ein Bild aus der Bildergalerie des Telefons in Phonegap/Android erhält? Es gibt Dokumente, wenn Sie auf die Kamera zugreifen (was sehr gut funktioniert), aber kein vorhandenes Bild auswählen.
Ich suche eher nach Phonegap/Javascript als nach Java.
Danke im Voraus!
Äh, die Camera
-Dokumente behandeln dies. Funktioniert das nicht für Sie? Check out Camera.PictureSourceType
für Details. Die docs-Site gibt dieses Beispiel für das Ableiten eines Bildes an:
function getPhoto(source) {
// Retrieve image file location from specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
sourceType: source });
}
sourceType
ist hier das entscheidende. Es kann Camera.PictureSourceType.CAMERA
(Standardeinstellung) sein, oder sinnvoller kann es Camera.PictureSourceType.PHOTOLIBRARY
oder Camera.PictureSourceType.SAVEDPHOTOALBUM
sein.
Sie können auch folgende Bibliothek verwenden: https://github.com/wymsee/cordova-imagePicker Ich bevorzuge dieses, da es kleiner ist, leicht zu implementieren ist und keine Kameraerlaubnis erfordert.
Werfen Sie einen Blick auf diese Post , es kann Ihnen helfen.
Manchmal können beim Hochladen eines vorhandenen Bildes Probleme auftreten. Die Lösung ist einfach, per diese Antwort . In Kürze müssen Sie die native Android-URI in eine URL konvertieren, die von der API verwendet werden kann:
// URL you are trying to upload from inside gallery
window.resolveLocalFileSystemURI(img.URI, function(entry) {
console.log(entry.fullPath);
}, function(evt){
console.log(evt.code);
}
);
document.addEventListener("deviceready",function(){
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem){
var sdcard = fileSystem.root;
sdcard.getDirectory('dcim/camera',{create:false}, function(dcim){
var directoryReader = dcim.createReader();
directoryReader.readEntries(function(entries){
for (var i=0; i<entries.length; i++) {
entries[i].file(function(f){
var reader = new FileReader();
reader.onloadend = function (evt) {
var url= evt.target.result;//base64 data uri
console.log(url)
reader.abort();
};
reader.readAsDataURL(f);
},function(error){
console("Unable to retrieve file properties: " + error.code);
});
}
},function(e){
console.log(e.code);
});
}, function(error){
console.log(error.code);
});
}, function(evt){ // error get file system
console.log(evt.target.error.code);
});
} , true);
Ich arbeite gerade an cordova-plugin-photo-library plugin, das plattformübergreifend die Möglichkeit bietet, alle Fotos auf dem Gerät aufzuzählen.
Verwendungszweck:
cordova.plugins.photoLibrary.getLibrary(function (library) {
// Here we have the library as array
cordova.plugins.photoLibrary.getThumbnailUrl(library[0],
function (thumbnailUrl) { image.src = thumbnailUrl; },
function (err) { console.log('Error occured'); },
{
thumbnailWidth: 512,
thumbnailHeight: 384,
quality: 0.8
});
});
Einfach
Zuerst Fügen Sie dem Projekt in CMD ein Kamera-Plugin hinzu.
F:\phonegap>myapp>cordova plugin add cordova-plugin-camera
Und dann probiere es aus
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'" />
<title>PhoneGap app</title>
<!-- Script -->
<script type="text/javascript" src="cordova.js" ></script>
<script type='text/javascript' src='jquery-3.0.0.js' ></script>
<script type='text/javascript'>
$(document).ready(function(){
// Take photo from camera
$('#but_take').click(function(){
navigator.camera.getPicture(onSuccess, onFail, { quality: 20,
destinationType: Camera.DestinationType.FILE_URL
});
});
// Select from gallery
$("#but_select").click(function(){
navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
allowEdit: true,
destinationType: Camera.DestinationType.FILE_URI
});
});
// Change image source
function onSuccess(imageData) {
var image = document.getElementById('img');
image.src = imageData + '?' + Math.random();;
}
function onFail(message) {
alert('Failed because: ' + message);
}
});
</script>
</head>
<body>
<div style="margin:0 auto; width:30%!important;text-align: center;">
<img src="img/cam2.jpg" id='img' style="width: 100px; height: 100px;">
</div><br/>
<div style="width:100%; text-align:center; padding:10px;">
<button id='but_take'>Take photo</button>
<button id='but_select'>Select photo from Gallery</button>
</div>
</body>
</html>
Ich bin zu 100% sicher, dass es funktioniert.
die Referenz ist hier Wählen Sie ein Bild aus der Kamera oder Galerie aus - PhoneGap