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

Merge branch 'master' of https://offgrd.xyz/git/Synthasmagoria/snths_ui

Browse source
This commit is contained in:
Synthasmagoria 2026-07-29 14:05:18 +02:00
commit 22388a01c3
2 changed files with 98 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

29
example/main.odin
View file

@ -19,7 +19,7 @@ main :: proc() {
ui.init(&ctx, 4000) ui.init(&ctx, 4000)
for !rl.WindowShouldClose() { for !rl.WindowShouldClose() {
ui.start(&ctx, {0, 0}) ui.start(&ctx, {0, 0}, {WINDOW_WIDTH, WINDOW_HEIGHT})
ui.container_begin( ui.container_begin(
dimensions = {ui.Size_Pixels(WINDOW_WIDTH), ui.Size_Pixels(WINDOW_HEIGHT)}, dimensions = {ui.Size_Pixels(WINDOW_WIDTH), ui.Size_Pixels(WINDOW_HEIGHT)},
config = { config = {
@ -29,16 +29,23 @@ main :: proc() {
label = "", label = "",
}, },
) )
ui.container_begin( ui.container_begin(
dimensions = {ui.Size_Percentage(1.0), ui.Size_Percentage(0.1)}, dimensions = {ui.Size_Percentage(1.0), ui.Size_Percentage(0.1)},
config = { config = {
margin = {0.0, 0.0}, color = cast([4]u8)rl.GREEN,
padding = {0.0, 0.0}, label = "",
color = cast([4]u8)rl.GREEN, },
label = "", )
}, ui.container_end()
) ui.container_begin(
ui.container_end() dimensions = {ui.Size_Percentage(1.0), ui.Size_Percentage(0.1)},
config = {
color = cast([4]u8)rl.GREEN,
label = "",
margin = {0.0, 4.0},
},
)
ui.container_end()
ui.container_end() ui.container_end()
elements := ui.end() elements := ui.end()

131
ui.odin
View file

@ -3,28 +3,26 @@ package synthas_ui
v2 :: [2]f32 v2 :: [2]f32
rect2 :: struct {x, y, width, height: f32} rect2 :: struct {x, y, width, height: f32}
@private rect_get_tl :: #force_inline proc(rect: rect2) -> v2 {return {rect.x, rect.y}} rect_get_tl :: #force_inline proc(rect: rect2) -> v2 {return {rect.x, rect.y}}
@private rect_get_tr :: #force_inline proc(rect: rect2) -> v2 {return {rect.x + rect.width, rect.y}} rect_get_tr :: #force_inline proc(rect: rect2) -> v2 {return {rect.x + rect.width, rect.y}}
@private rect_get_br :: #force_inline proc(rect: rect2) -> v2 {return {rect.x + rect.width, rect.y + rect.height}} rect_get_br :: #force_inline proc(rect: rect2) -> v2 {return {rect.x + rect.width, rect.y + rect.height}}
@private rect_get_bl :: #force_inline proc(rect: rect2) -> v2 {return {rect.x, rect.y + rect.height}} rect_get_bl :: #force_inline proc(rect: rect2) -> v2 {return {rect.x, rect.y + rect.height}}
@private rect_grow :: proc(rect: rect2, amount: v2) -> rect2 { rect_grow :: proc(rect: rect2, amount: v2) -> rect2 {
return {rect.x - amount.x / 2.0, rect.y - amount.y / 2.0, rect.width + amount.x, rect.height + amount.y} return {rect.x - amount.x / 2.0, rect.y - amount.y / 2.0, rect.width + amount.x, rect.height + amount.y}
} }
@private ctx: ^Context ctx: ^Context
Context :: struct { Context :: struct {
element_position: v2, origin: v2,
container_stack: [dynamic]^Element, containers: [dynamic]int,
container_last_element: [dynamic]int,
elements: [dynamic]Element, elements: [dynamic]Element,
same_line: bool, same_line: bool,
} }
init :: proc(state: ^Context, element_capacity: int, allocator := context.allocator) { CONTAINER_STACK_SIZE :: 16
state.container_stack = make(type_of(state.container_stack), 0, 8, allocator)
state.elements = make(type_of(state.elements), 0, element_capacity, allocator)
}
Element :: struct { Element :: struct {
area: rect2, area: rect2,
@ -59,14 +57,32 @@ Dimensions :: struct {
Axis :: enum {X, Y} Axis :: enum {X, Y}
start :: proc(ui_context: ^Context, position: v2) { init :: proc(state: ^Context, element_capacity: int, allocator := context.allocator) {
state.containers = make(type_of(state.containers), 0, CONTAINER_STACK_SIZE, allocator)
state.container_last_element = make(type_of(state.container_last_element), 0, CONTAINER_STACK_SIZE, allocator)
state.elements = make(type_of(state.elements), 0, element_capacity, allocator)
}
start :: proc(ui_context: ^Context, origin: v2, size: v2) {
ctx = ui_context ctx = ui_context
ctx.element_position = position ctx.origin = origin
clear(&ctx.container_stack)
clear(&ctx.elements) clear(&ctx.elements)
clear(&ctx.containers)
clear(&ctx.container_last_element)
append(&ctx.elements, Element{
area = {**origin, **size},
label = "",
color = {0, 0, 0, 0},
margin = {},
padding = {},
type = .Container})
append(&ctx.containers, 0)
append(&ctx.container_last_element, -1)
} }
end :: proc() -> []Element { end :: proc() -> []Element {
assert(len(ctx.containers) < 2, "Didn't close all containers before ending UI layout mode")
assert(len(ctx.containers) > 0, "Closed base container before ending UI layout mode")
elements := ctx.elements[:] elements := ctx.elements[:]
ctx = nil ctx = nil
return elements return elements
@ -76,51 +92,64 @@ same_line :: proc() {
ctx.same_line = true ctx.same_line = true
} }
element_get_outer_area :: proc(element: Element) -> rect2 {
return rect_grow(element.area, element.margin * 2.0)
}
element_get_inner_area :: proc(element: Element) -> rect2 {
return rect_grow(element.area, -element.padding * 2.0)
}
container_begin :: proc(dimensions: Dimensions, config: ElementConfiguration) { container_begin :: proc(dimensions: Dimensions, config: ElementConfiguration) {
ctx.element_position += config.margin area := _resolve_element_area(dimensions, config.margin)
size := _resolve_dimensions(dimensions) - config.margin * 2.0
area := rect2{**ctx.element_position, **size}
ctx.element_position += config.padding
element := Element{area = area, config = config, type = .Container} element := Element{area = area, config = config, type = .Container}
append(&ctx.elements, element) _append_element(element)
container := _element_last() container_index := len(ctx.elements) - 1
append(&ctx.container_stack, container) append(&ctx.containers, container_index)
append(&ctx.container_last_element, -1)
} }
container_end :: proc() { container_end :: proc() {
container := pop(&ctx.container_stack) container := ctx.elements[pop(&ctx.containers)]
pop(&ctx.container_last_element)
// TODO: Set flex // TODO: Set flex
outer := element_get_outer_area(container^) outer := _get_element_outer_area(container)
ctx.element_position = rect_get_bl(outer)
} }
button :: proc(dimensions: Dimensions) { button :: proc(dimensions: Dimensions) {
area := _context_advance_area(dimensions)
} }
_context_advance_area :: proc(dimensions: Dimensions) -> rect2 { _append_element :: proc(element: Element) {
return {} append(&ctx.elements, element)
ctx.container_last_element[len(ctx.containers) - 1] = len(ctx.elements) - 1
} }
_resolve_dimensions :: proc(dimensions: Dimensions) -> v2 { _get_element_outer_area :: proc(element: Element) -> rect2 {
return {_resolve_size(dimensions.width, .X), _resolve_size(dimensions.height, .Y)} return rect_grow(element.area, element.margin * 2.0)
} }
_resolve_size :: proc(size: Size, axis: Axis) -> f32 { _get_element_inner_area :: proc(element: Element) -> rect2 {
return rect_grow(element.area, -element.padding * 2.0)
}
_resolve_element_area :: proc(dimensions: Dimensions, margin: v2) -> rect2 {
outer_position := _resolve_element_outer_position()
outer_size := _resolve_element_outer_size(dimensions)
outer_area := rect2{**outer_position, **outer_size}
return rect_grow(outer_area, -margin * 2.0)
}
_resolve_element_outer_position :: proc() -> v2 {
if alignment_element := _element_container_previous(); alignment_element != nil {
return rect_get_bl(_get_element_inner_area(alignment_element^))
}
return rect_get_tl(_get_element_inner_area(_element_previous()^))
}
_resolve_element_outer_size :: proc(dimensions: Dimensions) -> v2 {
return {_resolve_elemment_outer_size_axis(dimensions.width, .X), _resolve_elemment_outer_size_axis(dimensions.height, .Y)}
}
_resolve_elemment_outer_size_axis :: proc(size: Size, axis: Axis) -> f32 {
switch value in size { switch value in size {
case Size_Pixels: case Size_Pixels:
return cast(f32)value return cast(f32)value
case Size_Percentage: case Size_Percentage:
if container := _container_last(); container != nil { if container := _container_current(); container != nil {
inner := element_get_inner_area(container^) inner := _get_element_inner_area(container^)
container_size := inner.width if axis == .X else inner.height container_size := inner.width if axis == .X else inner.height
return container_size * cast(f32)value return container_size * cast(f32)value
} else { } else {
@ -132,16 +161,18 @@ _resolve_size :: proc(size: Size, axis: Axis) -> f32 {
unreachable() unreachable()
} }
_container_last :: proc() -> ^Element { _container_current :: proc() -> ^Element {
if len(ctx.container_stack) == 0 { return &ctx.elements[ctx.containers[len(ctx.containers) - 1]]
return nil
}
return ctx.container_stack[len(ctx.container_stack) - 1]
} }
_element_last :: proc() -> ^Element { _element_previous :: proc() -> ^Element {
if len(ctx.elements) == 0 {
return nil
}
return &ctx.elements[len(ctx.elements) - 1] return &ctx.elements[len(ctx.elements) - 1]
} }
_element_container_previous :: proc() -> ^Element {
if previous_index := ctx.container_last_element[len(ctx.containers) - 1]; previous_index != -1 {
return &ctx.elements[previous_index]
} else {
return nil
}
}