new ui idea
This commit is contained in:
517
src/wasm_app/_ui.c
Normal file
517
src/wasm_app/_ui.c
Normal file
@@ -0,0 +1,517 @@
|
||||
#if 0
|
||||
fn s8_t ui_get_display_string(s8_t string) {
|
||||
s8_t result = string;
|
||||
if (s8_seek(result, s8_lit("##"), s8_seek_none, &result.len)) {
|
||||
int a = 10;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
fn s8_t ui_get_hash_string(s8_t string) {
|
||||
i64 len = 0;
|
||||
if (s8_seek(string, s8_lit("##"), s8_seek_none, &len)) {
|
||||
string = s8_skip(string, len + 2);
|
||||
}
|
||||
return string;
|
||||
}
|
||||
|
||||
fn ui_id_t ui_find_valid_id(ui_box_t *box) {
|
||||
for (ui_box_t *it = box; it; it = it->parent) {
|
||||
if (!ui_is_null_box(it)) return it->id;
|
||||
}
|
||||
return ui_null_id;
|
||||
}
|
||||
|
||||
fn ui_id_t ui_find_top_id(void) {
|
||||
ui_id_t parent_id = ui_find_valid_id(ui->top);
|
||||
if (ui_is_null_id(parent_id)) parent_id.value = 1423;
|
||||
return parent_id;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_find_box(ui_id_t id) {
|
||||
if (id.value == 0) return NULL;
|
||||
for (ui_box_t *it = ui->hash_first; it; it = it->hash_next) {
|
||||
if (it->id.value == id.value) {
|
||||
return it;
|
||||
}
|
||||
}
|
||||
return NULL;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_alloc_box(void) {
|
||||
ui_box_t *box = NULL;
|
||||
if (ui->free_first) {
|
||||
SLLS_POP_AND_STORE(ui->free_first, box);
|
||||
} else {
|
||||
box = ma_push_type(ui->box_arena, ui_box_t);
|
||||
ui->allocated_boxes += 1;
|
||||
}
|
||||
return box;
|
||||
}
|
||||
|
||||
fn void ui_push(ui_box_t *parent, ui_box_t *box) {
|
||||
box->parent = parent;
|
||||
DLLQ_APPEND(parent->first, parent->last, box);
|
||||
parent->node_count += 1;
|
||||
}
|
||||
|
||||
fn void ui_set_semantic_size(ui_box_t *box, ui_size_t x, ui_size_t y) {
|
||||
box->semantic_size[0] = x;
|
||||
box->semantic_size[1] = y;
|
||||
}
|
||||
|
||||
fn s8_t ui_tprint_loc(ui_code_loc_t loc) {
|
||||
return s8_printf(tcx.temp, "%s(%d)", loc.file, loc.line);
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_build_box_from_id(ui_code_loc_t loc, ui_box_flags_t flags, ui_id_t id) {
|
||||
ui_box_t *box = ui_find_box(id);
|
||||
if (box) {
|
||||
expect (box->last_touched_event_id != ui->event->id) {
|
||||
fatalf("likely ui id collision between: %S and %S", ui_tprint_loc(loc), ui_tprint_loc(box->loc));
|
||||
}
|
||||
memory_zero(box, offsetof(ui_box_t, id));
|
||||
} else {
|
||||
box = ui_alloc_box();
|
||||
box->created_new = true;
|
||||
DLLQ_APPEND_EX(ui->hash_first, ui->hash_last, box, hash_next, hash_prev);
|
||||
}
|
||||
box->loc = loc;
|
||||
box->last_touched_event_id = ui->event->id;
|
||||
box->id = id;
|
||||
box->flags = flags;
|
||||
ui_push(ui->top, box);
|
||||
return box;
|
||||
}
|
||||
|
||||
fn ui_id_t ui_gen_id(ui_id_flags_t flags, ui_code_loc_t loc, s8_t string) {
|
||||
u64 result = 42523423493;
|
||||
if (flags.use_string) {
|
||||
u64 string_hash = hash_data(string);
|
||||
result = hash_mix(string_hash, result);
|
||||
}
|
||||
if (flags.use_hierarchy) {
|
||||
ui_id_t top_id = ui_find_top_id();
|
||||
result = hash_mix(top_id.value, result);
|
||||
}
|
||||
if (flags.use_code_loc) {
|
||||
u64 file_hash = hash_data(s8_from_char(loc.file));
|
||||
u64 line_hash = hash_data(s8_struct(loc.line));
|
||||
u64 cont_hash = hash_data(s8_struct(loc.counter));
|
||||
result = hash_mix(result, file_hash);
|
||||
result = hash_mix(result, line_hash);
|
||||
result = hash_mix(result, cont_hash);
|
||||
}
|
||||
ui_id_t id = {result};
|
||||
return id;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_build_box_from_string(ui_code_loc_t loc, ui_box_flags_t flags, s8_t string) {
|
||||
ui_id_t id = ui_gen_id(ui->id_flags, loc, ui_get_hash_string(string));
|
||||
ui_box_t *box = ui_build_box_from_id(loc, flags, id);
|
||||
box->string = ui_get_display_string(string);
|
||||
return box;
|
||||
}
|
||||
|
||||
fn ui_signal_t ui_signal_from_box(ui_box_t *box) {
|
||||
ui_signal_t result = {box};
|
||||
app_event_t *ev = ui->event;
|
||||
|
||||
b32 move = ev->kind == app_event_kind_mouse_move;
|
||||
b32 inside = r2f32_contains(box->rect, ev->mouse_pos);
|
||||
|
||||
if (ui_is_active_box(box)) {
|
||||
result.dragging = true;
|
||||
if (ev_left_up(ev)) {
|
||||
if (ui_is_hot_box(box)) {
|
||||
result.clicked = true;
|
||||
} else {
|
||||
ui->active.value = 0;
|
||||
}
|
||||
}
|
||||
} else if (ui_is_hot_box(box) && ev_left_down(ev)) {
|
||||
ui->active = box->id;
|
||||
}
|
||||
|
||||
if (inside) {
|
||||
ui->hot.value = box->id.value;
|
||||
} else if (!inside && ui_is_hot_box(box)) {
|
||||
ui->hot = ui_null_id;
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
fn void ui_init(ma_arena_t *arena) {
|
||||
assert(arena != tcx.temp);
|
||||
|
||||
ui = ma_push_type(arena, ui_t);
|
||||
ui->box_arena = arena;
|
||||
ui->root = ma_push_type(arena, ui_box_t);
|
||||
ui->id_flags = (ui_id_flags_t){.use_string = true, .use_code_loc = true};
|
||||
|
||||
ui->box_array = ma_push_type(arena, ui_box_t);
|
||||
SLLS_PUSH(ui->free_first, ui->box_array);
|
||||
}
|
||||
|
||||
fn void ui_begin_build(ui_code_loc_t loc, app_event_t *event) {
|
||||
ui->event = event;
|
||||
|
||||
for (ui_box_t *box = ui->hash_first, *next = NULL; box; box = next) {
|
||||
next = box->hash_next;
|
||||
if (box->id.value == 0) {
|
||||
DLLQ_REMOVE_EX(ui->hash_first, ui->hash_last, box, hash_next, hash_prev);
|
||||
zero_struct(box);
|
||||
SLLS_PUSH(ui->free_first, box);
|
||||
}
|
||||
}
|
||||
|
||||
zero_struct(ui->root);
|
||||
ui->top = ui->root;
|
||||
ui->root->loc = UI_CODE_LOC;
|
||||
}
|
||||
|
||||
fn void ui_end_build(void) {
|
||||
assert(ui->top == ui->root);
|
||||
|
||||
for (ui_box_t *box = ui->hash_first, *next = NULL; box; box = next) {
|
||||
next = box->hash_next;
|
||||
b32 touched_box_during_update = ui->event->id <= box->last_touched_event_id;
|
||||
if (!touched_box_during_update) {
|
||||
DLLQ_REMOVE_EX(ui->hash_first, ui->hash_last, box, hash_next, hash_prev);
|
||||
zero_struct(box);
|
||||
SLLS_PUSH(ui->free_first, box);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn void ui_begin_frame(app_frame_t *frame) {
|
||||
ui->frame = frame;
|
||||
}
|
||||
|
||||
fn void ui_push_parent(ui_box_t *box) {
|
||||
ui->top = box;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_pop_parent(void) {
|
||||
ui_box_t *top = ui->top;
|
||||
ui->top = ui->top->parent;
|
||||
return top;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_spacer(ui_code_loc_t loc, ui_size_t x, ui_size_t y) {
|
||||
ui_box_t *box = ui_build_box_from_id(loc, (ui_box_flags_t){.draw_rect = true, .draw_border = true}, ui_null_id);
|
||||
ui_set_semantic_size(box, x, y);
|
||||
return box;
|
||||
}
|
||||
|
||||
fn ui_signal_t ui_scroller_button(ui_code_loc_t loc, ui_size_t x, ui_size_t y) {
|
||||
ui_id_t id = ui_gen_id(ui->id_flags, loc, s8_lit("spacer"));
|
||||
ui_box_t *box = ui_build_box_from_id(loc, (ui_box_flags_t){.draw_rect = true, .draw_border = true}, id);
|
||||
ui_set_semantic_size(box, x, y);
|
||||
ui_signal_t signal = ui_signal_from_box(box);
|
||||
return signal;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_push_container(ui_code_loc_t loc, ui_size_t x, ui_size_t y) {
|
||||
ui_box_t *box = ui_build_box_from_id(loc, (ui_box_flags_t){.draw_rect = true}, ui_null_id);
|
||||
ui_push_parent(box);
|
||||
ui_set_semantic_size(box, x, y);
|
||||
box->grow_axis = ui_axis2_y;
|
||||
return box;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_push_xcontainer(ui_code_loc_t loc, ui_size_t x, ui_size_t y) {
|
||||
ui_box_t *box = ui_push_container(loc, x, y);
|
||||
box->grow_axis = ui_axis2_x;
|
||||
return box;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_push_list_container(ui_code_loc_t loc, ui_size_t size) {
|
||||
return ui_push_container(loc, size, ui_children_sum());
|
||||
}
|
||||
|
||||
fn void ui_set_indented_string(ui_box_t *box, s8_t string) { box->string = s8_printf(tcx.temp, "%.*s%S", ui->indent_stack, " ", string); }
|
||||
|
||||
fn ui_signal_t ui_push_exp(ui_code_loc_t loc, char *str, ...) {
|
||||
S8_FMT(tcx.temp, str, string);
|
||||
ui_box_t *box = ui_build_box_from_string(loc, (ui_box_flags_t){.draw_text = true}, string);
|
||||
ui_set_semantic_size(box, ui_percent(1), ui_text());
|
||||
|
||||
if (box->created_new) box->expanded = true;
|
||||
|
||||
ui_signal_t signal = ui_signal_from_box(box);
|
||||
if (signal.clicked) box->expanded = !box->expanded;
|
||||
signal.clicked = box->expanded;
|
||||
|
||||
if (signal.clicked) {
|
||||
box->string = s8_printf(tcx.temp, "* %S", box->string); // ▼
|
||||
} else {
|
||||
box->string = s8_printf(tcx.temp, "> %S", box->string); // ►
|
||||
}
|
||||
ui_set_indented_string(box, box->string);
|
||||
|
||||
|
||||
if (signal.clicked) ui->indent_stack += 1;
|
||||
return signal;
|
||||
}
|
||||
|
||||
fn void ui_pop_exp(void) {
|
||||
ui->indent_stack -= 1;
|
||||
}
|
||||
|
||||
fn ui_box_t *ui_label(ui_code_loc_t loc, char *fmt, ...) {
|
||||
S8_FMT(tcx.temp, fmt, string);
|
||||
ui_box_t *box = ui_build_box_from_id(loc, (ui_box_flags_t){.draw_text = true}, ui_null_id);
|
||||
ui_set_indented_string(box, string);
|
||||
ui_set_semantic_size(box, ui_text(), ui_text());
|
||||
return box;
|
||||
}
|
||||
|
||||
fn void ui_end_frame(void) {
|
||||
for (app_event_t *ev = ui->frame->first_event; ev; ev = ev->next) {
|
||||
if (ev_left_up(ev)) {
|
||||
ui->active = ui_null_id;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn void ui_layout(void) {
|
||||
rn_font_t *font = &rn_state.main_font;
|
||||
|
||||
// compute standalone sizes: (pixels, text_content)
|
||||
for (ui_preorder_iter_t it = ui_iterate_preorder(ui->root); ui_preorder_iter_is_valid(it); ui_iter_advance_preorder(&it)) {
|
||||
ui_box_t *box = it.box;
|
||||
if (box == ui->root) continue; // @todo: remove somehow
|
||||
for (ui_axis2_t axis = 0; axis < ui_axis2_count; axis += 1) {
|
||||
ui_size_t sem = box->semantic_size[axis];
|
||||
assert(sem.kind != ui_size_kind_null);
|
||||
if (sem.kind == ui_size_kind_pixels) {
|
||||
box->computed_size[axis] = sem.value;
|
||||
} else if (sem.kind == ui_size_kind_text_content) {
|
||||
box->computed_size[axis] = rn_measure_string(font, box->string).e[axis];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// compute: (percent_of_parent)
|
||||
for (ui_preorder_iter_t it = ui_iterate_preorder(ui->root); ui_preorder_iter_is_valid(it); ui_iter_advance_preorder(&it)) {
|
||||
ui_box_t *box = it.box;
|
||||
ui_box_t *parent = box->parent; // @todo: I'm not sure why Ryan uses a loop to find a parent with fixed size_kind
|
||||
for (ui_axis2_t axis = 0; axis < ui_axis2_count; axis += 1) {
|
||||
ui_size_t sem = box->semantic_size[axis];
|
||||
if (sem.kind == ui_size_kind_percent_of_parent) {
|
||||
assert(parent->semantic_size[axis].kind == ui_size_kind_pixels ||
|
||||
parent->semantic_size[axis].kind == ui_size_kind_text_content ||
|
||||
parent->semantic_size[axis].kind == ui_size_kind_percent_of_parent);
|
||||
box->computed_size[axis] = (sem.value) * parent->computed_size[axis];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// compute: (children_sum)
|
||||
for (ui_postorder_iter_t it = ui_iterate_postorder(ui->root); ui_postorder_iter_is_valid(it); ui_iter_advance_postorder(&it)) {
|
||||
ui_box_t *box = it.box;
|
||||
for (ui_axis2_t axis = 0; axis < ui_axis2_count; axis += 1) {
|
||||
ui_size_t sem = box->semantic_size[axis];
|
||||
if (sem.kind != ui_size_kind_children_sum) continue;
|
||||
|
||||
for (ui_box_t *child = box->first; child; child = child->next) {
|
||||
assert(child->computed_size[axis] != 0.f);
|
||||
if (box->grow_axis == axis) {
|
||||
box->computed_size[axis] += child->computed_size[axis];
|
||||
} else {
|
||||
box->computed_size[axis] = MAX(box->computed_size[axis], child->computed_size[axis]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// solve violations
|
||||
|
||||
// compute relative positions
|
||||
for (ui_preorder_iter_t it = ui_iterate_preorder(ui->root); ui_preorder_iter_is_valid(it); ui_iter_advance_preorder(&it)) {
|
||||
ui_box_t *box = it.box;
|
||||
ui_box_t *parent = box->parent;
|
||||
if (ui->root == box) continue; // @todo: how to remove this?
|
||||
|
||||
for (ui_axis2_t axis = 0; axis < ui_axis2_count; axis += 1) {
|
||||
f32 *pos = &box->computed_rel_pos[axis];
|
||||
f32 size = box->computed_size[axis];
|
||||
|
||||
f32 parent_pos = parent->computed_rel_pos[axis];
|
||||
f32 *iter_pos = &parent->iter_pos[axis];
|
||||
|
||||
*pos = parent_pos + *iter_pos;
|
||||
if (parent->flags.scroll) {
|
||||
*pos -= parent->view_offset.e[axis];
|
||||
}
|
||||
|
||||
if (parent->grow_axis == axis) *iter_pos += size;
|
||||
}
|
||||
|
||||
v2f32_t pos = v2f32(box->computed_rel_pos[0], box->computed_rel_pos[1]);
|
||||
v2f32_t size = v2f32(box->computed_size[0], box->computed_size[1]);
|
||||
box->rect = r2f32_mindim(pos, size);
|
||||
}
|
||||
}
|
||||
|
||||
fn void ui_draw(void) {
|
||||
rn_font_t *font = &rn_state.main_font;
|
||||
ui_test_iterator();
|
||||
ui_layout();
|
||||
|
||||
// actually draw
|
||||
for (ui_preorder_iter_t it = ui_iterate_preorder(ui->root); ui_preorder_iter_is_valid(it); ui_iter_advance_preorder(&it)) {
|
||||
ui_box_t *box = it.box;
|
||||
r2f32_t clip_rect = box->rect;
|
||||
if (box->parent) {
|
||||
clip_rect = r2f32_intersect(clip_rect, box->parent->rect);
|
||||
}
|
||||
|
||||
v4f32_t rect_color = primary_color_global;
|
||||
v4f32_t text_color = black_color_global;
|
||||
if (ui_is_hot_box(box)) {
|
||||
rect_color = secondary_color_global;
|
||||
text_color = accent2_color_global;
|
||||
}
|
||||
if (ui_is_active_box(box)) {
|
||||
rect_color = accent1_color_global;
|
||||
text_color = accent1_color_global;
|
||||
}
|
||||
|
||||
rn_set_clip(clip_rect);
|
||||
if (box->flags.draw_rect) {
|
||||
rn_draw_rect(box->rect, rect_color);
|
||||
}
|
||||
if (box->flags.draw_border) {
|
||||
rn_draw_rect_border(box->rect, accent2_color_global);
|
||||
}
|
||||
if (box->flags.draw_text) {
|
||||
rn_draw_string(font, box->rect.min, text_color, box->string);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
void ui_demo(app_frame_t *frame) {
|
||||
assert(frame != NULL);
|
||||
ui_begin_frame(frame);
|
||||
|
||||
assert(frame->first_event);
|
||||
|
||||
for (app_event_t *ev = frame->first_event; ev; ev = ev->next) {
|
||||
static f32 scroller_value;
|
||||
defer_block(ui_begin_build(UI_CODE_LOC, ev), ui_end_build()) {
|
||||
defer_block(ui_push_xcontainer(UI_CODE_LOC, ui_em(25), ui_em(30)), ui_pop_parent()) {
|
||||
|
||||
|
||||
ui_box_t *item_box = ui_build_box_from_string(UI_CODE_LOC, (ui_box_flags_t){.scroll = true, .draw_rect = true}, s8_lit("scrolled item_box"));
|
||||
ui_set_semantic_size(item_box, ui_percent(0.97f), ui_percent(1));
|
||||
item_box->grow_axis = ui_axis2_y;
|
||||
defer_block(ui_push_parent(item_box), ui_pop_parent()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "app_event_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "mouse_wheel_delta: v3f64_t").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "z: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "kind: app_event_kind_t = value");
|
||||
ui_label(UI_CODE_LOC, "ctrl: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "shift: b8 = value");
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "pos: v2f64_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##asd").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##qwe").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "alt: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "meta: b8 = value");
|
||||
}
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "app_event_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "mouse_wheel_delta: v3f64_t").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "z: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "kind: app_event_kind_t = value");
|
||||
ui_label(UI_CODE_LOC, "ctrl: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "shift: b8 = value");
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "pos: v2f64_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##asd").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##qwe").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "alt: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "meta: b8 = value");
|
||||
}
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "app_event_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "mouse_wheel_delta: v3f64_t").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "z: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "kind: app_event_kind_t = value");
|
||||
ui_label(UI_CODE_LOC, "ctrl: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "shift: b8 = value");
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "pos: v2f64_t").clicked, ui_pop_exp()) {
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##asd").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
defer_if (ui_push_exp(UI_CODE_LOC, "inner_pos: v2f64_t##qwe").clicked, ui_pop_exp()) {
|
||||
ui_label(UI_CODE_LOC, "x: f64 = value");
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "y: f64 = value");
|
||||
}
|
||||
ui_label(UI_CODE_LOC, "alt: b8 = value");
|
||||
ui_label(UI_CODE_LOC, "meta: b8 = value");
|
||||
}
|
||||
}
|
||||
|
||||
// scroller
|
||||
{
|
||||
f32 all_items_size = (f32)item_box->node_count * rn_state.main_font.size;
|
||||
f32 item_box_size = r2f32_get_size(item_box->rect).y;
|
||||
|
||||
f32 scroller_size = CLAMP(item_box_size / all_items_size, 0, 1.0f);
|
||||
f32 scrollable_space = (1 - scroller_size);
|
||||
f32 scroller_norm = scroller_value / (all_items_size);
|
||||
f32 scroller_percent = scroller_norm * scrollable_space;
|
||||
f32 scroller_second = scrollable_space - scroller_percent;
|
||||
|
||||
ui_push_container(UI_CODE_LOC, ui_percent(0.03f), ui_percent(1));
|
||||
ui_spacer(UI_CODE_LOC, ui_percent(1), ui_percent(scroller_percent));
|
||||
ui_signal_t sig = ui_scroller_button(UI_CODE_LOC, ui_percent(1), ui_percent(scroller_size));
|
||||
if (sig.dragging) {
|
||||
scroller_value += (ev->mouse_delta.y / item_box_size * 2) * (all_items_size);
|
||||
scroller_value = CLAMP(scroller_value, 0, all_items_size);
|
||||
}
|
||||
ui_spacer(UI_CODE_LOC, ui_percent(1), ui_percent(scroller_second));
|
||||
ui_pop_parent();
|
||||
|
||||
item_box->view_offset.y = scroller_value;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
rn_begin();
|
||||
|
||||
ui_draw();
|
||||
rn_draw_stringf(&rn_state.main_font, v2f32(0,frame->window_size.y - 100), black_color_global, "ui_boxes: %d delta: %f update: %f event_count: %d, delta: %f %f dpr: %f", ui->allocated_boxes, frame->delta, frame->update, frame->event_count, frame->last_event->mouse_delta.x, frame->last_event->mouse_delta.y, frame->dpr);
|
||||
rn_end(frame->window_size, white_color_global);
|
||||
|
||||
ui_end_frame();
|
||||
}
|
||||
157
src/wasm_app/_ui.h
Normal file
157
src/wasm_app/_ui.h
Normal file
@@ -0,0 +1,157 @@
|
||||
#if 0
|
||||
/*
|
||||
** [x] Choosing a keying strategy from user code
|
||||
** [x] Using parents
|
||||
** [x] Using file and line
|
||||
** [ ] Keyboard friendliness
|
||||
** [x] ui_em size
|
||||
** [ ] use strictness to 'solve violations'
|
||||
** [ ] scrolling
|
||||
** [ ] vieweing type info
|
||||
** [ ] slider
|
||||
** [ ] button
|
||||
** [ ] pernament state
|
||||
*/
|
||||
|
||||
typedef struct ui_id_t ui_id_t;
|
||||
struct ui_id_t {
|
||||
u64 value;
|
||||
};
|
||||
|
||||
typedef struct ui_code_loc_t ui_code_loc_t;
|
||||
struct ui_code_loc_t {
|
||||
char *file;
|
||||
int line;
|
||||
int counter;
|
||||
};
|
||||
#define UI_CODE_LOC (ui_code_loc_t){.file = __FILE__, .line = __LINE__, .counter = __COUNTER__}
|
||||
|
||||
typedef enum {
|
||||
ui_axis2_x,
|
||||
ui_axis2_y,
|
||||
ui_axis2_count,
|
||||
} ui_axis2_t;
|
||||
|
||||
typedef enum {
|
||||
ui_size_kind_null,
|
||||
ui_size_kind_pixels,
|
||||
ui_size_kind_text_content,
|
||||
ui_size_kind_percent_of_parent,
|
||||
ui_size_kind_children_sum,
|
||||
} ui_size_kind_t;
|
||||
|
||||
typedef struct ui_size_t ui_size_t;
|
||||
struct ui_size_t {
|
||||
ui_size_kind_t kind;
|
||||
f32 value;
|
||||
f32 strictness;
|
||||
};
|
||||
|
||||
typedef struct ui_box_flags_t ui_box_flags_t;
|
||||
struct ui_box_flags_t {
|
||||
b8 draw_border : 1;
|
||||
b8 draw_text : 1;
|
||||
b8 draw_rect : 1;
|
||||
|
||||
b8 scroll : 1;
|
||||
};
|
||||
|
||||
typedef struct ui_box_t ui_box_t;
|
||||
struct ui_box_t {
|
||||
// recreated every frame in building code
|
||||
ui_box_t *next;
|
||||
ui_box_t *prev;
|
||||
ui_box_t *parent;
|
||||
ui_box_t *first;
|
||||
ui_box_t *last;
|
||||
i32 node_count;
|
||||
|
||||
ui_box_flags_t flags;
|
||||
s8_t string;
|
||||
ui_size_t semantic_size[ui_axis2_count];
|
||||
ui_axis2_t grow_axis;
|
||||
ui_code_loc_t loc;
|
||||
b32 created_new;
|
||||
|
||||
// layout
|
||||
f32 iter_pos[ui_axis2_count];
|
||||
|
||||
// preserving state
|
||||
ui_id_t id; // important position!: offset(id) used for partial zeroing
|
||||
u64 last_touched_event_id;
|
||||
ui_box_t *hash_next;
|
||||
ui_box_t *hash_prev;
|
||||
|
||||
// layout
|
||||
f32 computed_rel_pos[ui_axis2_count];
|
||||
f32 computed_size[ui_axis2_count];
|
||||
r2f32_t rect;
|
||||
v2f32_t view_offset;
|
||||
|
||||
// state
|
||||
b32 expanded;
|
||||
};
|
||||
|
||||
typedef struct ui_signal_t ui_signal_t;
|
||||
struct ui_signal_t {
|
||||
ui_box_t *box;
|
||||
b8 clicked;
|
||||
b8 dragging;
|
||||
|
||||
// b8 double_clicked;
|
||||
// b8 right_clicked;
|
||||
// b8 pressed;
|
||||
// b8 released;
|
||||
// b8 dragging;
|
||||
// b8 hovering;
|
||||
};
|
||||
|
||||
typedef struct ui_id_flags_t ui_id_flags_t;
|
||||
struct ui_id_flags_t {
|
||||
b8 use_hierarchy;
|
||||
b8 use_code_loc;
|
||||
b8 use_string;
|
||||
};
|
||||
|
||||
typedef struct ui_t ui_t;
|
||||
struct ui_t {
|
||||
ma_arena_t *box_arena; // required to be only used for boxes
|
||||
app_event_t *event;
|
||||
app_frame_t *frame;
|
||||
|
||||
i32 allocated_boxes;
|
||||
ui_box_t *box_array; // first item on arena
|
||||
ui_box_t *root;
|
||||
ui_box_t *top;
|
||||
|
||||
ui_box_t *free_first;
|
||||
ui_box_t *hash_first;
|
||||
ui_box_t *hash_last;
|
||||
|
||||
ui_id_t hot;
|
||||
ui_id_t active;
|
||||
|
||||
int indent_stack;
|
||||
|
||||
ui_id_flags_t id_flags;
|
||||
};
|
||||
|
||||
gb ui_t *ui = NULL;
|
||||
gb_read_only ui_id_t ui_null_id;
|
||||
gb_read_only ui_box_t ui_null_box;
|
||||
|
||||
fn b32 ui_is_null_id(ui_id_t id) { return id.value == 0; }
|
||||
fn b32 ui_is_null_box(ui_box_t *box) { return box->id.value == 0; }
|
||||
fn b32 ui_is_hot_box(ui_box_t *box) { return !ui_is_null_box(box) && box->id.value == ui->hot.value; }
|
||||
fn b32 ui_is_active_box(ui_box_t *box) { return !ui_is_null_box(box) && box->id.value == ui->active.value; }
|
||||
|
||||
#define ev_left(ev) ((ev)->mouse_button == app_mouse_button_left)
|
||||
#define ev_left_up(ev) ((ev)->kind == app_event_kind_mouse_up && ev_left(ev))
|
||||
#define ev_left_down(ev) ((ev)->kind == app_event_kind_mouse_down && ev_left(ev))
|
||||
|
||||
fn ui_size_t ui_size(ui_size_kind_t kind, f32 value) { return (ui_size_t){.kind = kind, .value = value}; }
|
||||
#define ui_pixels(value) ui_size(ui_size_kind_pixels, value)
|
||||
#define ui_em(value) ui_size(ui_size_kind_pixels, value * rn_state.main_font.size)
|
||||
#define ui_text() ui_size(ui_size_kind_text_content, 0)
|
||||
#define ui_children_sum() ui_size(ui_size_kind_children_sum, 0)
|
||||
#define ui_percent(value) ui_size(ui_size_kind_percent_of_parent, value)
|
||||
Reference in New Issue
Block a user