[PLUGIN] Canvas

I created a casual game based on the Canvas plugin, designed for mobile devices and unfortunately the Flood-fill doesn't work well on these devices.

I used Flood-fill to detect the internal filling of a circular area designed by the touch of the player on the screen, but when testing him in a smartphone (quadcore with 1GB RAM), the game ran at one frame per second.

Does anyone have a suggestion to solve this?

Thank you in advance the attention and collaboration of all. ^^

lukezero

Flood filling is a slow operation, even on desktops, so that could explain why it's very slow on mobile. You could try making the canvas lower resolution with the "resize canvas" action to ease off some of the load, but if your game is running at 1 fps then that would probably not be good enough. You could also perhaps do the flood fill only every x seconds to space out the slowdowns.

Well R0J0hound, the game starts in slow motion, even before I draw the line. I'm using a canvas rectangle with the size of the screen to recognize the player's dash.

It's also causing the slowness?

PS.: The floodfill is only and quickly executed when I close the circle amending the circle starting point at the tail end. After the floodfill, I execute immediately a Clear Canvas command.

lukezero

It may perform better with webgl off. With webgl "on" a texture copy needs to be done every time the canvas is changed, which is slow.

Thanks for your attention and support, —

Hey hey,

I'm very *very* new to Construct and writing instructions but I tried to follow your example rojohound for making a mirrored waterlike surface ( in this thread.

I can for the life of me not figure out how to extend the surface to the entire bottom of the screen. I've tried changing all the numbers, changing the canvas height value to 50+ and adding and instruction to cover the entire lower part of the screen but but then all i get is a stretchy texture and no ripples

I can't see the link you posted but to do a mirrored water like surface it's just a matter of positioning the canvas with it's hotspot on the bottom of it. You'd then position it in the layout so the bottom will be where you want the top of the water to be. Then in events you'd:

1. paste everything you want to reflect to the canvas

2. set the canvas' height to negative

The effect would basically look like this:

+---+
|   |
|   |
+-o-+  ->  +-o-+
           |   |
           |   |
           +---+[/code:25j7xwz9]

R0J0hound Can this be used to create alpha based collissions detection using rgbaAt(Mouse.X,Mouse.Y)? For instance make an object uncklickable where it's alpha value is "transparent"? does it take the value of all layers combined? Preferably i would like to get the alpha value of a certain sprite, at a certain point returned to compare it.

I was also thinking of using rgbaAt for detecting other colissions. Let's say you have a 2 sprites with a a circular shaped alpha. While overlapping, detecting if there's any point on this overlap where both of the alpha values from the two sprites adds up to more than 1 would count as a "colission". That could make interesting race tracks using alpha channel as boundries instead of placing a lot of dummy sprites.

Getting the rgba at a point in a certain layer?

If you can get the rgba of a certain point in a certain layer you could use this value to create depth or scale, rotate, move stuff depending on the returned rpga value from that layer. For instance you could have a layer controlling the elevetion of a character in an isometric view by getting the rgba value. Displacing the character upwards depending on the value.

Attaching a mockup to explain what I'm trying to do using rgba.

You could use the ammount of red in an image to control rotation of a sprite. green to control, another value, and blue & alpha to control other things. Don't know weather it's possible or not. but would be really cool to have a "hidden layer" using color info to control certain things.

Color info from Depth maps could also be used to create really cool effects. Scaling an object based on distance when getting the rgba value of the depth map could be very useful to get the illusion of depth. placing a sprite on black will scale it down to match it to the perspecive. placing it on white will scale it up to have it seem like in the foreground.

There's a lot of interesting stuff that can be done with the rgba value i guess.

tunepunk

There is also redat, blueat, greenat and alphaat expressions to get individual components of color. That said, it only reads the color from the canvas object itself so you need to paste stuff first to read it's pixels.

I really wonder why such a critical plugin such as "Canvas" is not an integral part of Construct 2! There are so many basic stuff that can only be done using this plugin, that I really feel Scirra should consider integrating this plugin into Construct2..

Thanks R0J0hound! That was much easier than what I tried to do

Hi,

I wanted to use this plugin for detecting a pixel from video input. How should I go about doing that??

Thanks in advance,

akkthedev

P.S. Good plugin btw

akkthedev

To detect a pixel you first need to paste that object into the canvas object, then use the canvas.rgbaAt(x,y) expression.

rojohound Thanks!

Also any idea if face detection is possible by pasting the video layer into the canvas.

Akkthedev

akkthedev

You can access the pixels, but that is the extent this plugin provides. Outside of that you'd have to find other means.