2020.04.11

This write-up outlines some of the implementation details of the
microui library. At the time of writing this
microui is version 2.01

Microui is a tiny immediate mode UI library written in portable ANSI C — the library itself
doesn’t do any drawing but instead takes user input events (eg. mouse clicks
and key presses), processes the UI and generates an iterable list of draw
commands (eg. “draw rectangle”, “draw text”). The library’s goals are as
follows:

• small (~1110 sloc)
• simply implemented
• easy to use
• easy to extend with custom controls
• operating within a fixed memory region (never calls malloc or friends)

Due to these goals, some of the choices made during its implementation differ
from other immediate mode libraries, and thus the project might be less useful
for certain scenarios. Generally the library is a good choice if:

• you want something small without too many built-in controls
  besides the basics, eg. you don’t need a color picker
• you’re planning to use a lot of custom controls or are aiming for a
  specific visual style and are happy to implement your own custom
  controls
• you’re targeting a less-common platform which uses non-standard or
  custom-written rendering, eg. MS-DOS
• you’re targeting a platform where heap allocations might cause
  an issue, eg. a long running process on an embedded device
• you want something lightweight to use as a base for a heavier
  UI library

Windows And Controls

At the beginning of each frame microui takes user input — this is done by
passing input events to the mu_input... functions. After handling input
mu_begin is called and the UI itself is processed, all controls must exist
within a window, thus the mu_begin_window function must be the next thing
called.

Microui uses a number of stacks internally:

• container_stack: stack of all current containers (windows and panels)
• clip_stack: current “clipping” rectangle — when a clipping rectangle is pushed it is intersected with the last rectangle on this stack
• id_stack: when a control id is generated (mu_get_id) the id at the top of this stack is used as its initial hash. An id in microui is a 32bit unsigned integer
• layout_stack: the current state of the UI layout, eg. where the next control should be placed, current indentation level, dimensions of the current layout region

When we call mu_begin_window an id is generated from the window title, the
mu_Container for that window is pushed to the container_stack, the generated
id is