sircfenner / StudioComponents

React implementations of Roblox Studio components.
https://sircfenner.github.io/StudioComponents
MIT License
54 stars 16 forks source link

Support use in-game #49

Closed Nidoxs closed 3 months ago

Nidoxs commented 3 months ago

The StudioComponents library is an awesome set of React components for Roblox, but it'd be nice to be able to use in-game too!

I propose that the library checks the environment it is running in first before using things like Plugin and settings().Studio.

Approach for Implementation

If it's running in a game, it should use a module that stores the Studio theme colors (both light and dark). I need to use StudioComponents for something that will be running in real games instead of studio exclusively.

We only need to create the file for this once, so I wrote a script to scrape the theme colours like so:

local theme = {}

for _, styleGuideColor in Enum.StudioStyleGuideColor:GetEnumItems() do
    local guideColorData = {}
    for _, modifer in Enum.StudioStyleGuideModifier:GetEnumItems() do
        local color = settings().Studio.Theme:GetColor(styleGuideColor, modifer)
        local colorString = `{math.floor(color.R * 255)},{math.floor(color.G * 255)},{math.floor(color.B * 255)}`
        guideColorData[`Enum.StudioStyleGuideModifier.{modifer.Name}`] = "Color3.fromRGB(" .. colorString .. "),"
    end

    theme[`Enum.StudioStyleGuideColor.{styleGuideColor.Name}`] = guideColorData
end

print(theme)

It's hacky as you need to remove the quotation marks and table arrows from the studio output: image

But once that's done once, you need not do it again! image

This file can then be placed within the library's source and it can be used for when the library is used in-game.

The ThemeContext would require a slight change that returns a table with a mock GetColor method present for when the components are used in-game. That way no changes need to be made to the components and it's just a case of conditionally returning the right context value based on if we're in a plugin at the moment.

I've already done the work for this, so if it is something you're interested in supporting for StudioComponents let me know and I can make a pull request for it.

Nidoxs commented 3 months ago

Additionally, the useMouseIcon / PluginContext should use the UserInputService.MouseIcon when not running in a plugin.

Nidoxs commented 3 months ago

After further testing, it looks like this is not as straightforward. Roblox removes the StudioStyleGuideColor and StudioStyleGuideModifier enums when in a live game. This is still possible but more would need to be done.

Nidoxs commented 3 months ago

Closing for now, but this could be re-opened by others if they are interested.

sircfenner commented 3 months ago

Thanks for the comments and investigation. I think in-game use is out of scope and brings too many complications / potential future limitations on what we can do if we need to maintain in-game compatibility.