Захват и сохранение снимка, сделанного с помощью камеры, в локальную базу данных/PhoneGap/Cordova/iOS
В настоящее время я создаю приложение для iOS, используя Phonegap/Cordova и jQuerymobile. Идея состоит в том, чтобы сфотографировать камеру и сохранить захваченное изображение для будущего использования. Я хотел бы сохранить путь/имя файла в моей локальной базе данных и переместить файл изображения в постоянное место на iPhone.
Может ли кто-нибудь предоставить мне пример?
Ответы
Ответ 1
Хорошо, вот решение.
-
в файле Html
-
У меня есть тег изображения для отображения снимка, сделанного камерой:
-
У меня есть кнопка, которая выполняет функцию для съемки:
Capture Photo
-
Функция для захвата фотографии (когда фотография сделана, scr на значке 'smallImage' заполняется дорожкой фотографии)
function capturePhoto() {
// Take picture using device camera and retrieve image as base64-encoded string
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50 });
}
//Callback function when the picture has been successfully taken
function onPhotoDataSuccess(imageData) {
// Get image handle
var smallImage = document.getElementById('smallImage');
// Unhide image elements
smallImage.style.display = 'block';
smallImage.src = imageData;
}
//Callback function when the picture has not been successfully taken
function onFail(message) {
alert('Failed to load picture because: ' + message);
}
-
Теперь я хочу переместить изображение в постоянную папку, а затем сохранить ссылку в моей базе данных:
function movePic(file){
window.resolveLocalFileSystemURI(file, resolveOnSuccess, resOnError);
}
//Callback function when the file system uri has been resolved
function resolveOnSuccess(entry){
var d = new Date();
var n = d.getTime();
//new file name
var newFileName = n + ".jpg";
var myFolderApp = "EasyPacking";
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
//The folder is created if doesn't exist
fileSys.root.getDirectory( myFolderApp,
{create:true, exclusive: false},
function(directory) {
entry.moveTo(directory, newFileName, successMove, resOnError);
},
resOnError);
},
resOnError);
}
//Callback function when the file has been moved successfully - inserting the complete path
function successMove(entry) {
//I do my insert with "entry.fullPath" as for the path
}
function resOnError(error) {
alert(error.code);
}
-
Мой файл был сохранен в базе данных для его отображения, я помещаю "file://" в начало строки, которая содержит изображение src
Надеюсь на эту помощь.
J.
P.S.:
- большое спасибо Симону Мак Дональду (http://hi.im/simonmacdonald) за сообщение на googledocs.
Ответ 2
Ответ Джерома работает как шарм. Единственное, что нужно указать людям, когда они хотят использовать файл, не использовать entry.fullPath, поскольку это иногда может вызвать проблемы, используйте entry.toURL(), поскольку это даст вы полный путь, не добавляя "файл://" в путь, а также обходя такие проблемы, как хранение SD-карт..
Ответ 3
if (index == '0')
{
var options = {
quality: 50,
destinationType: Camera.DestinationType.FILE_URI,
sourceType: Camera.PictureSourceType.CAMERA,
allowEdit: false,
encodingType: Camera.EncodingType.JPEG,
popoverOptions: CameraPopoverOptions,
saveToPhotoAlbum: false,
correctOrientation:true
};
$cordovaCamera.getPicture(options).then(movePic,function(imageData) {
$rootScope.imageUpload=imageData;
}, function(err) {
console.error(err);
});
function movePic(imageData){
console.log("move pic");
console.log(imageData);
window.resolveLocalFileSystemURL(imageData, resolveOnSuccess, resOnError);
}
function resolveOnSuccess(entry){
console.log("resolvetosuccess");
//new file name
var newFileName = itemID + ".jpg";
var myFolderApp = "ImgFolder";
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
console.log("folder create");
//The folder is created if doesn't exist
fileSys.root.getDirectory( myFolderApp,
{create:true, exclusive: false},
function(directory) {
console.log("move to file..");
entry.moveTo(directory, newFileName, successMove, resOnError);
console.log("release");
},
resOnError);
},
resOnError);
}
function successMove(entry) {
//I do my insert with "entry.fullPath" as for the path
console.log("success");
//this is file path, customize your path
console.log(entry);
}
function resOnError(error) {
console.log("failed");
}
}
Ответ 4
Я только что сделал, что работает с promises, на основе ответа Жерома выше:
function moveFile(file){
var deferred = $q.defer();
window.resolveLocalFileSystemURL(file,
function resolveOnSuccess(entry){
var dateTime = moment.utc(new Date).format('YYYYMMDD_HHmmss');
var newFileName = dateTime + ".jpg";
var newDirectory = "photos";
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
//The folder is created if doesn't exist
fileSys.root.getDirectory( newDirectory,
{create:true, exclusive: false},
function(directory) {
entry.moveTo(directory, newFileName, function (entry) {
//Now we can use "entry.toURL()" for the img src
console.log(entry.toURL());
deferred.resolve(entry);
}, resOnError);
},
resOnError);
},
resOnError);
}, resOnError);
return deferred.promise;
}
function resOnError(error) {
console.log('Awwww shnap!: ' + error.code);
}
Ответ 5
Есть три шага:
- Получить фотографию. Apple имеет хороший пример для этого на веб-сайте iPhone
- Получить каталог документов, например:
NSArray *arrayPaths = NSSearchPathForDirectoriesInDomains(
NSDocumentDirectory,
NSUserDomainMask,
YES);
NSString *docDir = [arrayPaths objectAtIndex:0];
- И, наконец, сохранение UIImage, полученного на шаге 1, на диск:
NSString *filename = @"mypic.png";
NSString *fullpath = [docDir stringByAppendingPathComponent:filename];
[UIImagePNGRepresentation(image) writeToFile:fullpath atomically:YES];