feat(ui): size a grid to the app's box, not the panel

Chrome takes the top of the panel before an app builds anything, and layout
has not run yet when it does, so ui.frame() reports what the mount left it.
This commit is contained in:
2026-08-04 21:15:21 -04:00
parent 25b576a3d9
commit 4b89b27947
3 changed files with 26 additions and 4 deletions
+19 -3
View File
@@ -57,6 +57,7 @@ local themeName
-- One tree per state, built by the function ui.mount() was given. Rebuilding is
-- cheap enough that nothing is retained between screens.
local builder, root, captured, insideCaptured, confirming
local inset = 0
local applyPalette
local function mix(a, b, amount)
@@ -214,13 +215,28 @@ end
---@return integer side
---@return integer columns
function ui.cardSide(count, pad, gap, reserve)
local columns = gui.getWidth() >= gui.getHeight() and 3 or 2
local width, height = ui.frame()
local columns = width >= height and 3 or 2
local rows = math.ceil(count / columns)
local byWidth = (gui.getWidth() - 2 * pad - (columns - 1) * gap) // columns
local byHeight = (gui.getHeight() - 2 * pad - (reserve or 0) - (rows - 1) * gap) // rows
local byWidth = (width - 2 * pad - (columns - 1) * gap) // columns
local byHeight = (height - 2 * pad - (reserve or 0) - (rows - 1) * gap) // rows
return math.min(byWidth, byHeight), columns
end
---How much of the panel chrome took before the app was built. Set by whatever mounts the
---tree, because layout has not run yet when an app sizes itself.
---@param px integer
function ui.setInset(px)
inset = px
end
---The box the app is built into, which is the panel minus the chrome above it.
---@return integer w
---@return integer h
function ui.frame()
return gui.getWidth(), gui.getHeight() - inset
end
---@param spec UiSpec
---@return NodeId
function ui.spacer(spec)
+6
View File
@@ -251,6 +251,12 @@ assert(cleared == ui.theme.background)
ui.draw()
-- The inset chrome took comes off the height budget before anything else.
ui.setInset(44)
assert(select(2, ui.frame()) == 436, "the frame is the panel minus the chrome")
assert(select(1, ui.cardSide(5, 12, 8)) == 132, "a grid fits the app's box, not the panel")
ui.setInset(0)
-- 320x480 portrait: two columns, and the reserve comes off the height budget.
local side, columns = ui.cardSide(5, 12, 8)
assert(columns == 2 and side == 144, "width is the binding constraint in portrait")
File diff suppressed because one or more lines are too long