UIStrokes Scaling made simple

[Yarik_superpro (Yarik)]

Yall all had an issue scaling UISrokes right?

Well for that i made a simple formula that will let you scale them properly
I were in need of scalable Border/UIStroke/RichText and i decided to mess around with formulas and somehow managed to find a working method.

If you want short simple answer here is the formula:

local size = 50
local ViewPort = workspace.CurrentCamera.ViewportSize
math.min(ViewPort.X,ViewPort.Y)/ViewPort.Y *size

How does it work?
It works similar to UIAspectRatioConstraint
If X is bigger than Y then we round it to Y and devide by Y and multiply by size
I haven’t found any tutorial like mine with this answer; It were either some meh UI bloatware frameworks or such plus they all were doing this simple thing WRONG.
Funny how i figured out answer randomly

UPDATE:

Hower i just made another formula (with ChatGPT’s help this time) that works similarly and fully replicates UIAspectRatioConstraint
IF YOUR UISTROKE DOESNT USE UIAspectRatioConstraint THEN USE PREVIOUS FORMULA!

--Tips:
	--1920/1080 = 1.7777777777777777 Ratio
	--Ratio*Y = X
	--X/Ratio = Y
local size = 50
local ViewPort = workspace.CurrentCamera.ViewportSize
local Ratio = Vector2.new(1080, 1080) -- `UIAspectRatioConstraint`'s Ratio would be 1
local Scaled = ((ViewPort.X/ViewPort.Y>Ratio.X/Ratio.Y and ViewPort.Y/Ratio.Y) or ViewPort.X / Ratio.X) *size

Goodluck!

[FinsterHorizon (finsterdev)]

Is this for like, when it’s on a BillboardGUI?

[Yarik_superpro (Yarik)]

No.
Only for 2D.
It is very expensive for 3D; Consider stacking UI Objects ontop of each other for this effect/canvas groups

[JAcoboiskaka1121 (Skellyton)]

@Yarik_superpro

I haven’t found any tutorial like mine with this answer

UIStrokeAdjuster - Properly scale your UIStrokes!

PROBLEM Simply…UISTROKES ARE THE PROBLEM! After its release, there have been many complications using UIStroke in projects. UIStrokes don’t properly scale relative to screen resolution (devices) nor relative to camera distance on BillboardGuis. To counter this issue, I created the “UIStrokeAdjuster” module! BEFORE UIStrokeAdjuster AFTER UIStrokeAdjuster SOLUTION Features Effectively uses CollectionService Automatically recursively tags ScreenGuis and BillboardGuis i…

How to scale UI Strokes across All Devices

Hello! My name is Caelm, and I am going to teach you how you can scale UIStrokes in these three easy steps! By using this tutorial, you can turn unintentional large UIStrokes on smaller devices into UIStrokes that look exactly the same on different screens! Step One Open Explorer, and find StarterGui. Add a ScreenGui into StarterGui. You can name this ScreenGui whatever you want, but I’m going to name mine UIStrokeScaler. [image] Step Two Inside your ScreenGui, you want to add a L…

UIStroke not scaled perfectly in different device

So I make a stats gui that look like this [image] In my screen (desktop) it looks good. But when I test it from mobile view, the UIStroke is not perfectly scaled like in the desktop view [image] is there any way to fix this?

Make UIStroke Responsive on All Screen Size

Hi UIStroke is now live but the Thickness property accepts a number instead of UDim and with that it’s rather difficult to make it responsive. If you apply a UIStroke to a button and set the Thickness to 5 this is how it will look on a 1920x1080 resolution screen: [image] while it looks like this on the 667x375 screen [image] finally, this is how it looks like in studio [image] pretty big difference, we can make all of them look like the one in studio with some code though. I’ve decide…

Its not new, and most of them work, especially the last one i linked. which I use personally.

[Yarik_superpro (Yarik)]

