Gui Sizing issues with Frames & Buttons

Help and Feedback Scripting Support
1

I’ve been working on a slider for a color changer component for my game. I’ve noticed that different resolutions affect the way that UI elements are sized and this is rather expected. However, what I didn’t anticipate was that the sizing would have an effect on the button’s movement via position.

In-studio, since the screen size is far smaller, this works rather perfectly. But, when I go in-game where the screen is much bigger, I noticed that the distance the button goes is approximately half the distance it should be going.

I’ve narrowed it down to my declaration of currentValue.

round(math.clamp((Input.Position.XsliderContainer:WaitForChild(currentSlider).AbsolutePosition.X),0,255))

I’m aware that 255 is a Gui’s offset changes per screen size and that the value is not constant. But, I don’t see any other viable way. One method I had was to multiply the currentValue by a factor of 2 for position while the actual value would be currentValue/2. I found this method to be rather one-case where the only singular case would solve for my screen size but not everyone else.

Another method could be to find the max offset of the bar, but I’m not entirely sure how to do that or how to get a valid value within the 0 - 255 range.

-- Local script

-- UserInputService.Changed Event
-- Round(x) is defined above and utilizes Kenetec's Solution
if ((not gameProcessed) and draggingSlider) and currentSlider ~= nil then
   if Input.UserInputType == Enum.UserInputType.MouseMovement then
      local currentValue = round(math.clamp((Input.Position.XsliderContainer:WaitForChild(currentSlider).AbsolutePosition.X),0,255))
      local FinalPosition = UDim2.new(0,(currentValue),-0.99,0)
      sliderContainer:WaitForChild(currentSlider).SliderButton:TweenPosition(FinalPosition,Enum.EasingDirection.InOut,Enum.EasingStyle.Linear,0.1,true)
      colorValues[sliderContainer:WaitForChild(currentSlider).SliderButton.Value.Value] = currentValue
   end
end

Appreciate any help.

2

For anyone who’s interested.

Convert Offset to Scale.

math.clamp((Input.Position.X-sliderContainer:WaitForChild(currentSlider).AbsolutePosition.X)/(sliderContainer:WaitForChild(currentSlider).AbsoluteSize.X),0,1)

Full thing.

-- Local script

-- UserInputService.Changed Event
-- Round(x) is defined above and utilizes Kenetec's Solution
if ((not gameProcessed) and draggingSlider) and currentSlider ~= nil then
   if Input.UserInputType == Enum.UserInputType.MouseMovement then
      local currentValue = math.clamp((Input.Position.X-sliderContainer:WaitForChild(currentSlider).AbsolutePosition.X)/(sliderContainer:WaitForChild(currentSlider).AbsoluteSize.X),0,1)
      local FinalPosition = UDim2.new(0,(currentValue),-0.99,0)
      sliderContainer:WaitForChild(currentSlider).SliderButton:TweenPosition(FinalPosition,Enum.EasingDirection.InOut,Enum.EasingStyle.Linear,0.1,true)
      colorValues[sliderContainer:WaitForChild(currentSlider).SliderButton.Value.Value] = currentValue
   end
end

-- Scale to 255
currentValue*(sliderContainer:WaitForChild(currentSlider).AbsoluteSize.X)
1 Like