Layout Scale changes Mouse Position Ratio ?

  • Hi All,

    In my bigger project I have a "GUI" layer which sets both: Scale and Parallax to 0.

    Whenever I Zoom In/Out all the layers affected but the GUI layer is not since all the panels, menus and stuff that need to stay 100% the same size and position are there.

    Thanks to the kind help from the community I'm trying to add the color picker to the GUI layer.

    The issue starts after scaling the layout, the mouse x,y position ratio changing as well... or should I say NOT changing with the original 1:1 scale ratio of the layout.

    I don't really know how to fix this, so I created a mini file to show you the issue more visually:

    DOWNLOAD - Zoom Color Picker Issue C3 Project File

    .

    I'm not even sure what is the most efficient solution since it's only an issue with the "Picker" object, I don't need the mouse position ratio to be changed on any other drag and drop objects I have on my bigger project because everything works great, but I need to find a solution for the picker itself I guess, I'm confused...

    If you can solve and please explain either here or in the code using comments it will be very helpful to learn and understand, I hope it is not too complicated. Thanks ahead for any help! :)

    Tagged:

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Use Mouse.x(layer) and Mouse.y(layer)

  • Thanks! dop2000 I always learn something new!

    EDIT ISSUE:

    It works almost perfect, but when picking color on half-bottom of the wheel it's a bit laggy at the EDGE of the wheel, can you please have a look?

    DOWNLOAD here

    BTW- (off topic) For efficiency sake: I Don't mind to changing the code from Circle Color Wheel to a traditional Cubic-Like shape if it will make the code shorter! (I just have no idea how to do that with the same drag and drop picker code).

    Thanks ahead! :)

  • Drawing Canvas Snapshot dimensions can be different when you change window size, which also happens when you request full screen mode. You are pasting an object onto the canvas and saving snapshot in the same tick when you are switching to full screen, that's why it doesn't work correctly and you are getting inconsistent results.

  • OH! I see... Nice! :)

    I just added a temporary "after 2 seconds" instead of Start Layout (so the FullScreen will launch first) and it works like you said, I should probably do something like: "AFTER FullScreen complete" or "changed" it will need to paste the wheel again... because users may have different window sizes.

    Maybe I should re-paste the wheel every-time the "panel" will appear, I don't know what's the best way.

    I wish there was a more efficient way so it will work no matter what size of the window will be, but I didn't play with the "Windowed vs. FullScreen" options for users yet... it sounds super complex for now so I'll just go step-by-step solving the Color-Picker first.

    About the BOX Color instead of Circle/Wheel I tried to use your version with the box which is also more advanced but I couldn't get the picker to act like in the current version, I mean by clicking anywhere on the wheel instead of dragging the picker since it's faster.

    I think the code should be less complex because the Wheel have some extra round/radius code that I would happily get rid of... if I knew how of course.

    Thanks for the awesome help sensei dop! I'm learning new things from you all the time! :)

  • I made the picker with drag&drop because it was faster. You can definitely change it to simple click, it should be even easier than what you have now with the circle. Simply clamp picker position to Canvas.BBoxLeft, Canvas.BBoxRight, Canvas.BBoxTop, Canvas.BBoxBottom.

  • I made the picker with drag&drop because it was faster. You can definitely change it to simple click, it should be even easier than what you have now with the circle. Simply clamp picker position to Canvas.BBoxLeft, Canvas.BBoxRight, Canvas.BBoxTop, Canvas.BBoxBottom.

    I'm almost there... it works but, not perefect:

    I'm trying to cleanup, or more like getting rid of ANY of the "round" wheel code with all the complicated unnecessary code but I made a mess, but I did get a bit closer to the goal after trying to add the clamp.

    It feels a bit clanky on the edges (I wanted it to keep sliding instead of being stuck), more like how the picker keep sliding on your version with the drag and drop or the original wheel, while touching the edges it didn't stop.

    I was afraid to delete any code or variables that used for the Wheel because I already made a mess, so I just disabled them for now, I think it can be a REALLY short code with the RGB Gradient box compare to the wheel.

    If you'll have a look, please feel free to mess around or delete anything that related to the Wheel code:

    DOWNLOAD C3 File Here

    Thanks ahead for any help!

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)