UI Components

Ready-made widgets - buttons, meters, frames, images - drawn in the firmware's style

These sit one level above Graphics API: each is a small pile of primitives, so a tapp looks like it belongs on the device. They take the same gfx_t* and obey the same clip state; ui_draw_frame() and ui_draw_scrollbar() draw in colour 1 regardless of the current colour.

Sizes are mostly fixed by the design rather than by arguments - ui_draw_scrollbar()'s track is always 8px wide - so x/y place a known shape rather than defining one. Where a widget does take w/h, they are the outer bounds.

Images and animations

gfx_img_t comes out of the asset pipeline: drop a PNG or GIF in the tapp's assets/ folder and tapp-build compiles it into a gfx_img_t plus an extern declaration in the generated assets header. A GIF becomes a multi-frame image; ui_draw_anim() takes the frame index directly and wraps it, so drive it from os_tick_get() divided down to the desired frame rate - and return true from tick() while the animation is playing; otherwise no frames are scheduled for it. (Not ui_get_frame(): that counts paints, so it stalls as soon as frames stop being requested.)

ui_draw_img(gfx, 20, 20, &asset_logo);
ui_draw_anim(gfx, 120, 60, (uint16_t)(os_tick_get() / 80), &asset_dance_party);
ui_hints_set((const tapp_hint_cell_t[HintsActionsTotal]){[HintPress1] = {"play", gfx_icon(GfxIconPlay)}});

ui_draw_anim(gfx, x, y, m->loop_frame, gfx_anim(GfxAnimLoopToPlay));