playbit / docs

Box Styles

By default, boxes start out completely unstyled. You must set every property directly.

UIStyle

See PBUIStyle for a complete description of the structs fields.

Box Sizing

The following sizing modes are available to size boxes:

UISizeKind_Pixels          // size by pixels
UISizeKind_TextContent     // size of text content
UISizeKind_PercentOfParent // size as a percentage of the parent
UISizeKind_ChildrenSum     // size according to the total sum of the children
UISizeKind_Ratio           // size proportional to the size on the alternate axis

For convenience, the following macros are also defined. These are the preferred way of defining size attributes.

#define UI_px(x)         // pixels (scaled by backing buffer scale factor)
#define UI_dp(x)         // pixels (scaled by backing buffer scale factor)
#define UI_text_size(x)  // a percentage of the box's text size from [0-1]
#define UI_fill(x)       // a percentage of the parent's size from [0-1]
#define UI_child_size(x) // a percentage of the sum of the box's children from [0-1]
#define UI_ratio(x)      // a multiplier of the size along the alternate axis
#define UI_em(x)         // a multiplier of the top box's font size
#define UI_rem(x)        // a multiplier of the root box's font size
#define UI_vw(x)         // a fraction of the current view width [0-1]
#define UI_vh(x)         // a fraction of the current view height [0-1]

#define UI_size2(x, y)   // e.g. UI_size2(UI_px(10), UI_px(10))
#define UI_align2(x, y)  // e.g. UI_align2(UIAlign_Start, UIAlign_End)

Box Text

struct UIFont {
    PBStrSlice family; // font family name (e.g. PBStrLit("Inter"))
    f32        size;   // font size in pixels (e.g. 16.0)
    f32        weight; // font weight between 100-900
};

UIFont UIFontMake(PBStrSlice family, f32 size, f32 weight);

typedef u32 UITextAlign;
enum {
    UITextAlign_None,
    UITextAlign_TopLeft,
    UITextAlign_TopCenter,
    UITextAlign_TopRight,
    UITextAlign_CenterLeft,
    UITextAlign_Center,
    UITextAlign_CenterRight,
    UITextAlign_BottomLeft,
    UITextAlign_BottomCenter,
    UITextAlign_BottomRight,
    UITextAlign_COUNT,
};

typedef u32 UITextWrap;
enum {
    UITextWrap_None,
    UITextWrap_Word,
    UITextWrap_COUNT,
};

Color

#define UI_rgb(r, g, b)     // RGB color, components from 0-1
#define UI_rgba(r, g, b, a) // RGBA color, components from 0-1
#define UI_hex(hex)         // RGB color from hex code as a u24 (0xRRGGBB)
#define UI_hexa(hex)        // RGBA color from hex code as a u32 (0xRRGGBBAA)

Shadows

struct UIShadow {
    PBVector2 offset; // in pixels
    f32       blur;   // blur radius, in pixels
    f32       spread; // spread radius, in pixels
    PBColor   color;
    bool       inset;  // whether the shadow should be inset or outset
};

UIShadow UIShadowMake(PBVector2 offset, f32 blur, f32 spread, PBColor color, bool inset);