or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

Files

docs

drawing.mdindex.mdinput.mdintegrations.mdlayout.mdmenus.mdstyling.mdtables.mdtabs.mdwidgets.mdwindows.md

tabs.mddocs/

0

# Tabs

1

2

Tab bar system for organizing content into multiple views with support for reordering, closing, and dynamic tab management. The tab system provides an intuitive way to manage multiple panels or documents within a single window interface.

3

4

## Capabilities

5

6

### Tab Bar Management

7

8

Core functions for creating and managing tab bar containers.

9

10

```python { .api }

11

def begin_tab_bar(identifier: str, flags: int = 0) -> bool:

12

"""Begin tab bar. Returns True if tab bar is visible."""

13

14

def end_tab_bar() -> None:

15

"""End tab bar."""

16

```

17

18

### Tab Item Management

19

20

Functions for creating individual tabs within a tab bar.

21

22

```python { .api }

23

def begin_tab_item(label: str, opened: bool = None, flags: int = 0) -> tuple[bool, bool]:

24

"""Begin tab item. Returns (is_selected, is_open)."""

25

26

def end_tab_item() -> None:

27

"""End tab item."""

28

29

def tab_item_button(label: str, flags: int = 0) -> bool:

30

"""Create a tab button (not selectable). Returns True when clicked."""

31

32

def set_tab_item_closed(tab_or_docked_window_label: str) -> None:

33

"""Close tab programmatically."""

34

```

35

36

### Tab Bar Flags

37

38

Constants for controlling tab bar behavior and appearance.

39

40

```python { .api }

41

TAB_BAR_NONE: int

42

TAB_BAR_REORDERABLE: int # Allow dragging tabs to reorder

43

TAB_BAR_AUTO_SELECT_NEW_TABS: int # Automatically select new tabs

44

TAB_BAR_TAB_LIST_POPUP_BUTTON: int # Disable tab list popup button

45

TAB_BAR_NO_CLOSE_WITH_MIDDLE_MOUSE_BUTTON: int # Disable middle mouse close

46

TAB_BAR_NO_TAB_LIST_SCROLLING_BUTTONS: int # Disable scrolling buttons

47

TAB_BAR_NO_TOOLTIP: int # Disable tooltips on tabs

48

TAB_BAR_FITTING_POLICY_RESIZE_DOWN: int # Resize tabs when they don't fit

49

TAB_BAR_FITTING_POLICY_SCROLL: int # Add scroll buttons when tabs don't fit

50

TAB_BAR_FITTING_POLICY_MASK: int

51

TAB_BAR_FITTING_POLICY_DEFAULT: int # Default fitting policy

52

```

53

54

### Tab Item Flags

55

56

Constants for controlling individual tab behavior.

57

58

```python { .api }

59

TAB_ITEM_NONE: int

60

TAB_ITEM_UNSAVED_DOCUMENT: int # Append '*' to title for unsaved

61

TAB_ITEM_SET_SELECTED: int # Make tab selected when created

62

TAB_ITEM_NO_CLOSE_WITH_MIDDLE_MOUSE_BUTTON: int # Disable middle mouse close

63

TAB_ITEM_NO_PUSH_ID: int # Don't call PushID/PopID

64

TAB_ITEM_NO_TOOLTIP: int # Disable tooltip for this tab

65

TAB_ITEM_NO_REORDER: int # Disable reordering this tab

66

TAB_ITEM_LEADING: int # Enforce tab position to left

67

TAB_ITEM_TRAILING: int # Enforce tab position to right

68

```

69

70

## Usage Examples

71

72

### Basic Tab Bar

73

74

```python

75

import imgui

76

77

# Simple tab bar with multiple tabs

78

if imgui.begin_tab_bar("MyTabBar"):

79

# Tab 1

80

selected, opened = imgui.begin_tab_item("Tab 1")

81

if selected:

82

imgui.text("Content of Tab 1")

83

imgui.button("Button in Tab 1")

84

imgui.end_tab_item()

85

86

# Tab 2

87

selected, opened = imgui.begin_tab_item("Tab 2")

88

if selected:

89

imgui.text("Content of Tab 2")

90

imgui.slider_float("Slider", 0.5, 0.0, 1.0)

91

imgui.end_tab_item()

92

93

# Tab 3

94

selected, opened = imgui.begin_tab_item("Tab 3")

95

if selected:

96

imgui.text("Content of Tab 3")

97

imgui.input_text("Input", "", 256)

98

imgui.end_tab_item()

99

100

imgui.end_tab_bar()

101

```

