Paint game - Can I really do it with the C2?

Hi everybody

I know that it's possible to create a paint game in the C2 but I need to know if it is possible to do it with all these requirements:

• the drawings are outline images (probably rasterised vector images)
• fill the drawings with color including the background (it's not necessary the brush tool)
• at the end the player can print the drawing

I know I can use the canvas plugin for this but I don't if it attends all the requirements and if the final quality is good.

Thanks in advance for any help/demonstration/suggestion?

C2 is not developed to be a good painting tool, but...

You can by two ways:

A - Making a plugin;

B - Making your canvas be a mosaic filled with invisible tiles, whose in touch with a tool will trigger a sequence of events, like a pencil drawing around the point or a paint start painting everything until it reach other tiles with different color from the first one. Also, you can implement tolerance and other behavior, plus, improve the size of the tiles to be small as a pixel, but again, you can use other type of tool to make it easily, including opensource and freewares html5 tools.

This is not very exciting. Any other opinion/suggestion/help?

— surely knows something about this

— surely knows something about this

you are to kind.

RBuster check my signature bundle there is a template there that might do what you want. or the drawing app directly

it using normal Sprites and vector images to fill in their inside empty spaces while still keeping the outlines, so you cant draw outside their box, its a simple painting version, but can be made in so many different ways. for snapshot you can use the system expression to take a picture of the current window, and while you do that you need to clear the objects overlapping then invoke download via browser object. there are plenty small tutorials on this, which if placed together you get a drawing app.

however its made long time ago when i barely knew C2, and has some performance issues, there are a few loops inside that kills performance at some point.

Thanks for the indication X3M

Thanks for the reply — I have checked the app. Very nice.

Is it possible to print the colourful drawing at the end?

Is it possible to print the colourful drawing at the end?

not in the curent app, but you can add that feature, by canvassnapshot system expression and then use the browser expression Invoke download "canvassnapshoturl" and before you call that you will need to clear the so called HUD so yea its possible

To clear the HUD you can simple set the visibility off or set the opacity to 0%

https://www.scirra.com/tutorials/1207/h ... ing-canvas

Thanks guys. But I really need more tips of how to print the drawing and I think I will have a situation here to solve: I need to print all the drawings in same page, like a tile. For example: If the player paint 20 drawing all this drawing should be distributed in the page (1 columns x 6 rows + 2 columns x 7 rows) when they print them. Can I do that?

Thanks in advance.

Is it possible to save 20 snapshots on disk, load them after into a tilemap and so get a snapshot from this and print or save as image?

Is it possible to save 20 snapshots on disk, load them after into a tilemap and so get a snapshot from this and print or save as image?

You could use the Canvas or Paster plugins to composite all of the snapshots and then save the results to a single file.

Is it possible to save 20 snapshots on disk, load them after into a tilemap and so get a snapshot from this and print or save as image?

its possible if you dont want to use paster plugin or other complicated thing, you just create a global sprite, and create a instance of it everytime a drawing is made, save the snapshot url to a frame inside the sprite, then when the user wants to print it, use an positioning in screen for x and for y loopindex array kind of thing, then canvassnapshot again, and invoke the browser.execute javascript call .print to print the newly canvassnapshoturl its going to take a while for you to implement it but its the easiest way of doing it and without non-default plugins.

when you call the print in javascript you use the same javascript you call the print from a html5 website ("javascript:window.print('canvassnapshoturl') ") just you need to change the scripts brackets to single ones ex: "myjavascript code { something 'blob code ,etc' } "

> Is it possible to save 20 snapshots on disk, load them after into a tilemap and so get a snapshot from this and print or save as image?

>

You could use the Canvas or Paster plugins to composite all of the snapshots and then save the results to a single file.

It seems promising. Can I find any example about of how to composite images with Canvas or even Paster (though I have never used this plugin)? Do you have one?

> Is it possible to save 20 snapshots on disk, load them after into a tilemap and so get a snapshot from this and print or save as image?

>

its possible if you dont want to use paster plugin or other complicated thing, you just create a global sprite, and create a instance of it everytime a drawing is made, save the snapshot url to a frame inside the sprite, then when the user wants to print it, use an positioning in screen for x and for y loopindex array kind of thing, then canvassnapshot again, and invoke the browser.execute javascript call .print to print the newly canvassnapshoturl its going to take a while for you to implement it but its the easiest way of doing it and without non-default plugins.

when you call the print in javascript you use the same javascript you call the print from a html5 website ("javascript:window.print('canvassnapshoturl') ") just you need to change the scripts brackets to single ones ex: "myjavascript code { something 'blob code ,etc' } "

Could you make a simple example of this?

You can load url's for sprites, tilemaps and tiledbackgrounds, for example.

The canvas plugin is very similar to tilemaps, but works with any uploaded image without the need of these additional steps.

Canvas Plugin:

-----

You don't need to worry about arrays for this simple task, because a simple math is enough.

The size of each image will be previous know? Do you know how much images you want place on the canvas?

Imagine the canvas divided by slots and give each slot an ID, you'll know each position by its ID and you will be able to place them on the right position. Store the id and position with instance variables.

If you hate math, you can use an invisible tilemap on the background with previous size determined (but you'll be able to change it at runtime if necessary), so, use the tiletopositionX(tileID) and tiletopositionY(tileID) to place you image on the desired tile.