Answered by:
sharing an image from my canvas using share Contract

Question
-
sharing image from my canvas using share Contract
Hi friends i'm trying to use the sharing contract in my app but i want to put an image from my canvas
this is my code
ondata: function (param) { var canvas = document.getElementById("micanvas"); var canvasimagen = canvas.toDataURL("image/png"); var contenido = '<img src="' + canvasimagen + '"/>'; var htmlformato = Windows.ApplicationModel.DataTransfer.HtmlFormatHelper.createHtmlFormat(contenido); var request = param.request; request.data.setHtmlFormat(htmlformato); request.data.properties.title = "Compartiendo mi canvas"; request.data.properties.description = "Mi descripcion"; },
but unfortunately i get this result
please i hope you can help me
pd: perdón si no se entiende bien , soy Mexicano y entonces no domino muy bien el ingles
Saludos desde México DF
Monday, December 24, 2012 7:30 AM
Answers
-
Hi,
Please refer to the example as follow:
//// THIS CODE AND INFORMATION IS PROVIDED "AS IS" WITHOUT WARRANTY OF //// ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO //// THE IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A //// PARTICULAR PURPOSE. //// //// Copyright (c) Microsoft Corporation. All rights reserved (function () { "use strict"; var imageFile; var page = WinJS.UI.Pages.define("/html/image.html", { ready: function (element, options) { imageFile = null; var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView(); dataTransferManager.addEventListener("datarequested", dataRequested); document.getElementById("chooseImageButton").addEventListener("click", chooseImage, false); document.getElementById("shareButton").addEventListener("click", showShareUI, false); }, unload: function () { var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView(); dataTransferManager.removeEventListener("datarequested", dataRequested); } }); function dataRequested(e) { var request = e.request; // Title is required var dataPackageTitle = document.getElementById("titleInputBox").value; if ((typeof dataPackageTitle === "string") && (dataPackageTitle !== "")) { if (imageFile) { request.data.properties.title = dataPackageTitle; // The description is optional. var dataPackageDescription = document.getElementById("descriptionInputBox").value; if ((typeof dataPackageDescription === "string") && (dataPackageDescription !== "")) { request.data.properties.description = dataPackageDescription; } var streamReference = Windows.Storage.Streams.RandomAccessStreamReference.createFromFile(imageFile); request.data.properties.thumbnail = streamReference; // It's recommended to always use both setBitmap and setStorageItems for sharing a single image // since the Target app may only support one or the other // Put the image file in an array and pass it to setStorageItems request.data.setStorageItems([imageFile]); // The setBitmap method requires a RandomAccessStreamReference request.data.setBitmap(streamReference); } else { request.failWithDisplayText("Select an image you would like to share and try again."); } } else { request.failWithDisplayText(SdkSample.missingTitleError); } } function chooseImage() { // Verify that we are currently not snapped, or that we can unsnap to open the picker var currentState = Windows.UI.ViewManagement.ApplicationView.value; if ((currentState === Windows.UI.ViewManagement.ApplicationViewState.snapped) && !Windows.UI.ViewManagement.ApplicationView.tryUnsnap()) { // fail gracefully if we can't unsnap WinJS.log && WinJS.log("Cannot unsnap the sample application.", "sample", "status"); return; } var picker = new Windows.Storage.Pickers.FileOpenPicker(); picker.fileTypeFilter.replaceAll([".jpg", ".bmp", ".gif", ".png"]); picker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; picker.pickSingleFileAsync().done(function (file) { if (file) { // Display the image to the user // document.getElementById("imageHolder").src = URL.createObjectURL(file, { oneTimeOnly: true }); //add canvas var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.fillStyle = "#FF0000"; ctx.fillRect(0, 0, 150, 75); var dataUrl = c.toDataURL(); document.getElementById("imageHolder").src = dataUrl; // The imageFile variable will be set to shareValue when the user clicks Set imageFile = file; document.getElementById("scenarioOutput").className = "unhidden"; } }); } function showShareUI() { Windows.ApplicationModel.DataTransfer.DataTransferManager.showShareUI(); } })();
More details, please refer to Sharing content source app sample.Roy
MSDN Community Support | Feedback to us
Develop and promote your apps in Windows Store
Please remember to mark the replies as answers if they help and unmark them if they provide no help.- Marked as answer by Oscar Emilio Perez Martinez Friday, December 28, 2012 3:05 AM
Tuesday, December 25, 2012 6:28 AM
All replies
-
Hi,
Please refer to the example as follow:
//// THIS CODE AND INFORMATION IS PROVIDED "AS IS" WITHOUT WARRANTY OF //// ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO //// THE IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A //// PARTICULAR PURPOSE. //// //// Copyright (c) Microsoft Corporation. All rights reserved (function () { "use strict"; var imageFile; var page = WinJS.UI.Pages.define("/html/image.html", { ready: function (element, options) { imageFile = null; var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView(); dataTransferManager.addEventListener("datarequested", dataRequested); document.getElementById("chooseImageButton").addEventListener("click", chooseImage, false); document.getElementById("shareButton").addEventListener("click", showShareUI, false); }, unload: function () { var dataTransferManager = Windows.ApplicationModel.DataTransfer.DataTransferManager.getForCurrentView(); dataTransferManager.removeEventListener("datarequested", dataRequested); } }); function dataRequested(e) { var request = e.request; // Title is required var dataPackageTitle = document.getElementById("titleInputBox").value; if ((typeof dataPackageTitle === "string") && (dataPackageTitle !== "")) { if (imageFile) { request.data.properties.title = dataPackageTitle; // The description is optional. var dataPackageDescription = document.getElementById("descriptionInputBox").value; if ((typeof dataPackageDescription === "string") && (dataPackageDescription !== "")) { request.data.properties.description = dataPackageDescription; } var streamReference = Windows.Storage.Streams.RandomAccessStreamReference.createFromFile(imageFile); request.data.properties.thumbnail = streamReference; // It's recommended to always use both setBitmap and setStorageItems for sharing a single image // since the Target app may only support one or the other // Put the image file in an array and pass it to setStorageItems request.data.setStorageItems([imageFile]); // The setBitmap method requires a RandomAccessStreamReference request.data.setBitmap(streamReference); } else { request.failWithDisplayText("Select an image you would like to share and try again."); } } else { request.failWithDisplayText(SdkSample.missingTitleError); } } function chooseImage() { // Verify that we are currently not snapped, or that we can unsnap to open the picker var currentState = Windows.UI.ViewManagement.ApplicationView.value; if ((currentState === Windows.UI.ViewManagement.ApplicationViewState.snapped) && !Windows.UI.ViewManagement.ApplicationView.tryUnsnap()) { // fail gracefully if we can't unsnap WinJS.log && WinJS.log("Cannot unsnap the sample application.", "sample", "status"); return; } var picker = new Windows.Storage.Pickers.FileOpenPicker(); picker.fileTypeFilter.replaceAll([".jpg", ".bmp", ".gif", ".png"]); picker.viewMode = Windows.Storage.Pickers.PickerViewMode.thumbnail; picker.pickSingleFileAsync().done(function (file) { if (file) { // Display the image to the user // document.getElementById("imageHolder").src = URL.createObjectURL(file, { oneTimeOnly: true }); //add canvas var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.fillStyle = "#FF0000"; ctx.fillRect(0, 0, 150, 75); var dataUrl = c.toDataURL(); document.getElementById("imageHolder").src = dataUrl; // The imageFile variable will be set to shareValue when the user clicks Set imageFile = file; document.getElementById("scenarioOutput").className = "unhidden"; } }); } function showShareUI() { Windows.ApplicationModel.DataTransfer.DataTransferManager.showShareUI(); } })();
More details, please refer to Sharing content source app sample.Roy
MSDN Community Support | Feedback to us
Develop and promote your apps in Windows Store
Please remember to mark the replies as answers if they help and unmark them if they provide no help.- Marked as answer by Oscar Emilio Perez Martinez Friday, December 28, 2012 3:05 AM
Tuesday, December 25, 2012 6:28 AM -
thanks a lot of
Saludos desde México DF
Friday, December 28, 2012 3:06 AM