102

103

### Closeable Tabs

104

105

```python

106

# Tab bar with closeable tabs

107

tab_states = {

108

"Document 1": True,

109

"Document 2": True,

110

"Document 3": True,

111

}

112

113

if imgui.begin_tab_bar("DocumentTabs"):

114

# Create tabs for each open document

115

tabs_to_close = []

116

117

for tab_name, is_open in tab_states.items():

118

if is_open:

119

selected, still_open = imgui.begin_tab_item(tab_name, True)

120

121

if selected:

122

imgui.text(f"Content of {tab_name}")

123

imgui.text("This tab can be closed with the X button")

124

125

if imgui.button(f"Save {tab_name}"):

126

print(f"Saving {tab_name}")

127

128

imgui.end_tab_item()

129

130

# Track which tabs were closed

131

if not still_open:

132

tabs_to_close.append(tab_name)

133

134

# Remove closed tabs

135

for tab_name in tabs_to_close:

136

tab_states[tab_name] = False

137

138

imgui.end_tab_bar()

139

140

# Button to reopen closed tabs

141

if imgui.button("Reopen All Tabs"):

142

for tab_name in tab_states:

143

tab_states[tab_name] = True

144

```

145

146

### Reorderable Tabs

147

148

```python

149

# Tab bar with reorderable tabs

150

if imgui.begin_tab_bar("ReorderableTabs", imgui.TAB_BAR_REORDERABLE):

151

tab_names = ["Alpha", "Beta", "Gamma", "Delta"]

152

153

for tab_name in tab_names:

154

selected, opened = imgui.begin_tab_item(tab_name)

155

if selected:

156

imgui.text(f"Content of {tab_name}")

157

imgui.text("Drag tabs to reorder them")

158

imgui.end_tab_item()

159

160

imgui.end_tab_bar()

161

```

162

163

### Document-Style Tabs

164

165

```python

166

# Document tabs with unsaved indicators

167

documents = {

168

"main.py": {"modified": False, "content": "print('Hello World')"},

169

"utils.py": {"modified": True, "content": "def helper(): pass"},

170

"config.json": {"modified": True, "content": '{"key": "value"}'},

171

}

172

173

if imgui.begin_tab_bar("DocumentEditor"):

174

for doc_name, doc_info in documents.items():

175

# Use unsaved document flag if modified

176

flags = imgui.TAB_ITEM_UNSAVED_DOCUMENT if doc_info["modified"] else imgui.TAB_ITEM_NONE

177

178

selected, opened = imgui.begin_tab_item(doc_name, True, flags)

179

180

if selected:

181

imgui.text(f"Editing: {doc_name}")

182

183

# Simple text editor

184

changed, new_content = imgui.input_text_multiline(

185

"##editor", doc_info["content"], 1024, -1, 200

186

)

187

188

if changed:

189

doc_info["content"] = new_content

190

doc_info["modified"] = True

191

192

# Save button

193

if imgui.button("Save"):

194

doc_info["modified"] = False

195

print(f"Saved {doc_name}")

196

197

imgui.end_tab_item()

198

199

# Remove document if tab was closed

200

if not opened:

201

del documents[doc_name]

202

break # Break to avoid modifying dict during iteration

203

204

imgui.end_tab_bar()

205

```

206

207

### Tab Bar with Special Buttons

208

209

```python

210

# Tab bar with leading and trailing buttons

211

if imgui.begin_tab_bar("TabsWithButtons"):

212

# Leading button (always on the left)

213

if imgui.tab_item_button("+", imgui.TAB_ITEM_LEADING):

214

print("Add new tab")

215

216

# Regular tabs

217

tab_names = ["Home", "Settings", "About"]

218

219

for tab_name in tab_names:

220

selected, opened = imgui.begin_tab_item(tab_name)

221

if selected:

222

imgui.text(f"Content of {tab_name} tab")

223

imgui.end_tab_item()

224

225

# Trailing button (always on the right)

226

if imgui.tab_item_button("?", imgui.TAB_ITEM_TRAILING):

227

print("Show help")

228

229

imgui.end_tab_bar()

230

```

