0 Favourites

[plugin] Canvas2ImagePlugin

  • 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.

  • It might be better that turn this plugin to a behavior for rojo's canvas, so that you do not need repeat canvas code.

  • having it as a behavior is a good idea, actually if you think about it, it does not have to be a canvas extension only.

    if I am not mistaken "Sprites" can also benefit from it as they are made of canvases as well.

  • Yes, it will be more powerful.

  • Hi guys, is there a way to download the snapshot Canvas on android/crosswalk? i've tried to install the plugin "Canvas2ImagePlugin" and the permissions for external and internal storage on xdk but when i press the button for download (with "Invoke download of CanvasSnapshot) nothing happen :/

  • hi, hassiba! I followed your tutorial step by step but not work [using the 1621 version of XDK]: I get a black screen both in emulation panel and after apk build.

    any idea?

    thx

  • is it possible to make a new folder, and save images just for my game there?

  • hi, hassiba! I followed your tutorial step by step but not work [using the 1621 version of XDK]: I get a black screen both in emulation panel and after apk build.

    any idea?

    thx

    Me too.

  • Anyone use this plugin today? If not, is there any similar? Thanks!

  • So, does this plugin still work? and should it be from R0J0hound 'Canvas plugin' and modify it? or is there a link to download 'Canvas2imageplugin'?

  • Construct 3

    Buy Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Buy Now Construct 3 users don't see these ads
  • hassiba and rexrainbow can you please edit the "canvas" plugin and post to dropbox and share the link so those who are getting a black screen error (like me) can be assisted once and for all.

    I actually believe in this edited plugin of yours

  • Yes please!!!

  • hassiba hasn't been on here for over a year and his last post was over 3 years ago. It's not likely he will be updating his links.

    rexrainbow has nothing to do with this addon and his addons are all still available so unsure what you are requesting of him, unless you mean you are asking him to edit R0j0hound's Canvas addon(!?). If so, why on earth would you ask in this thread?

  • zenox98 Because just like everyone else who said they are getting a black screen I am desperate.And I asked rexrainbow too because he understands how plugins/addons are made/edited correctly and I think he approves of this edited plugin.I am sure if rexrainbow isn't keen on helping he will express it himself.

  • C2isthetruth

    Sorry I don't have time to modify plugins which are not mine.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)