Copy link to clipboard
Copied
Hi
I have a game I'm making in Animate CC (HTML5 canvas), and would like to have a button so the gamer can save their current progress as an image. How do I do that?
Thank you in advance
You can use the following code for Html Canvas documents. Say, you wish to capture the last frame of your animation; just paste the following code in the last frame:
this.stop();
var aTag = document.createElement('a');
aTag.setAttribute('href', canvas.toDataURL("image/png"));
aTag.innerHTML = "Download Screenshot";
aTag.download = "YourScreenshot.png";
document.body.appendChild(aTag);
Copy link to clipboard
Copied
Save it to where?
Copy link to clipboard
Copied
Well, what are my options?
Can I save it to the device's default 'my images' folder or wherever screenshots usually get saved?
Copy link to clipboard
Copied
inesaguiar wrote
Can I save it to the device's default 'my images' folder or wherever screenshots usually get saved?
Web pages can't force files into the client's local filesystem. That would be an insane security vulnerability. If you have server-side scripting support it would be possible to save screenshots on the server. For client-side saving, the code posted above will allow the user to choose to download a screenshot.
Copy link to clipboard
Copied
Yes, that is perfectly understandable...
But this works! I'm just worried that the link to download is too discreet. Maybe I can have an alert box saying it's downloadble...
Thanks @Nipun Asthana
Edit: Well, it's better with the alert box, but now the link text is really tiny - even when i disable the alert code... '-_-
Edit 2: nevermind, i accidentally had the zoom at 30% somehow...
So it's solved! Thank you!
Copy link to clipboard
Copied
You can use the following code for Html Canvas documents. Say, you wish to capture the last frame of your animation; just paste the following code in the last frame:
this.stop();
var aTag = document.createElement('a');
aTag.setAttribute('href', canvas.toDataURL("image/png"));
aTag.innerHTML = "Download Screenshot";
aTag.download = "YourScreenshot.png";
document.body.appendChild(aTag);
Copy link to clipboard
Copied
It's an old thread, but I've got a question about it. First... this script works like a charm!
I've put the script on a button. Would it be possible to download it directly? Just one click on the button and download?
Or put it in the action script layer while entering the frame and then use my button to download the image? I don't like the "Download Screenshot" text that much.