Added/updated components to be isolated rectangles.

This commit is contained in:
2026-06-17 07:48:07 +02:00
parent cccc4fb06c
commit 6605d86916
6 changed files with 489 additions and 49 deletions
+83 -49
View File
@@ -3,29 +3,36 @@ package simulator
import emu "../machine"
import rl "vendor:raylib"
// Initial window size
// @ Window
WINDOW_WIDTH :: 1920
WINDOW_HEIGHT :: 1080
// @TODO: If this grows lets move it into its own file
// ─── Layout constants ───────────────────────────────────────────────────
SIDEBAR_PERCENT :: 0.20
DISPLAY_PERCENT :: 0.30
CONTROL_BAR_H :: f32(50)
STATUS_BAR_H :: f32(30)
PANEL_PADDING :: 10
PANEL_HEADER :: 24
// @ Layout proportions
// Sidebar takes 20% of screen width on each side; display takes the rest.
// The center column splits vertically: 40% display, 60% debug panel.
SIDEBAR_PERCENT :: f32(0.20)
DISPLAY_V_RATIO :: f32(0.40)
// @ Fixed heights
CONTROL_BAR_H :: f32(50)
STATUS_BAR_H :: f32(30)
// @ Layout constants
PADDING_X :: f32(10)
PADDING_Y :: f32(8)
PANEL_HEADER :: f32(24)
// @ Buttons
BUTTON_HEIGHT :: 30
BUTTON_WIDTH :: 120
// @ Fonts
BIG_FONT_SIZE :: 20
KEYPAD_FONT_SIZE :: 18
Layout :: struct {
control_bar : rl.Rectangle,
left_panel : rl.Rectangle,
file_loader : rl.Rectangle,
keypad : rl.Rectangle,
display : rl.Rectangle,
bottom_panel : rl.Rectangle,
right_panel : rl.Rectangle,
cpu : rl.Rectangle,
status_bar : rl.Rectangle,
}
@@ -46,7 +53,7 @@ run_gui :: proc(sim: ^Simulator) {
rl.GuiLoadStyle("./assets/raygui_styles/style_dark.rgs")
rl.GuiSetFont(font)
rl.GuiSetStyle(.DEFAULT, cast(i32)rl.GuiDefaultProperty.TEXT_SIZE, 18)
rl.GuiSetStyle(.DEFAULT, i32(rl.GuiDefaultProperty.TEXT_SIZE), 18)
// Draw each of the components in its own window within the main window
for !rl.WindowShouldClose() {
@@ -79,9 +86,26 @@ run_gui :: proc(sim: ^Simulator) {
}
}
// Top
// ------------------------------------------
gui_control_bar(layout.control_bar, sim)
gui_left_panel(layout.left_panel, sim)
// Left
// ------------------------------------------
gui_file_loader(layout.file_loader, sim)
gui_key_pad(layout.keypad, sim.machine.keypad, sim.font)
// Center
// ------------------------------------------
gui_screen(layout.display, sim)
// Right
// ------------------------------------------
gui_cpu(layout.cpu, sim)
// Bottom
// ------------------------------------------
gui_bottom_tabs(layout.bottom_panel, sim)
gui_status_bar(layout.status_bar, sim)
rl.EndDrawing()
@@ -95,64 +119,74 @@ run_gui :: proc(sim: ^Simulator) {
// @TODO: If this grows lets move it into its own file
calc_layout :: proc(screen_width: f32, screen_height: f32) -> Layout {
top_h := CONTROL_BAR_H
bottom_h := STATUS_BAR_H
content_h := screen_height - top_h - bottom_h
content_y := top_h
// Control bar is a fixed height frozen at top of gui, all items start below it.
y_pos := CONTROL_BAR_H
x_pos := f32(0)
sidebar_w := screen_width * SIDEBAR_PERCENT
// Usable gui vertical space
visible_height := screen_height - CONTROL_BAR_H - STATUS_BAR_H
sidebar_width := screen_width * SIDEBAR_PERCENT
display_width := screen_width - (sidebar_width * 2) - sidebar_width
display_height := visible_height * DISPLAY_V_RATIO
screen_h_ratio := 0.40
bottom_panel_h := content_h * f32(1.0 - screen_h_ratio)
screen_h := content_h * f32(screen_h_ratio)
memory_h := content_h - screen_h
center_x := sidebar_w
center_w := screen_width - sidebar_w * 2
x_center := sidebar_width
y_center := screen_width - sidebar_width * 2
return Layout {
// Left Area
control_bar = rl.Rectangle{
x = 0,
y = 0,
width = screen_width,
height = top_h,
height = CONTROL_BAR_H,
},
left_panel = rl.Rectangle{
file_loader = rl.Rectangle{
x = 0,
y = top_h,
width = sidebar_w,
height = content_h,
y = y_pos,
width = sidebar_width,
height = visible_height / 3
},
keypad = rl.Rectangle{
x = 0,
y = (y_pos + visible_height - visible_height / 2),
width = sidebar_width,
height = visible_height / 2
},
// CHIP-8 screen (top center)
// ------------------------------------------
// Center Area
display = rl.Rectangle{
x = center_x,
y = top_h,
width = center_w,
height = screen_h,
x = sidebar_width,
y = y_pos,
width = display_width,
height = display_height,
},
// MEMORY / DEBUG panel (bottom center)
// ------------------------------------------
// Bottom Area
bottom_panel = rl.Rectangle{
x = center_x,
y = top_h + screen_h,
width = center_w,
height = memory_h,
x = sidebar_width,
y = y_pos + display_height,
width = screen_width - sidebar_width,
height = visible_height - display_height,
},
right_panel = rl.Rectangle{
x = screen_width - sidebar_w,
y = top_h,
width = sidebar_w,
height = content_h,
// ------------------------------------------
// Right Area
cpu = rl.Rectangle {
x = sidebar_width + display_width,
y = y_pos,
width = sidebar_width * 2,
height = display_height
},
// ------------------------------------------
// Bottom Area
status_bar = rl.Rectangle{
x = 0,
y = screen_height - bottom_h,
x = x_pos,
y = y_pos + visible_height,
width = screen_width,
height = bottom_h,
height = STATUS_BAR_H,
},
}
}