Color wheel on Mobile & PC - How to make it possible?

Simply said, I’m looking to make a color wheel for color picking. However, it is a lot easier to make something like that for PC players, but what about mobile?

How would I make a color wheel system compatible with both platforms?

Is it even possible? What methods could I use to achieve it? Has anyone ever tried this before?

Thanks!

1 Like

Yep. Someone already did a tutorial on how to make one as well.
https://devforum.roblox.com/t/making-a-circular-color-palette-gui/140643?u=ltb_killeru

3 Likes

Yeah. I did use MouseButton1Down for my old color wheel but it never functioned on mobile. Perhaps there’s a better approach, like an universal switch that corresponds on any type of a device?

Something like this is not what I imagined (having seen the UI, perhaps I’d have a better understanding of the end goal here)… Should it be a radial system like this, it would only require making use of TouchPan event:

2 Likes

I’ll take a look at it. Thanks!

Good idea, the tutorial @LtB_KiLLerU linked is a good start.

With the TouchPan event of buttons, you can figure out where they are moving their finger on a UI element. Try printing the outputs of the TouchPositions and such to get a feel for what the event is telling you about their touch input.

With a color picker system like in the one linked by LtB, that event would be the main functionality for mobile support.

1 Like

Perhaps I could try using MouseButton1Down again with a different approach or have like 2 modules: one for PC and one for mobile.

Thanks to both of you, I’ll be sure to test them out as soon as possible. :heart_eyes:

Well, actually. You can have a PC-Oriented setup like this:

local Mouse = Player:GetMouse() (for getting the position of the mouse)
(alternatively, use MouseMoved event)

Then, use MouseButton1Down to start tracking the mouse position, and selecting the color based on its position.
Once they release the mouse (MouseButton1Up), stop tracking the mouse position, and leave the color where it was when they released the button.

This sort of setup will actually work fine on mobile, but perhaps it’s best to use the Touch specific events. Although, the system I put above will work on both devices, with the same code.

1 Like