8.19.51. Icons
imgui_icons is an asset-free vector icon set: every glyph is geometry drawn
straight onto the ImGui draw list — no SVG, no texture atlas, no font merge.
Glyphs are authored on a logical 24x24 grid and tinted from the daslang amber
accent, so they scale to any size and follow the theme. Two entry points:
icon_button(IDENT, (glyph = "play", tip = "Play"))— a clickable, themed icon button. It usesClickStatelike any button (state.click_countaccumulates, snapshot kindicon_button), and a non-emptytipshows a hover tooltip.icon("waveform", 24.0f)— draw a glyph at the cursor with no interaction, then advance the cursor. Use it for inline chrome, status rows, or labels.
Glyphs are addressed by name. The whole set is enumerable with icon_count()
/ icon_name(i) / icon_category(i) — enough to build an in-app icon
picker. The full visual catalog (every glyph, by category) is the
Icon set reference page.
Source: modules/dasImgui/examples/tutorial/icons.das.
8.19.51.1. Walkthrough
1options gen2
2options _comment_hygiene = true
3options gc
4
5require imgui
6require imgui_app
7require opengl/opengl_boost
8require live/glfw_live
9require live/live_api
10require live/live_commands
11require live/live_vars
12require live/opengl_live
13require live_host
14require imgui/imgui_live
15require imgui/imgui_boost_runtime
16require imgui/imgui_boost_v2
17require imgui/imgui_widgets_builtin
18require imgui/imgui_containers_builtin
19require imgui/imgui_visual_aids
20require imgui/imgui_icons
21
22// =============================================================================
23// TUTORIAL: imgui_icons — an asset-free vector icon set.
24//
25// Every glyph is geometry drawn straight onto the ImGui draw list (no SVG, no
26// texture atlas), tinted from the daslang amber accent. Two ways to use it:
27//
28// icon_button(IDENT, (glyph = "play", tip = "Play")) — a clickable, themed
29// icon button. Uses
30// ClickState like any
31// button; returns true
32// on click.
33// icon("waveform", 24.0f) — draw a glyph at the
34// cursor (no interaction)
35// and advance the cursor.
36//
37// Glyphs are addressed by name. Enumerate the whole set with icon_count() /
38// icon_name(i) / icon_category(i) — e.g. to build an icon picker. The full
39// catalog (with images) is in the docs: stdlib -> Builtin widgets -> Icon set.
40//
41// STANDALONE: daslang.exe modules/dasImgui/examples/tutorial/icons.das
42// LIVE: daslang-live modules/dasImgui/examples/tutorial/icons.das
43//
44// DRIVE (when running live):
45// curl -X POST -d '{"name":"imgui_click","args":{"target":"IC_WIN/IC_PLAY"}}' \
46// localhost:9090/command
47// =============================================================================
48
49[export]
50def init() {
51 live_create_window("dasImgui icons tutorial", 680, 560)
52 live_imgui_init(live_window)
53 var style & = unsafe(GetStyle())
54 style.FontScaleMain = 1.4f
55}
56
57[export]
58def update() {
59 if (!live_begin_frame()) return
60 begin_frame()
61
62 ImGui_ImplGlfw_NewFrame()
63 apply_synth_io_override()
64 NewFrame()
65
66 SetNextWindowPos(ImVec2(20.0f, 20.0f), ImGuiCond.Always)
67 SetNextWindowSize(ImVec2(640.0f, 520.0f), ImGuiCond.Always)
68 window(IC_WIN, (text = "icons tutorial", closable = false,
69 flags = ImGuiWindowFlags.None)) {
70
71 text("Vector icons drawn on the draw list - no atlas, no asset files.")
72 separator()
73
74 // ---- Stage 1: icon_button — a clickable transport bar ----
75 text(IC_HINT, (text = "icon_button: clickable, themed, addressed by glyph name."))
76 icon_button(IC_PLAY, (glyph = "play", tip = "Play")); same_line(IC_SL1)
77 icon_button(IC_PAUSE, (glyph = "pause", tip = "Pause")); same_line(IC_SL2)
78 icon_button(IC_STOP, (glyph = "stop", tip = "Stop")); same_line(IC_SL3)
79 icon_button(IC_REC, (glyph = "record", tip = "Record"))
80 text("clicks: play={IC_PLAY.click_count} pause={IC_PAUSE.click_count} stop={IC_STOP.click_count} rec={IC_REC.click_count}")
81 spacing()
82
83 // ---- Stage 2: tip + the rest of an edit toolbar ----
84 text(IC_HINT2, (text = "A non-empty tip shows a hover tooltip - hover any glyph."))
85 icon_button(IC_UNDO, (glyph = "undo", tip = "Undo")); same_line(IC_SL4)
86 icon_button(IC_REDO, (glyph = "redo", tip = "Redo")); same_line(IC_SL5)
87 icon_button(IC_CUT, (glyph = "cut", tip = "Cut")); same_line(IC_SL6)
88 icon_button(IC_SAVE, (glyph = "save", tip = "Save"))
89 spacing()
90 separator()
91
92 // ---- Stage 3: icon() — draw-only, any size ----
93 text(IC_DISP, (text = "icon(name, size): draw a glyph inline, no interaction. Sizes scale freely:"))
94 icon("waveform", 20.0f); same_line()
95 icon("waveform", 32.0f); same_line()
96 icon("waveform", 48.0f)
97 spacing()
98 text("The set spans transport, edit, mix, synth, scene and chrome glyphs:")
99 icon("filter", 28.0f); same_line()
100 icon("knob", 28.0f); same_line()
101 icon("wave-sine", 28.0f); same_line()
102 icon("layers", 28.0f); same_line()
103 icon("camera", 28.0f); same_line()
104 icon("gear", 28.0f)
105 spacing()
106 separator()
107
108 // ---- Stage 4: enumerate the catalog ----
109 text("icon_count()/icon_name(i)/icon_category(i) enumerate the set:")
110 text("{icon_count()} glyphs - e.g. [0] '{icon_name(0)}' in '{icon_category(0)}'.")
111 }
112
113 end_of_frame()
114 Render()
115 var w, h : int
116 live_get_framebuffer_size(w, h)
117 glViewport(0, 0, w, h)
118 glClearColor(0.10f, 0.10f, 0.12f, 1.0f)
119 glClear(GL_COLOR_BUFFER_BIT)
120 live_imgui_render()
121
122 live_end_frame()
123}
124
125[export]
126def shutdown() {
127 live_imgui_shutdown()
128 live_destroy_window()
129}
130
131[export]
132def main() {
133 init()
134 while (!exit_requested()) {
135 update()
136 maybe_collect_gc()
137 }
138 shutdown()
139}
8.19.51.1.1. Requires
imgui/imgui_icons— the icon set:icon,icon_button_draw, and the catalog accessors.imgui/imgui_widgets_builtin— theicon_button[widget](themed, snapshot-visible, playwright-drivable wrapper overicon_button_draw).
8.19.51.1.3. icon() — draw only
When there is nothing to click, icon draws a glyph inline:
icon("waveform", 20.0f); same_line()
icon("waveform", 32.0f); same_line()
icon("waveform", 48.0f)
Because the glyph is geometry (not a rasterized image), every size is crisp —
there is no atlas resolution to outgrow. icon advances the cursor by the
box size, so it lays out like any other item.
8.19.51.1.4. Enumerating the set
The catalog is data, so it is enumerable at runtime:
for (i in range(icon_count())) {
text("{icon_name(i)} ({icon_category(i)})")
}
This is how the documentation catalog page is generated, and it is the same loop you would write to populate an icon picker.