Does anyone have any suggestions for how re-sizing in drawing programs (and the GDevelop scene editor) works behind the scenes? The user clicks on the shape and then re-size handles appear around it at the corners and mid points. Then select one of the points and move the mouse to drag and resize.
I’ve tried a few things including having one handle pinned to the object, grabbing that and dragging to resize. But it wasn’t great as the cursor moves but the resizing is delayed and therefore the cursor moved away from the handle.
I found that using scale was more responsive than using width/height. My current set up is to put the object into resize mode by double clicking (thank you Silver-Streak extension) and then waiting a fraction of a second. There’s a ‘mousedot’ object (not currently hidden) that follows the mouse. After the waiting period, it compares the mouse position with the mousedot position and adjusts the scale of the object accordingly. The origin point of the shape is in the bottom left corner. There’s other stuff going on too like tinting, rotating, changing z-order and dragging which are all working without the use of tool modes/buttons which I want to avoid.
The resizing works but isn’t standard compared with the way drawing apps work. The shape manipulation isn’t the main part of my project but if you have a way to make it more standard then I’m interested. My previous method with grabbing the handle used the same principle of the wait delay and then comparing positions.
(The crazy small scale in the actions is because I have the shapes big but resized to small on creation to try to avoid jaggy edges on the circle)
That’s a cool prototype you have in the Gif! To my knowledge, the way resizing works in most drawing programs is that it takes one of the selected pixels and duplicates it one pixel to the direction of resize, or if the program is blurring it, it takes the average of the current selected pixel and the next one in the direction of the resize to smooth it out. I’m not sure how GDevelop’s resize works, but I can’t imagine it works much different, just resizing the sprite and its collision mesh’s pixels to fit.
Success, I’m so happy.
I’ve got a system now where I can drag a handle and the shape resizes. It’s very smooth with both mouse and touch. My first system relied on the cursor/touch staying in the bounds of the shape which made it awkward and unintuitive. And this system doesn’t have a wait delay which I hated as it felt like a huge fail.
This new system still only has one resize handle as it’s not possible to change the shape origin point in events in order to have multiple handles.
New system:
Handle goes to top right hand corner of shape
Select object → save handle x and y positions to StartX and StartY
Drag handle → save mouse x and y positions to EndX and EndY
While StartX/Y aren’t the same as EndX/Y → change shape width to EndX - ShapeX, → change shape height to ShapeY - EndY