231

232

### Dynamic Tab Creation

233

234

```python

235

# Dynamic tab system

236

import time

237

238

tab_counter = 1

239

active_tabs = {}

240

241

if imgui.begin_tab_bar("DynamicTabs", imgui.TAB_BAR_AUTO_SELECT_NEW_TABS):

242

# Add new tab button

243

if imgui.tab_item_button("+"):

244

tab_id = f"Tab {tab_counter}"

245

active_tabs[tab_id] = {

246

"created_time": time.time(),

247

"content": f"Dynamic content for {tab_id}"

248

}

249

tab_counter += 1

250

251

# Display existing tabs

252

tabs_to_remove = []

253

254

for tab_id, tab_data in active_tabs.items():

255

selected, opened = imgui.begin_tab_item(tab_id, True)

256

257

if selected:

258

imgui.text(f"Tab ID: {tab_id}")

259

imgui.text(f"Created: {time.ctime(tab_data['created_time'])}")

260

imgui.text(tab_data["content"])

261

262

if imgui.button(f"Close {tab_id}"):

263

tabs_to_remove.append(tab_id)

264

265

imgui.end_tab_item()

266

267

if not opened:

268

tabs_to_remove.append(tab_id)

269

270

# Remove closed tabs

271

for tab_id in tabs_to_remove:

272

del active_tabs[tab_id]

273

274

imgui.end_tab_bar()

275

```

276

277

### Tab Bar with Fitting Policies

278

279

```python

280

# Tab bar that handles many tabs

281

many_tabs = [f"Tab {i+1}" for i in range(20)]

282

283

# Tab bar with scrolling when tabs don't fit

284

if imgui.begin_tab_bar("ScrollingTabs", imgui.TAB_BAR_FITTING_POLICY_SCROLL):

285

for tab_name in many_tabs:

286

selected, opened = imgui.begin_tab_item(tab_name)

287

if selected:

288

imgui.text(f"Content of {tab_name}")

289

imgui.text("There are many tabs - scroll to see them all")

290

imgui.end_tab_item()

291

292

imgui.end_tab_bar()

293

294

imgui.separator()

295

296

# Tab bar with resizing when tabs don't fit

297

if imgui.begin_tab_bar("ResizingTabs", imgui.TAB_BAR_FITTING_POLICY_RESIZE_DOWN):

298

for tab_name in many_tabs[:10]: # Show fewer tabs for resize example

299

selected, opened = imgui.begin_tab_item(tab_name)

300

if selected:

301

imgui.text(f"Content of {tab_name}")

302

imgui.text("Tabs resize to fit available space")

303

imgui.end_tab_item()

304

305

imgui.end_tab_bar()

306

```

307

308

### Programmatic Tab Control

309

310

```python

311

# Programmatic tab selection and closing

312

selected_tab = "Tab 1" # This would be maintained in your application state

313

314

if imgui.begin_tab_bar("ProgrammaticTabs"):

315

tab_names = ["Tab 1", "Tab 2", "Tab 3", "Tab 4"]

316

317

for tab_name in tab_names:

318

# Set selected flag for the chosen tab

319

flags = imgui.TAB_ITEM_SET_SELECTED if tab_name == selected_tab else imgui.TAB_ITEM_NONE

320

321

is_selected, opened = imgui.begin_tab_item(tab_name, True, flags)

322

323

if is_selected:

324

imgui.text(f"Content of {tab_name}")

325

326

# Buttons to programmatically switch tabs

327

for other_tab in tab_names:

328

if other_tab != tab_name:

329

if imgui.button(f"Go to {other_tab}"):

330

selected_tab = other_tab

331

332

imgui.end_tab_item()

333

334

imgui.end_tab_bar()

335

336

# Buttons to close tabs programmatically

337

imgui.text("Close tabs programmatically:")

338

for tab_name in tab_names:

339

if imgui.small_button(f"Close {tab_name}"):

340

imgui.set_tab_item_closed(tab_name)

341

imgui.same_line()

342

```