2013-02-18 58 views
14

我对phonegap非常陌生,它表示它具有捕获功能。所以我用它,非常好。然而,我在html中显示图片,但我不知道如何保存图像。根据http://docs.phonegap.com/en/1.7.0/cordova_camera_camera.md.html将图像保存在本地存储PhonePhone

你可以做任何你想用的编码图像或URI

,例如:

呈现在标签图像(见下面的例子) 保存在本地的数据(localStorage的,Lawnchair等) 后的数据传送到远程服务器

不幸的是在如何做到这一点

没有示例代码

如何将图像保存在LocalStorage或设备图库中?

+1

发现https://github.com/raananw/PhoneGap-Image-Resizer这是否仍然有效? – jhdj 2013-02-21 05:45:34

+0

它工作只需要一些调整 – jhdj 2013-02-26 02:59:54

回答

22

伟大的你找到了解决方案,我做了以下几点。 希望它可以帮助别人。

只需调用按钮单击事件capturePhoto功能。

// A button will call this function 
// 
function capturePhoto() { 
    sessionStorage.removeItem('imagepath'); 
    // Take picture using device camera and retrieve image as base64-encoded string 
    navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50, destinationType: Camera.DestinationType.FILE_URI }); 
} 

function onPhotoDataSuccess(imageURI) { 
     // Uncomment to view the base64 encoded image data 
     // console.log(imageData); 

     // Get image handle 
     // 
     var imgProfile = document.getElementById('imgProfile'); 

     // Show the captured photo 
     // The inline CSS rules are used to resize the image 
     // 
     imgProfile.src = imageURI; 
     if(sessionStorage.isprofileimage==1){ 
      getLocation(); 
     } 
     movePic(imageURI); 
} 

// Called if something bad happens. 
// 
function onFail(message) { 
    alert('Failed 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 = "MyAppFolder"; 

    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) { 
    //Store imagepath in session for future use 
    // like to store it in database 
    sessionStorage.setItem('imagepath', entry.fullPath); 
} 

function resOnError(error) { 
    alert(error.code); 
} 

这段代码的作用是对设备的SD卡

捕获图像并将其存储在MyAppFolder。 并在会话中存储imagepath以便将其插入到本地数据库中。

+2

这不适合我。你有工作副本吗? – surhidamatya 2013-09-23 10:06:29

+0

感谢它为我工作。:) – mohitum 2014-01-16 12:41:21

+0

我可以捕捉的图像,但未能将其保存到本地存储 – 2015-04-23 11:08:13

9

在选项设置为True著作saveToPhotoAlbum很好的为好。从2.9文档here得到。

+1

来自文档的简单建议的额外要点。 – leech 2013-12-19 20:12:09