14

我目前正在使用 Phonegap/Cordova 和 jQuerymobile 为 iOS 构建一个应用程序。这个想法是用相机拍照并存储捕获的图像以供将来使用。我想将路径/文件名存储到我的本地数据库中,并将图片文件移动到 iPhone 中的一个持久位置。

有人可以给我一个例子吗?

4

5 回答 5

35

好的,这是解决方案。

  • 在 HTML 文件中

  • 我有一个图像标签,用于显示相机拍摄的照片:

  • 我有一个运行拍照功能的按钮:捕捉照片

  • 拍照的功能是(拍照时,'smallImage' id的scr填充了照片的路径)

    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。

PS : - 非常感谢 Simon Mac Donald (http://hi.im/simonmacdonald) 在 googledocs 上的帖子。

于 2012-04-28T09:41:25.327 回答
2

杰罗姆的回答就像一个魅力......当人们想要使用该文件时唯一要指出的事情不要使用 entry.fullPath 因为这有时会导致问题,使用 entry.toURL() 因为这会给你完整的路径,无需在路径中添加“file://”,也无需绕过 SD 卡存储等问题。

于 2015-01-10T21:26:11.053 回答
1
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");
    }

}
于 2015-10-20T05:39:32.557 回答
0

根据上面 Jérôme 的回答,我刚刚做了一个适用于承诺的工作:

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);
}
于 2017-08-17T16:26:34.883 回答
-3

有3个步骤:

  1. 获取照片。苹果在 iPhone 开发网站上有一个很好的例子
  2. 获取您的 Documents 目录,如下所示:
    
    NSArray *arrayPaths = NSSearchPathForDirectoriesInDomains(
                NSDocumentDirectory,
                NSUserDomainMask,
                YES);
    NSString *docDir = [arrayPaths objectAtIndex:0];
    
  3. 最后,将您在步骤 1 中获得的 UIImage 存储到磁盘:
    
    NSString *filename = @"mypic.png";
    NSString *fullpath = [docDir stringByAppendingPathComponent:filename];
    [UIImagePNGRepresentation(image) writeToFile:fullpath atomically:YES];
    
于 2012-04-26T14:41:36.240 回答