Hello everyone, I want to create a drag and drop (d&d) interactive game which works on a web browser (directed more towards mobile web). Basic requirement is to d&d shapes on a canvas and then change its color, size, rotation etc. A benchmark as to what I intend to create can be seen here.
Since I’m new to G Develop I could only create a d&d event after watching a tutorial on YouTube.
Need suggestions (and maybe some help) as to how can I create the above mentioned mechanics. Like, a menu to change color pops up once the shape is dragged onto the canvas. Would appreciate any kind of insights which provide a sense of direction. Thanks!
Hi,
You will need this action:

And then you will need sliders to adjust each color.
You will find everything you need in the example project called:
![]()
Thank you for these insights! The resources that you pointed out are exactly what I need. I want to add a couple of more features though.
- After the shape is created on the canvas in the example (advanced shape based painter), I want that shape to be draggable and ability to change the size of it.
and - How to make the final design downloadable for the users to share?
I don’t think you can drag/edit the shapes of the shape painter.
If you use standard objects like in your first message, you can use the size actions (width/height/scale) and you can add the draggable behavior to the objects, probably.
Great. I’ll try it out. Thanks again. It was very helpful. ![]()
In the example project, how can I limit the size of the canvas where the shapes can be drawn? As of now it draws all over the place, even where the sliders are present.
You can use mouse position as condition for your draw events.
If mouseX> your min cancasX
If mouseX < your max canvasX
If mouseY>your min canvasY
If mouseY <your max canvasY
→ your draw events
Put a layer over it.
With a screensized image that has a transparent cut out (draw area)
And your settings a layer above that
Thank you.
I’m unable to crack it though. ![]()
I’ve created a layer with transparent cut out (2nd layer) and then a (3rd layer) to put in the above setting that you mentioned. The shapes are still getting drawn over.
Just put/create the shape painter objects on the lowest layer
They’re already on the base layer.
Apart from that, how to add an undo button to the game?
Hmm, might have to do with the blendmode of the base layer then. I’ll have to try it out later to see, if there is a workaround, I’m not too familiar with the blend modes.
e: idk what you are talking about, but its working fine:
move all your objects, except the shape painter object to the top layer (other elements)
and your frame a layer below that (The coverframe). The base layer on the bottom with only the shape painter object on it.
As for the undo button:
After you create a shape, you set a object variable of the shape (id) to a scene variable(count). The first one will be 0 set automatically by GD, then add 1 to scene variable(count). Then
When you click the undo button:
If variable (id) of shape = variable(count)-1
Delete shape and do -1 to scene variable(count)
Aah, thanks for sharing your screenshots. Actually, with the transparent cutout the shapes were still showing through despite playing with the layers. The screenshot with the red color made it clear. ![]()
If possible, can you share an example of the undo button as well? I want an arrow button (object) to act as a undo button.
This part is not the issue. I tested it and everything still works the same.
Have you changed nothing else regarding events?
E: maybe I did change more and forgot to mention it. I’ll check that later
No, I haven’t changed anything in the events apart from this.
Do share the changes that you’ve made, it would be helpful to sort the current issue.







