Skip to content

Central de Flota: eight rows and no entry animation

Topicsui, ink, layout

The fleet menu was rebuilt this week from the mockup, and most of the work turned out to be arithmetic.

Eight units have to fit without a scroll area. The panel has 469 pixels of vertical room for the list. Eight rows at 52 pixels each make 416. Six gaps of six pixels add 36, and six more pixels of trailing air bring the block to 458, with eleven to spare. So the row pitch, the distance from the top of one row to the top of the next, is 58: 52 of row, 6 of air. The list ends where the panel ends. No scroll container, no eighth entry cut in half, no scrollbar to style.

If a ninth unit ever turns up, the numbers get redone, and that is the right trade. A fixed layout that is correct beats a flexible one that is nearly correct.

The panel has no entry animation on purpose, and not out of laziness. Earlier I had put an inkAnimTranslation and an inkAnimTransparency, a slide and a fade, into the same inkAnimDef, one animation definition in ink, the game's UI system. It is the obvious way to write a fade-and-slide. It didn't glitch. The popup simply never appeared again, and the log had nothing to debug from.

The rule since then: one interpolator, meaning one animated property, per animation definition, and each definition on its own widget. If something has to move and fade at the same time, that's two definitions on two nested widgets. For the fleet panel I decided it needs neither. It opens instantly, which for a menu you call up in traffic is arguably the better behaviour anyway.