Synthasmagoria/snths_ui
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Element proc and user handled focus

Browse source
This commit is contained in:
Synthasmagoria 2026-08-01 12:59:53 +02:00
commit 8dfa484cdc
2 changed files with 37 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

31
example/main.odin
View file

@ -56,6 +56,7 @@ main :: proc() {
button_config := ui.ElementConfiguration {margin = {4.0, 4.0}}
button_margin_value_string_x := cstring(make([^]u8, INPUT_FLOAT_CHARACTERS))
button_margin_value_string_y := cstring(make([^]u8, INPUT_FLOAT_CHARACTERS))
element_focus_id := ui.element_id_invalid()
for !rl.WindowShouldClose() {
ui.start(&ctx, origin = {0, 0}, size = {WINDOW_WIDTH, WINDOW_HEIGHT})
@ -64,7 +65,7 @@ main :: proc() {
for j in 0..<10 {
config := button_config
config.label = fmt.ctprintf("%d", i * 10 + j)
ui.button(dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(1.0)}, config = config)
ui.element(.Button, dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(1.0)}, config = config)
ui.same_line()
}
ui.container_end()
@ -76,14 +77,14 @@ main :: proc() {
for j in 0..<10 {
config := button_config
config.label = fmt.ctprintf("%d", 70 + j)
ui.button(dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(0.5)}, config = config)
ui.element(.Button, dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(0.5)}, config = config)
ui.same_line()
}
ctx.same_line = false
for j in 0..<10 {
config := button_config
config.label = fmt.ctprintf("%d", 80 + j)
ui.button(dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(0.5)}, config = config)
ui.element(.Button, dimensions = {ui.Size_Pixels(64.0), ui.Size_Percentage(0.5)}, config = config)
ui.same_line()
}
ui.container_end()
@ -92,7 +93,7 @@ main :: proc() {
for j in 0..<10 {
config := button_config
config.label = fmt.ctprintf("%d", 90 + j)
ui.button(dimensions = {ui.Size_Percentage(0.1), ui.Size_Percentage(1.0)}, config = config)
ui.element(.Button, dimensions = {ui.Size_Percentage(0.1), ui.Size_Percentage(1.0)}, config = config)
ui.same_line()
}
ui.container_end()
@ -102,7 +103,7 @@ main :: proc() {
defer rl.EndDrawing()
rl.ClearBackground(rl.BLACK)
render_ui_elements(&ctx, elements)
render_ui_elements(&ctx, &element_focus_id, elements)
ui.start(&ctx, {0, 0}, {WINDOW_WIDTH, WINDOW_HEIGHT})
config := ui.ElementConfiguration{margin = V2_ONE * 4, padding = V2_ONE * 4, color = ui.col(rl.MAGENTA)}
@ -118,10 +119,10 @@ main :: proc() {
debug_elements := ui.end()
if rl.IsKeyPressed(.TAB) {
ui.focus_next_element(&ctx, {.InputFloat})
element_focus_id = ui.focus_next_element(element_focus_id, {.InputFloat})
}
render_ui_elements(&ctx, debug_elements)
render_ui_elements(&ctx, &element_focus_id, debug_elements)
}
}
@ -131,11 +132,11 @@ ui_slider_2d :: proc(width, height: ui.Size_Percentage, config: ui.ElementConfig
data: ^UiElementData_Slider
data = new(UiElementData_Slider, allocator)
data^ = {value = &value.x, min = min, max = max}
ui.slider(dimensions, {margin = config.margin}, data)
ui.element(.Slider, dimensions, {margin = config.margin}, data)
ui.same_line()
data = new(UiElementData_Slider, allocator)
data^ = {value = &value.y, min = min, max = max}
ui.slider(dimensions, {margin = config.margin}, data)
ui.element(.Slider, dimensions, {margin = config.margin}, data)
ui.container_end()
return container
}
@ -146,20 +147,20 @@ ui_input_float_2d :: proc(width, height: ui.Size_Percentage, config: ui.ElementC
data: ^UiElementData_FloatInput
data = new(UiElementData_FloatInput, allocator)
data^ = {value_string = value_string_x, value = &value.x}
ui.input_float(dimensions, {margin = config.margin}, data)
ui.element(.InputFloat, dimensions, {margin = config.margin}, data)
ui.same_line()
data = new(UiElementData_FloatInput, allocator)
data^ = {value_string = value_string_x, value = &value.x}
ui.input_float(dimensions, {margin = config.margin}, data)
ui.element(.InputFloat, dimensions, {margin = config.margin}, data)
ui.container_end()
return container
}
render_ui_elements :: proc(ctx: ^ui.Context, elements: []ui.Element) {
render_ui_elements :: proc(ctx: ^ui.Context, focus_element_id: ^ui.ElementId, elements: []ui.Element) {
for element in elements {
area := rl.Rectangle(element.area)
switch element.type {
#partial switch element.type {
case .Container:
dim := rl.Color {0, 0, 0, 192}
if element.data != nil {
@ -191,8 +192,8 @@ render_ui_elements :: proc(ctx: ^ui.Context, elements: []ui.Element) {
rl.GuiSlider(area, "", "", data.value, data.min, data.max)
case .InputFloat:
data := cast(^UiElementData_FloatInput)element.data
if rl.GuiValueBoxFloat(area, element.label, data.value_string, data.value, ui.is_element_focused(ctx, element)) == 1 {
ui.focus_element(ctx, element)
if rl.GuiValueBoxFloat(area, element.label, data.value_string, data.value, element.id == focus_element_id^) == 1 {
focus_element_id^ = element.id
}
}
}