如何使用phonegap阅读和显示本机联系人列表照片 [英] How to read and display native contact list photo using phonegap

问题描述

我在Phonegap上构建. 相当不错，因为我找到了如何建立联系人列表的方法.我有 完成了本教程，现在想对其进行补充以更好地学习 Phonegap.

I am building on the Phonegap. Pretty nifty, in that I found how to build a contact list. I've finished the tutorial, and now want to add to it to better learn Phonegap.

我想做的是在屏幕上显示联系人的主要照片 项目详细信息页面.联系人照片返回的网址为"/var/ 文件夹/45/xfgjqr4j59144x8gzq4gdrpw0000gn/T/photo_004.jpg".我 问题是我该如何实际显示?我假设/ 不能通过img标签访问var目录(因为无法通过image访问 显示)，但我认为可以通过Phonegap访问该文件 API.我进一步假设它是通过File API进行的.那是 我的思路很详细，我再也走不了了.

What I would like to do is display the contact's primary photo on the item detail page. The contact photo is returning a url of "/var/ folders/45/xfgjqr4j59144x8gzq4gdrpw0000gn/T/photo_004.jpg". My question is how can I actually display that? I'm assuming the / var directory is not accessible via the img tag (as the image is not displaying), but I assume that file is accessible through a Phonegap API. I further assume that it is somehow through the File API. That's where my train of thought details and I can go no further.

有人可以帮助我重回正轨吗?任何人都有一个如何 显示联系人列表中的图像?

Can anyone help me get back on track? Anyone have an example of how to display the image from the contact list?

推荐答案

在 PhoneGap API文件文档.您可以将文件读取为base64字符串，并将其嵌入HTML img标签:

Check this link on PhoneGap API File documentation. You could read the file as base64 string, and embed it in the HTML img tag:

<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." />

例如，使用PhoneGap 2.5可能是这样的:

Maybe like this, using PhoneGap 2.5, for example:

function loadImage(imgId, fileName){
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0,
        function(fileSystem){
            fileSystem.root.getFile(fileName, null,
                function(fileEntry) {
                    fileEntry.file(
                        function(file){
                            var reader = new FileReader();
                            reader.onloadend = function(evt) {
                                var image = document.getElementById(imgId);
                                image.src = "data:image/png;base64," + evt.target.result; //You must specify the image format: png, gif, ...
                             };
                             reader.readAsDataURL(file);
                        }
                        , fail);
                }
                , fail);
        }
        , fail);
}

function fail(evt) {
    console.log(evt.target.error.code);
}

然后，使用id="contact1"为img节点加载图像:

Then, to load an image for a img node with id="contact1":

loadImage("contact1", "/var/folders/45/xfgjqr4j59144x8gzq4gdrpw0000gn/T/photo_004.jpg");

这只是一个模糊的想法，我还没有测试过.

It's just a vague idea, I haven't tested it yet.

这篇关于如何使用phonegap阅读和显示本机联系人列表照片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！