Download blocks as PNG

[Sketch]

Hi all.

i was trying to add a download blocks as PNG future to my workspace and after multiple attempts I still havent got any succes.

I have the download future working but the blocks have black text and black input fields.

Can anyone help?

Thanks

[Beka Westberg]

Hello,

Sam actually implemented a function for downloading screenshots of the workspace a while ago :D Here is the source code for it. 

But be warned, he also stated in the pull request:

> Only supporting Chrome at this point, and only blocks on the workspace, this is meant for testing and not a feature ready for production.

So it doesn't work on all browsers, and may be buggy :/

The other problem is that this doesn't actually save the blocks, it just downloads a screen shot. If you want to save them you need to use `Blockly.Xml.workspaceToDom(myWorkspace)`. However, it is possible to add the XML returned by that function to the metadata of the PNG, which is what App Inventor does. That way you can actually save and load using a PNG (with a bit of extra effort ofc hehe). I believe their source code is here. 

I hope that gives you some places to start!

--Beka

[Sketch]

Hi BekaThis does not help :(

I still have the black text.

It did improve image rendering tho.

Op woensdag 11 augustus 2021 om 00:38:56 UTC+2 schreef bwes...@google.com:

[Beka Westberg]

Huh that's odd. I'm not able to reproduce this problem. It looks like you're using the zelos renderer, are you also using a custom theme or custom css? Maybe try logging the css from here to see if it gives you any hints.

Also, if you're able to share a web demo or a link to a public repo I'm happy to dig around and take a look =)

I hope that helps!

--Beka

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/902be58d-bb9f-4f06-be85-49a049436637n%40googlegroups.com.

[Sketch]

sure,

you can check out my pen here:

https://codepen.io/lukeplays33/pen/LYyGZya

Op donderdag 12 augustus 2021 om 01:25:15 UTC+2 schreef bwes...@google.com:

[Beka Westberg]

Thank you for the codepen that was super helpful :D I've found a more up-to-date version of the screenshot code that should fix your issues (it fixed it for me). Just replace your workspaceToSvg_ function with this version and you should be good to go.

Best wishes =)

--Beka

To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/f67f8a84-8931-47a0-bafc-7ea83c8b06a5n%40googlegroups.com.

[Sketch]

Yes it works Beka.

Thank You!

Op do 12 aug. 2021 om 22:25 schreef 'Beka Westberg' via Blockly <blo...@googlegroups.com>:

To view this discussion on the web visit https://groups.google.com/d/msgid/blockly/CAHpwHMY8OyjpDnWqSKJq8M6MTJM%2B0cZb_%3DWGQzyL--0EF-pA2g%40mail.gmail.com.