Skip to content

Commit dcdb7a6

Browse files
Colorpicker.UpdateOnChange (UpdateWhileSliding) (#18)
1 parent 30543a2 commit dcdb7a6

File tree

2 files changed

+105
-42
lines changed

2 files changed

+105
-42
lines changed

Example.client.luau

+15
Original file line numberDiff line numberDiff line change
@@ -167,6 +167,14 @@ local TColorpicker = Tabs.Main:Colorpicker("TransparencyColorpicker", {
167167
Default = Color3.fromRGB(96, 205, 255)
168168
})
169169

170+
local CColorpicker = Tabs.Main:Colorpicker("ChangeColorpicker", {
171+
Title = "Colorpicker",
172+
Description = "but it updates while you slide.",
173+
Transparency = 0,
174+
Default = Color3.fromRGB(96, 205, 255),
175+
UpdateOnChange = true
176+
})
177+
170178
local Keybind = Tabs.Main:Keybind("Keybind", {
171179
Title = "KeyBind",
172180
Mode = "Hold",
@@ -252,6 +260,13 @@ TColorpicker:OnChanged(function()
252260
)
253261
end)
254262

263+
CColorpicker:OnChanged(function()
264+
print(
265+
"CColorpicker changed:", CColorpicker.Value,
266+
"Transparency:", CColorpicker.Transparency
267+
)
268+
end)
269+
255270
Tabs.Main:Button{
256271
Title = "Really Really big Dropdown",
257272
Description = "",

src/Elements/Colorpicker.luau

+90-42
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ function Element:New(Idx, Config)
2424
local Colorpicker = {
2525
Value = Config.Default,
2626
Transparency = Config.Transparency or 0,
27+
UpdateOnChange = Config.UpdateOnChange or Config.UpdateWhileSliding or false,
2728
Type = "Colorpicker",
2829
Title = type(Config.Title) == "string" and Config.Title or "Colorpicker",
2930
Callback = Config.Callback or function(Color) end,
@@ -77,6 +78,8 @@ function Element:New(Idx, Config)
7778
local Hue, Sat, Vib = Colorpicker.Hue, Colorpicker.Sat, Colorpicker.Vib
7879
local Transparency = Colorpicker.Transparency
7980

81+
local OrigHue, OrigSat, OrigVib, OrigTransparency = Colorpicker.Hue, Colorpicker.Sat, Colorpicker.Vib, Colorpicker.Transparency
82+
8083
local function CreateInput()
8184
local Box = require(Components.Textbox)()
8285
Box.Frame.Parent = Dialog.Root
@@ -330,6 +333,10 @@ function Element:New(Idx, Config)
330333
TransparencyDrag.Position = UDim2.new(0, -1, 1 - Transparency, -6)
331334
AlphaInput.Input.Text = `{Library.Utilities:Round((1 - Transparency) * 100, 0)}%`
332335
end
336+
337+
if Colorpicker.UpdateOnChange then
338+
Colorpicker:SetValue({ Hue, Sat, Vib }, Transparency)
339+
end
333340
end
334341

335342
Creator.AddSignal(HexInput.Input.FocusLost, function(Enter)
@@ -395,59 +402,96 @@ function Element:New(Idx, Config)
395402
end)
396403
end
397404

405+
local function UpdateSatVib()
406+
local MinX = SatVibMap.AbsolutePosition.X
407+
local MaxX = MinX + SatVibMap.AbsoluteSize.X
408+
local MouseX = math.clamp(Mouse.X, MinX, MaxX)
409+
410+
local MinY = SatVibMap.AbsolutePosition.Y
411+
local MaxY = MinY + SatVibMap.AbsoluteSize.Y
412+
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
413+
414+
Sat = (MouseX - MinX) / (MaxX - MinX)
415+
Vib = 1 - ((MouseY - MinY) / (MaxY - MinY))
416+
Display()
417+
end
418+
419+
local function UpdateHue()
420+
local MinY = HueSlider.AbsolutePosition.Y
421+
local MaxY = MinY + HueSlider.AbsoluteSize.Y
422+
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
423+
424+
Hue = ((MouseY - MinY) / (MaxY - MinY))
425+
Display()
426+
end
427+
428+
local function UpdateTransparency()
429+
local MinY = TransparencySlider.AbsolutePosition.Y
430+
local MaxY = MinY + TransparencySlider.AbsoluteSize.Y
431+
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
432+
433+
Transparency = 1 - ((MouseY - MinY) / (MaxY - MinY))
434+
Display()
435+
end
436+
437+
local MouseMoveConnection
398438
Creator.AddSignal(SatVibMap.InputBegan, function(Input)
399-
if
400-
Input.UserInputType == Enum.UserInputType.MouseButton1
401-
or Input.UserInputType == Enum.UserInputType.Touch
402-
then
403-
while UserInputService:IsMouseButtonPressed(Enum.UserInputType.MouseButton1) do
404-
local MinX = SatVibMap.AbsolutePosition.X
405-
local MaxX = MinX + SatVibMap.AbsoluteSize.X
406-
local MouseX = math.clamp(Mouse.X, MinX, MaxX)
407-
408-
local MinY = SatVibMap.AbsolutePosition.Y
409-
local MaxY = MinY + SatVibMap.AbsoluteSize.Y
410-
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
411-
412-
Sat = (MouseX - MinX) / (MaxX - MinX)
413-
Vib = 1 - ((MouseY - MinY) / (MaxY - MinY))
414-
Display()
415-
416-
RenderStepped:Wait()
439+
if Input.UserInputType == Enum.UserInputType.MouseButton1
440+
or Input.UserInputType == Enum.UserInputType.Touch then
441+
442+
MouseMoveConnection = Mouse.Move:Connect(UpdateSatVib)
443+
UpdateSatVib()
444+
end
445+
end)
446+
447+
Creator.AddSignal(SatVibMap.InputEnded, function(Input)
448+
if Input.UserInputType == Enum.UserInputType.MouseButton1
449+
or Input.UserInputType == Enum.UserInputType.Touch then
450+
451+
if MouseMoveConnection then
452+
MouseMoveConnection:Disconnect()
453+
MouseMoveConnection = nil
417454
end
418455
end
419456
end)
420457

421458
Creator.AddSignal(HueSlider.InputBegan, function(Input)
422-
if
423-
Input.UserInputType == Enum.UserInputType.MouseButton1
424-
or Input.UserInputType == Enum.UserInputType.Touch
425-
then
426-
while UserInputService:IsMouseButtonPressed(Enum.UserInputType.MouseButton1) do
427-
local MinY = HueSlider.AbsolutePosition.Y
428-
local MaxY = MinY + HueSlider.AbsoluteSize.Y
429-
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
430-
431-
Hue = ((MouseY - MinY) / (MaxY - MinY))
432-
Display()
433-
434-
RenderStepped:Wait()
459+
if Input.UserInputType == Enum.UserInputType.MouseButton1
460+
or Input.UserInputType == Enum.UserInputType.Touch then
461+
462+
MouseMoveConnection = Mouse.Move:Connect(UpdateHue)
463+
UpdateHue()
464+
end
465+
end)
466+
467+
Creator.AddSignal(HueSlider.InputEnded, function(Input)
468+
if Input.UserInputType == Enum.UserInputType.MouseButton1
469+
or Input.UserInputType == Enum.UserInputType.Touch then
470+
471+
if MouseMoveConnection then
472+
MouseMoveConnection:Disconnect()
473+
MouseMoveConnection = nil
435474
end
436475
end
437476
end)
438477

439478
if Config.Transparency then
440479
Creator.AddSignal(TransparencySlider.InputBegan, function(Input)
441-
if Input.UserInputType == Enum.UserInputType.MouseButton1 then
442-
while UserInputService:IsMouseButtonPressed(Enum.UserInputType.MouseButton1) do
443-
local MinY = TransparencySlider.AbsolutePosition.Y
444-
local MaxY = MinY + TransparencySlider.AbsoluteSize.Y
445-
local MouseY = math.clamp(Mouse.Y, MinY, MaxY)
446-
447-
Transparency = 1 - ((MouseY - MinY) / (MaxY - MinY))
448-
Display()
480+
if Input.UserInputType == Enum.UserInputType.MouseButton1
481+
or Input.UserInputType == Enum.UserInputType.Touch then
482+
483+
MouseMoveConnection = Mouse.Move:Connect(UpdateTransparency)
484+
UpdateTransparency()
485+
end
486+
end)
449487

450-
RenderStepped:Wait()
488+
Creator.AddSignal(TransparencySlider.InputEnded, function(Input)
489+
if Input.UserInputType == Enum.UserInputType.MouseButton1
490+
or Input.UserInputType == Enum.UserInputType.Touch then
491+
492+
if MouseMoveConnection then
493+
MouseMoveConnection:Disconnect()
494+
MouseMoveConnection = nil
451495
end
452496
end
453497
end)
@@ -458,7 +502,11 @@ function Element:New(Idx, Config)
458502
Dialog:Button("Done", function()
459503
Colorpicker:SetValue({ Hue, Sat, Vib }, Transparency)
460504
end)
461-
Dialog:Button("Cancel")
505+
506+
Dialog:Button("Cancel", function()
507+
Colorpicker:SetValue({ OrigHue, OrigSat, OrigVib }, OrigTransparency)
508+
end)
509+
462510
Dialog:Open()
463511
end
464512

@@ -524,4 +572,4 @@ function Element:New(Idx, Config)
524572
})
525573
end
526574

527-
return Element
575+
return Element

0 commit comments

Comments
 (0)