Basalt2/docs/references/elements/TabControl.md

TabControl

The TabControl is a container that provides tabbed interface functionality

Extends: Container

Examples (Executable)

local basalt = require("basalt")

local main = basalt.getMainFrame()

-- Create a simple TabControl
local tabControl = main:addTabControl({
x = 2,
y = 2,
width = 46,
height = 15,
})

-- Tab 1: Home
local homeTab = tabControl:newTab("Home")

homeTab:addLabel({
x = 2,
y = 2,
text = "Welcome!",
foreground = colors.yellow
})

homeTab:addLabel({
x = 2,
y = 4,
text = "This is a TabControl",
foreground = colors.white
})

homeTab:addLabel({
x = 2,
y = 5,
text = "example with tabs.",
foreground = colors.white
})

-- Tab 2: Counter
local counterTab = tabControl:newTab("Counter")

local counterLabel = counterTab:addLabel({
x = 2,
y = 2,
text = "Count: 0",
foreground = colors.lime
})

local count = 0
counterTab:addButton({
x = 2,
y = 4,
width = 12,
height = 3,
text = "Click Me",
background = colors.blue
})
:setBackgroundState("clicked", colors.lightBlue)
:onClick(function()
count = count + 1
counterLabel:setText("Count: " .. count)
end)

-- Tab 3: Info
local infoTab = tabControl:newTab("Info")

infoTab:addLabel({
x = 2,
y = 2,
text = "TabControl Features:",
foreground = colors.orange
})

infoTab:addLabel({
x = 2,
y = 4,
text = "- Horizontal tabs",
foreground = colors.gray
})

infoTab:addLabel({
x = 2,
y = 5,
text = "- Easy navigation",
foreground = colors.gray
})

infoTab:addLabel({
x = 2,
y = 6,
text = "- Content per tab",
foreground = colors.gray
})

basalt.run()

Properties

Property	Type	Default	Description
activeTab	number	nil	The currently active tab ID
tabHeight	number	1	Height of the tab header area
tabs	table	{}	List of tab definitions
headerBackground	color	gray	Background color for the tab header area
activeTabBackground	color	white	Background color for the active tab
activeTabTextColor	color	black	Foreground color for the active tab text
scrollableTab	boolean	false	Enables scroll mode for tabs if they exceed width
tabScrollOffset	number	0	Current scroll offset for tabs in scrollable mode

Functions

Method	Returns	Description
TabControl:newTab	table	Creates a new tab handler proxy
TabControl:setTab	TabControl	Sets an element to belong to a specific tab
TabControl:addElement	table	Adds an element to the TabControl and assigns it to the active tab
TabControl:setActiveTab	-	Sets the active tab
TabControl:scrollTabs	TabControl	Scrolls the tab header left or right if scrollableTab is enabled
TabControl:setCursor	-	Sets the cursor position; accounts for tab header offset when delegating to parent

TabControl:newTab(title)

returns a proxy for adding elements to the tab

Parameters

• title string The title of the tab

Returns

• table tabHandler The tab handler proxy for adding elements to the new tab

TabControl:setTab(element, tabId)

Parameters

• element table The element to assign to a tab
• tabId number The ID of the tab to assign the element to

Returns

• TabControl self For method chaining

TabControl:addElement(elementType, tabId)

Parameters

• elementType string The type of element to add
• tabId number Optional tab ID, defaults to active tab

Returns

• table element The created element

TabControl:setActiveTab(tabId)

Parameters

• tabId number The ID of the tab to activate

TabControl:scrollTabs(direction)

Scrolls the tab header left or right if scrollableTab is enabled

Parameters

• direction number -1 to scroll left, 1 to scroll right

Returns

• TabControl self For method chaining

TabControl:setCursor()