Hi guys
I have a project where I need to save the canvas screenshot to mobile photo gallery
The browser plugin with its example from C2 only worked on PC browsers but not on android. after 20+ hours of research I managed to do it.
apparently, there is a third party Cordova plugin for this purpose, it is called "Canvas2ImagePlugin"
I am not an expert in programming, let alone writing plugins from scratch. so I edited the "Canvas" plugin from R0J0hound to test it and it WORKED.
Here is what I did:
1) add the following in Canvas "edittime.js"
AddAction(44, 0, "Canvas2Image", "Canvas", "Canvas2Image", "Canvas2Image", "Canvas2Image");
2) add the following in Canvas "runtime.js"
acts.Canvas2Image= function ()
{
var imageData = this.canvas.toDataURL().replace(/data:image\/png;base64,/,'');
cordova.exec(null, null, "Canvas2ImagePlugin","saveImageDataToLibrary",[imageData]);
};
3) create a new C2 project, drop a canvas, color it red, create a button and on the even sheet, button on clicked => Canvas2Image
note: running the project on PC will not save the file for you, actually it will give you an error because it does not understand cordova.exec.
4) on Intel XDK, you need to add the plugin and enable few permissions:
4.1) Add Canvas2ImagePlugin:
from Cordova Setting, go to Third Party Plugins
click on "get plugin from the web" and fill in the following:
name=: Canvas2ImagePlugin
Plugin ID=: org.devgeeks.Canvas2ImagePlugin
Repro URL=:
(I do not have previllage to post URLs on this forum yet, maybe someone can do that for me, it is on github under /devgeeks/Canvas2ImagePlugin.git)
4.2) enable external storage read/write permission in order to be able to access the photo gallery:
Click on permission -> Android-Crosswalk
in add Permission text field add the following (submit after each enetry):
READ_EXTERNAL_STORAGE
WRITE_EXTERNAL_STORAGE
note: I am not sure if I need read access, but I added it anyway.
we are done, now just export the project and build it
now run the app on your mobile and click the button. go and check your gallery and you will find a sweet red image sitting there
hope you guys find this helpful.