社交分享插件Cordova / Phonegap

时间:2013-05-08 12:54:48

标签: cordova social

我正在使用Cordova的社交共享插件(https://github.com/bfcam/phonegap-ios-social-plugin),我的一切正常。我想知道的是,如果有一种方法可以拍摄您拍摄的图像,或者从您的图书馆共享而不是预定义的图像。我已经设置了功能来拍照并从我的库中选择一个图像。感谢。

我使用的是ImageFilter插件,这是我的index.html页面的代码

<!DOCTYPE html>
<html>
  <head>
  <title></title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta charset="utf-8">

    <link rel="stylesheet" href="css/style.css">

    <!-- CORE -->
    <script src='js/core/cordova-1.6.0.js'></script>
    <script src='js/core/jQuery.js'></script>

    <!-- PLUGINS -->
   <script src='js/plugins/ImageFilter.js'></script>
   <script src='js/core/social.js'></script>

   <!-- OUR SCRIPTS -->
   <script src='js/init.js'></script>
   <script>
    window.plugins.social.available(function(avail) {
                                if (avail) {
                                // Show social widgets
                                } else {
                                // Social not supported
                                }
                                });
 </script>



 </head>
 <body onload="app.bodyLoad()">
    <div id="header"><img src="images/header.png" width="100%"></div>
<div id="wrapper">
    <div id="content">

        <!-- BUTTONS -->
        <div id="buttons">
            <div class="btn" id="camera" onClick="app.useCamera();">use camera</div>
            <div class="btn" id="roll" onClick="app.useRoll();">use library</div>
            <div class="btn" id="share" onClick="window.plugins.social.share('', '', 'www/images/filters/stark.png');">Share</div>
        </div>
        <!-- END BUTTONS -->

        <!-- IMAGE AREA -->
        <div id="imageArea">
            <!-- OUR IMAGE -->
            <div class="photo"></div>
            <!-- FILTERS -->
            <div id="filters">
                <div class="filter" id="none" onClick="filters.none(largeImage);">
                    <div class="filterIcon"><img src="images/filters/none.png" height="100%"></div>
                    <div class="filterTitle">none</div>
                </div>
                <div class="filter" id="sunnySide" onClick="filters.sunnySide(largeImage);">
                    <div class="filterIcon"><img src="images/filters/sunnySide.png" height="100%"></div>
                    <div class="filterTitle">sunnySide</div>
                </div>
                <div class="filter" id="worn" onClick="filters.worn(largeImage);">
                    <div class="filterIcon"><img src="images/filters/worn.png" height="100%"></div>
                    <div class="filterTitle">worn</div>
                </div>
                <div class="filter" id="vintage" onClick="filters.vintage(largeImage);">
                    <div class="filterIcon"><img src="images/filters/vintage.png" height="100%"></div>
                    <div class="filterTitle">vintage</div>
                </div>
                <div class="filter" id="stark" onClick="filters.stark(largeImage);">
                    <div class="filterIcon"><img src="images/filters/stark.png" height="100%"></div>
                    <div class="filterTitle">stark</div>
                </div>
            </div>
        </div>
        <!-- END IMAGE AREA -->


      </div>
  </div>
</body> 
</html>

以下是图片过滤器插件中的js,它允许我从我的库中选择图像或使用相机拍摄照片

var largeImage;

var app = {
    bodyLoad: function () {
        document.addEventListener("deviceready", app.deviceReady, false);
    },
    deviceReady: function () {
        app.init();
    },
    init: function () {

    },
    useCamera: function () {
       navigator.camera.getPicture(app.onCameraSuccess, app.onCameraFail, {
          quality: 100,
        destinationType: Camera.DestinationType.FILE_URI,
        sourceType: Camera.PictureSourceType.CAMERA,
        //allowEdit : true,
        encodingType: Camera.EncodingType.JPEG,
        targetWidth: 910,
        targetHeight: 910,
        saveToPhotoAlbum: false
    });
},
useRoll: function () {
    navigator.camera.getPicture(app.onCameraSuccess, app.onCameraFail, {
        quality: 100,
        destinationType: Camera.DestinationType.FILE_URI,
        sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
        encodingType: Camera.EncodingType.JPEG,
        targetWidth: 910,
        targetHeight: 910,
        saveToPhotoAlbum: false
    });
},
onCameraSuccess: function (imageURI) {

    largeImage = imageURI;
    $(".photo").html("<img src='" + imageURI + "'>");
    $(".photo").show();

},
onCameraFail: function (msg) {
    console.log("ERROR! -" + msg);
}
};

var filters = {
    none: function (imageURI) {
        plugins.ImageFilter.none(filters.rendered, {
           image: imageURI,
           save: 'false',
       });
    },
    sunnySide: function (imageURI) {
        plugins.ImageFilter.sunnySide(filters.rendered, {
            image: imageURI,
            save: 'false'
        });
    },
    worn: function (imageURI) {
        plugins.ImageFilter.worn(filters.rendered, {
            image: imageURI,
            save: 'false'
        });
    },
    vintage: function (imageURI) {
        plugins.ImageFilter.vintage(filters.rendered, {
            image: imageURI,
            save: 'false'
        });
    },
    stark: function (imageURI) {
        plugins.ImageFilter.stark(filters.rendered, {
            image: imageURI,
            save: 'false'
        });
    },
    rendered: function (msg) {

        $(".photo").html("<img src='" + msg + "'>");
    }
}

我正在努力使用什么参数来代替&#39; www / image / local_image.jpg&#39;为了分享我从图书馆中选择或选择的图像。

1 个答案:

答案 0 :(得分:0)

该插件的自述文件说您可以分享这样的内容:

window.plugins.social.share('This is the message you want to share', 'http://someurl.com', 'www/image/local_image.jpg');

因此,您应该能够共享您拥有的任何图像,只需将'www / image / local_image.jpg'替换为您要共享的图像的路径。如果您已经有代码来拍照或从库中选择图像,这应该是微不足道的。