The problem with them is they simply don’t work as promised.
While they may do work but the point with Thickness is to shrink it down incase it covers your screen.
All they did is devide it by 2?(that stuipid) or do some weird/scary calculations
In other words complete misunderstanding on how screen resolutions work.
Hower im gonna be honest UIStrokeAdjuster - Properly scale your UIStrokes! did it probably the closest; yet still failed with some weird “Studio Resolution” constants.
You still haven’t provided any argument of them doing it right
Also my tutorial is right to the point with formula and not some annoying UI frameworks.
Dont want to look egoistical but please lets be honest here.

[JAcoboiskaka1121 (Skellyton)]

@Yarik_superpro

The problem with them is they simply don’t work as promised.

Wdym?? I usually use the last one, and it works perfectly on everything.

@Yarik_superpro

All they did is devide it by 2?(that stuipid) or do some weird/scary calculations

Kinda, but it works, thats what matters.

If you call these scary calculations, you havent seen scary calculations:

local studioAverage = (STUDIO_SCREEN_SIZE.X + STUDIO_SCREEN_SIZE.Y) / 2
local currentScreenAverage = (camera.ViewportSize.X + camera.ViewportSize.Y) / 2
local scaleFactor = currentScreenAverage / studioAverage

@Yarik_superpro

You still haven’t provided any argument of them doing it right

Wdym? go test out one of these, or if you’re to lazy, try the last one i linked. They work. And if it works, why reinvent the wheel? I dont think they are doing anything inherently wrong.

@Yarik_superpro

Also my tutorial is right to the point with formula

So are all of the ones I linked, you just have to do some digging, people still have to implement yours and make it work, unlike the last one i linked which literally has 2 solutions.

@Yarik_superpro

please lets be honest here.

I kinda am?? do some digging before posting something.

[SomeFedoraGuy (octav)]

@Yarik_superpro

It is very expensive for 3D

It is?

[Yarik_superpro (Yarik)]

(post deleted by author)

[Yarik_superpro (Yarik)]

Billboard GUIs are more specific when it comes to that.
I recomend you to use frames as outline in this case.

[JAcoboiskaka1121 (Skellyton)]

@Yarik_superpro

That cringe.

Im sorry, but now you are really sounding narcissistic.

@Yarik_superpro

It doesnt even work properly.

It does.

@Yarik_superpro

but you cant even explain nor understand how your methods work.

Neither do you?

@Yarik_superpro

and multiply by size

what is size? oh right, you didnt explain, yet you judge me, just wow.

@Yarik_superpro

You make code DEPANDANT on constants hower that not how resolution really works.

my code is not dependant on constraints, im not using UIAspectRatioConstraint, just GuiObjects with scale instead of offset.

@Yarik_superpro

Lets assume i get a ultra wide monitor how will your devided by 2 act?

Pretty well, i would say… Even though these do not exist(i tried something close 100x1000 you mentioned in your post.)

@Yarik_superpro

Right it will make it either super thin or super bold

It doesnt, stop assuming nonsense when you havent tried anything i have linked above.

@Yarik_superpro

“Kinda, but it works, thats what matters.”
Epic argument bro

LMAOOO, again, these are simple solutions, not need to overcomplicate this. And that is what matters, if it works, it works, I don’t see why you would have to change something if it works.

@Yarik_superpro

By scary calculations i mean complete uneducation on Screen resolutions and hell to see code

What is “complete uneducation on Screen Resolutions” and “hell to see code”?? now you’re just blabbering.

The code I provided is not hard to read, like, at all. A scripter with basic understanding of syntax and math will be able to understand the code, so its not “hell to see”.

@Yarik_superpro

Also please read my post again it tries to replicate behavior of UIAspectRatioConstraint full stop!

This is what any of the posts I linked above do, “full stop!”

Don’t post something that has already been solved, no point.
Also learn some proper grammar and spelling, i had a “hell” of a time reading what you wrote.

Or just use your countries side of the forum, theres Spanish(theres more, I just know theres a spanish one), if that works better for you.

[Yarik_superpro (Yarik)]

Ok i made another method for scaling
Better than first one if you combine that with UIAspectRatioConstraint
For rest i would still use first method as since it is more simple and looks better on regular non UIAspectRatioConstraint scaled GUI