Help Detecting which Device a User is playing on

[SamsonXVI (Samson)]

My game has some issues with guis not scaling properly for smaller devices. I know how to correct this by script but don’t know how to detect when to set a certain scale. How can I detect if a player is on a Phone, Tablet, Desktop, or Console?

[wevetments]

Detecting device type is not really a reliable method to scale user interfaces. I’d recommend that you use the device screen emulator in studio to test interface sizes.

Scaling user interface elements can be done by setting the Scale and Offset property per ui element. Use the emulator mentioned above to tweak the scale to your heart’s desire.

However if you insist to detect device types, you can do so by using UserInputService and GuiService. Just note that you will have to create your own script that uses these services to detect the device type and results are not always gonna be accurate.

[SamsonXVI (Samson)]

Okay, is there a way to detect the max width and height of a screen then?

[XAXA]

It’s generally a bad idea to scale your UI based on device type. Scaling it based on screen size is probably smarter.

Relevant thread:

Is there a way to detect if a player is on a tablet or phone?

So I’m making a survival game, and I need to find out a most reliable way to get what device a player is on. I use MouseEnabled, but I need to know if the players are on a phone or tablet to size a frame’s template I have, or is there a way to make text without textscaled size to 14 if a player’s on a phone, otherwise 20?

Relevant request:

Device Type Detection

I’ve made a similar request in the past, but I’m coming back with a more refined request. Sometimes it can be very useful to tell what type of device a user is on (such as console, PC, mobile…). However, there is currently no way to explicitly check and see what device the user is on. And so game devs are forced to do hacky tricks to figure out what device the user might be on. I emphasize “might” because it is not a guarantee and there are holes in the logic. My proposal: Player.DeviceType …

[SamsonXVI (Samson)]

I tried doing this:

local UIS = game:GetService("UserInputService&quot")

local GuiService = game:GetService("GuiService")

if UIS.TouchEnabled and not UIS.KeyboardEnabled and not UIS.MouseEnabled

and not UIS.GamepadEnabled and not GuiService:IsTenFootInterface() then

script.Parent.Scale = .5

script.Parent.Parent.Position = UDim2.new (0.5, -197.5, .5, -100)

end

but now its small on tablets.

[XAXA]

@SamsonXVI

Okay, is there a way to detect the max width and height of a screen then?

workspace.CurrentCamera.ViewportSize Will get you the size of the window.

[wevetments]

To get the size of a player’s screen, you can use the Viewport Size property of the Camera. This may change for desktop users because they can resize the roblox client window.

[wevetments]

This is not the right way to scale user interfaces. If someone were to play your game on an iPhone and another on an iPad Pro, the iPhone user will have the correct Ui size but the iPad Pro user will have a small Ui size. UIS.TouchEnabled will return true on both devices because both are touch screen devices.

If you want your current scaling method to work, you need to use Camera.ViewportSize to measure the screen and set the scale accordingly. This is also the wrong way to scale user interfaces and requires a lot of work just for a simple job.

[wevetments]

Actually, if you give me a few minutes, I’ll show you the proper way to scale user interfaces.

[SamsonXVI (Samson)]

Im currently going through the grueling task of converting a detailed gui with pictures and text aligned in multiple places from offset+scale to just scale.

[OverHash]

The most common method amongst developers is this function

function getPlatform()

    if (GS:IsTenFootInterface()) then
        return "Console"
    elseif (UIS.TouchEnabled and not UIS.MouseEnabled) then
        return "Mobile"
    else
        return "Desktop"
    end
end

Source: @berezaa Warning regarding GameAnalytics SDK - #6 by berezaa

As for the question you have, You should not have to scale UI based off what device the user is on - it should work flawlessly out of the box if you have scaled correctly.

Use the Scale property when designing guis in about 90% of your usage. Use things like UITextSizeConstraint to ensure that text is not too big, and doesn’t look weird when using TextScaled. If you want to make stuff like a perfect box, use RelativeXX or RelativeYY for the SizeConstraint of the object in question

[wevetments]

Here we have a GUI on an iPhone 7 Plus

and here’s the same GUI on an iPad Pro

---

Both are about the same size and are in the very center of both screens. This is because the UI is using its Scale property to size itself and not the Offset. Scale will make sure that the UI will have the same size/position on whatever device it’s on.

This makes the UI Centered on all devices

This makes the UI the same Scale on all devices

Another important property is Anchor Point. UI elements’ anchor points are set to 0,0 by default, to properly position a UI element, the anchor point must be 0.5,0.5 and can be set in a script using Vector2.new(0.5,0.5)

---

When to use Offset you may ask?
Offset is usually used to set a minimum size for a UI element or for making minor adjustments.

---

But why can’t I set the scale using a script?
It’s not that you can’t, but it’s just not worth it. You should not rely on this method. Whatever Scale or Offset you have set on a UI element must work on all device screens and should not be changed at anypoint in-game, it’s just a matter of trial and error.