Link to docs
I'm skid 😧😲

RayUI Interface Suite

This is the written documentation for RayUI Interface Suite

Last updated for the Beta 8 release

Booting the Library

local RayUI = loadstring(game:HttpGet('https://raw.githubusercontent.com/kaithub/RayUI/main/source'))()

Secure Mode

If the game you're trying to run RayUI Interface Suite on, is detecting or crashing when you use RayUI Interface Suite, try using Secure Mode:

• Place getgenv().SecureMode = true above the initial RayUI loadstring

RayUI will now use Secure Mode and attempt to reduce detection

• Note: This may cause some elements of the UI to look lower quality or may increase loading times slightly

Enabling Configuration Saving

• Enable ConfigurationSaving in the CreateWindow function
• Choose an appropiate FileName in the CreateWindow function
• Choose an unique flag identifier for each supported element you create
• Place RayUI:LoadConfiguration() at the bottom of all your code

RayUI will now automatically save and load your configuration

Creating a Window

local Window = RayUI:CreateWindow({
	Name = "RayUI Example Window",
	LoadingTitle = "RayUI Interface Suite",
	LoadingSubtitle = "by Kai/S",
	ConfigurationSaving = {
		Enabled = true,
		FolderName = nil, -- Create a custom folder for your hub/game
		FileName = "Big Hub"
	},
        Discord = {
        	Enabled = false,
        	Invite = "J2BD7rmjtc", -- The Discord invite code, do not include discord.gg/
        	RememberJoins = true -- Set this to false to make them join the discord every time they load it up
        },
	KeySystem = true, -- Set this to true to use our key system
	KeySettings = {
		Title = "Angel",
		Subtitle = "Key System",
		Note = "Join the discord (discord.gg/J2BD7rmjtc)",
		FileName = "AngelKey",
		SaveKey = true,
		GrabKeyFromSite = false, -- If this is true, set Key below to the RAW site you would like RayUI to get the key from
		Key = {"Hello"} -- List of keys that will be accepted by the system, can be RAW file links (pastebin, github etc) or simple strings ("hello","key22")
	}
})

Creating a Tab

local Tab = Window:CreateTab("Tab Example", 4483362458) -- Title, Image

Creating a Section

local Section = Tab:CreateSection("Section Example")

Updating a Section

Section:Set("Section Example")

Notifying the user

RayUI:Notify({
    Title = "Notification Title",
    Content = "Notification Content",
    Duration = 6.5,
    Image = 4483362458,
    Actions = { -- Notification Buttons
        Ignore = {
            Name = "Okay!",
            Callback = function()
                print("The user tapped Okay!")
            end
		},
	},
})

Creating a Button

local Button = Tab:CreateButton({
	Name = "Button Example",
	Callback = function()
		-- The function that takes place when the button is pressed
	end,
})

Updating a Button

Button:Set("Button Example")

Creating a Toggle

local Toggle = Tab:CreateToggle({
	Name = "Toggle Example",
	CurrentValue = false,
	Flag = "Toggle1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
	Callback = function(Value)
		-- The function that takes place when the toggle is pressed
    		-- The variable (Value) is a boolean on whether the toggle is true or false
	end,
})

Updating a Toggle

Toggle:Set(false)

Creating a Color Picker

local ColorPicker = Tab:CreateColorPicker({
    Name = "Color Picker",
    Color = Color3.fromRGB(255,255,255),
    Flag = "ColorPicker1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
    Callback = function(Value)
        -- The function that takes place every time the color picker is moved/changed
        -- The variable (Value) is a Color3fromRGB value based on which color is selected
    end
})

Updating a Color Picker

ColorPicker:Set(Color3.fromRGB(255,255,255)

Creating a Slider

local Slider = Tab:CreateSlider({
	Name = "Slider Example",
	Range = {0, 100},
	Increment = 10,
	Suffix = "Bananas",
	CurrentValue = 10,
	Flag = "Slider1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
	Callback = function(Value)
		-- The function that takes place when the slider changes
    		-- The variable (Value) is a number which correlates to the value the slider is currently at
	end,
})

Updating a Slider

Slider:Set(10) -- The new slider integer value

Creating a Label

local Label = Tab:CreateLabel("Label Example")

Updating a Label

Label:Set("Label Example")

Creating a Paragraph

local Paragraph = Tab:CreateParagraph({Title = "Paragraph Example", Content = "Paragraph Example"})

Updating a Paragraph

Paragraph:Set({Title = "Paragraph Example", Content = "Paragraph Example"})

Creating an Adaptive Input (TextBox)

local Input = Tab:CreateInput({
	Name = "Input Example",
	PlaceholderText = "Input Placeholder",
	RemoveTextAfterFocusLost = false,
	Callback = function(Text)
		-- The function that takes place when the input is changed
    		-- The variable (Text) is a string for the value in the text box
	end,
})

Updating an Adaptive Input (TextBox)

Input:Set("Random Input")

Creating a Keybind

local Keybind = Tab:CreateKeybind({
	Name = "Keybind Example",
	CurrentKeybind = "Q",
	HoldToInteract = false,
	Flag = "Keybind1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
	Callback = function(Keybind)
		-- The function that takes place when the keybind is pressed
    		-- The variable (Keybind) is a boolean for whether the keybind is being held or not (HoldToInteract needs to be true)
	end,
})

Updating a Keybind

Keybind:Set("RightCtrl") -- Keybind (string)

Creating a Dropdown menu

local Dropdown = Tab:CreateDropdown({
	Name = "Dropdown Example",
	Options = {"Option 1","Option 2"},
	CurrentOption = "Option 1",
	Flag = "Dropdown1", -- A flag is the identifier for the configuration file, make sure every element has a different flag if you're using configuration saving to ensure no overlaps
	Callback = function(Option)
	  	  -- The function that takes place when the selected option is changed
    	  -- The variable (Option) is a string for the value that the dropdown was changed to
	end,
})

Updating a Dropdown

Dropdown:Set("Option 2") -- The new option value

Check the value of an existing element

To check the current value of an existing element, using the variable, you can do ElementName.CurrentValue, if it's a keybind or dropdown, you will need to use KeybindName.CurrentKeybind or DropdownName.CurrentOption You can also check it via the flags from RayUI.Flags

Destroying the Interface

RayUI:Destroy()