I am developing an App in Android for camera application. I add the camera using cordova plugin
config.xml
<feature name="Camera">
<param name="android-package" value="org.apache.cordova.camera.CameraLauncher" />
</feature>
code for taking Picture
function snapPicture () {
navigator.camera.getPicture (onSuccess, onFail,
{ quality: 100,
sourceType: navigator.camera.PictureSourceType.CAMERA,
mediaType: navigator.camera.MediaType.PICTURE,
destinationType: destinationType.FILE_URI,
encodingType: navigator.camera.EncodingType.JPEG,
correctOrientation: false,
saveToPhotoAlbum: true
});
//A callback function when snapping picture is success.
function onSuccess (imageData) {
var image = document.getElementById ('picture');
alert("path : "+imageData);
image.src = imageData;
}
//A callback function when snapping picture is fail.
function onFail (message) {
alert ('Error occured: ' + message);
}
}
The code is working fine in all Android version expect Android Kitkat. In Kitkat am getting the response as "Error capturing image"
can any tell me what is the issue in Kitkat
Thanks in Advance ...!
You made a mistake inside your code. destinationType: destinationType.FILE_URI, will not work. Change that line to destinationType: Camera.DestinationType.FILE_URI, instead and it'll run. Here's your full working code:
function snapPicture() {
navigator.camera.getPicture(onSuccess, onFail, { quality: 100,
sourceType: navigator.camera.PictureSourceType.CAMERA,
mediaType: navigator.camera.MediaType.PICTURE,
destinationType: Camera.DestinationType.FILE_URI,
encodingType: navigator.camera.EncodingType.JPEG,
correctOrientation: false,
saveToPhotoAlbum: true
})
//A callback function when snapping picture is success.
function onSuccess (imageData) {
var image = document.getElementById ('picture');
alert("path : "+imageData);
image.src = imageData;
}
//A callback function when snapping picture is fail.
function onFail (message) {
alert ('Error occured: ' + message);
}
}
I recommend you to use GapDebug to Debug your Applications.
Related
I am working on ionic v1 Camera app after setting up everything correctly (as done many times before). after building app and debugging it i got this error.
Plugin installed correctly,
ng-cordova.min included.
$CordovaCamera injected.
Here is my Code:
$scope.takePhoto = function () {
var options = {
quality: 100,
destinationType: Camera.DestinationType.DATA_URL,
sourceType: Camera.PictureSourceType.CAMERA,
allowEdit: true,
encodingType: Camera.EncodingType.JPEG,
targetWidth: 300,
targetHeight: 300,
popoverOptions: CameraPopoverOptions,
saveToPhotoAlbum: true
};
$cordovaCamera.getPicture(options).then(function (imageData) {
$rootScope.imgURI = "data:image/jpeg;base64," + imageData;
$state.go('menu.signUp');
}, function (err) {
// An error occured. Show a message to the user
});
}
functions are working fine. but camera is not opening and gives error
as seen in picture.
Try with injecting $cordovaCamera in contact controller and use it like this
camera.getPicture() //just camera instead of $cordovaCamera
Use camera.getPicture() or navigator.camera.getPicture()
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-camera/
Make sure $cordovaCamera dependency Injected then use it like this
$cordovaCamera.getPicture(options).then(function(imageData) {
var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + imageData;
}, function(err) {
// error
});
On setting correctOrientation : true, then image rotation issue is solved and thumbnail is set - But image path is: file://storage/emulated/0/Android/data/com.examole.helloworld/modified.jpg?149028394994
Without correctOrientation: true, image path is: file:///storage/emulated/0/DCIM/Camera/1490345556009.jpg
When trying to set another image with correctOrientation: true, then the latest selected image is not set.
Following is the code for your kind reference:
navigator.camera.getPicture(captureSuccess, onFail, {quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM,
mediaType: Camera.MediaType.PICTURE,
correctOrientation: true,
allowEdit: true
});
Thanks in Advance.
You can try this,
$(document).on('click','.capture_photo',function(){
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
quality : 75,
destinationType : Camera.DestinationType.DATA_URL,
sourceType : Camera.PictureSourceType.CAMERA,
encodingType: Camera.EncodingType.PNG,
popoverOptions: CameraPopoverOptions,
saveToPhotoAlbum: false
});
});
// to call the success function of capture image(onPhotoDataSuccess)
function onPhotoDataSuccess(imageData) {
sessionStorage.setItem("img_api",imageData);
$('#captureimg').attr('src','data:image/jpeg;base64,' + imageData);
App.show_toast("Profile image updated successfully!");
}
//onfail
onFail(message) { alert('Failed because: ' + message); }
I have solved this and posted my answer
navigator.camera.getPicture(captureSuccess, onFail, {quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM,
mediaType: Camera.MediaType.PICTURE,
correctOrientation: true,
});
var captureSuccess = function(mediaFiles) {
var fD = mediaFiles;
window.resolveLocalFileSystemURI(fD, function(fileEntry) {
fileEntry.file(function(fT) {
var fname = fileEntry.nativeURL.substr(fileEntry.nativeURL.lastIndexOf('/') + 1);
fileTransferUpload(fD,fname);
}, function() {
console.log('error');
});
}, onFError);
};
the method fileTransferUpload above will just set the image path in src.
in success callback function, image path is received and without getting nativeURL from this path, i have set the path itself in src.
Here's a better solution (involved a spot of digging through some Java files, but takes about 8 seconds)
in CameraLauncher.java (in the cordova-plugin-camera/src/android folder)
//Old:
String modifiedPath = getTempDirectoryPath() + "/modified"+".jpg";
this.callbackContext.success("file://" + modifiedPath + "?" + System.currentTimeMillis());
AKA just move the timestamp up in the filename.
//New:
String modifiedPath = getTempDirectoryPath() + "/modified"+ System.currentTimeMillis() +".jpg";
this.callbackContext.success("file://" + modifiedPath);
document.addEventListener("deviceready",onDeviceReady,false);
var pictureSource; // picture source
var destinationType; // sets the format of returned value
function onDeviceReady() {
pictureSource=navigator.camera.PictureSourceType;
destinationType=navigator.camera.DestinationType;
}
sorry, you want to add this code along with the that.
var onSuccess = function(imageUri){
$scope.report.imgUri = imageUri;
};
var onError = function(message){
alert('Failed because: ' + message);
};
$scope.capturePhoto = function(){
navigator.camera.getPicture(onSuccess, onError, {
quality: 40,
destinationType: navigator.camera.DestinationType.FILE_URI,
correctOrientation: true,
saveToPhotoAlbum: true,
encodingType: navigator.camera.EncodingType.PNG,
targetWidth: divWidth
});
};
I am building Cordova 3.5.0 on Samsung S3 with Android 4.3. The camera.capturePhoto function always ignore correctOrientation set, so the pic did not rotate to correct orientation. But it works fine on HTC Butterfly with Android 4.4. BTW, encodingType not work on android either. Any idea?
In some cases, setting navigator.camera.EncodingType.JPEG helped.
encodingType: Camera.EncodingType.JPEG,
mediaType: Camera.MediaType.PICTURE,
correctOrientation: true
In Android 4.4, using Camera API getPicture API will result in a enlarged dialog.
The code is below:
var sourceType = pictureSource.SAVEDPHOTOALBUM;
navigator.camera.getPicture(function(fileURI) {
// Success callback
}, function(message) {
// Fail callback
}, {quality: 50, destinationType: destinationType.FILE_URI, sourceType: sourceType, mediaType: mediaType, correctOrientation: false, saveToPhotoAlbum: true});
Change android:anyDensity property in the AndroidManifest.xml from false to true fix the problem
Trying to create a simple app that saves a photo to the phone's Photo Gallery. The photo doesn't appear to get saved to the Gallery, but I don't have any error messages. Using steroids as well.
Here's my application.js:
function cameraGetPicture() {
navigator.camera.getPicture(imageReceived, cameraFail, {
quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
allowEdit: false,
correctOrientation: true,
targetWidth: 600
});
}
function imageReceived(imageURI) {
var image = document.querySelector('img#myImage');
image.src = imageURI;
imageURI = new steroids.File({
path: "image.png",
relativeTo: steroids.app.userFilesPath
});
}
function cameraFail(message) {
alert("Camera error: " + message);
}
Just add following property to Object which you are passing to navigator.camera.getPicture()
saveToPhotoAlbum: true
Your code will look like:
navigator.camera.getPicture(imageReceived, cameraFail, {
quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
allowEdit: false,
correctOrientation: true,
targetWidth: 600,
saveToPhotoAlbum: true
});
This works for me in both android & iOS. Hopefully this will work for you.