Components / Actions
Reactions
Reaction buttons with a count each, as under a message or a post.
Functions: cui_reactions
Usage
static cui_reaction re[] = { { CUI_ICON_THUMBS_UP, 12, true }, { CUI_ICON_HEART, 4, false } };
int changed = cui_reactions(ui, "reactions", re, 2); /* index that toggled, or -1 */Clicking toggles active and adjusts count; the number rolls up or down and the icon pops.
Returns the index of the reaction that was clicked this frame, or -1. re is your array and the library writes to it: a click flips active and adds 1 to count or takes 1 away, and count never goes below 0. Send the change to your server when the call returns an index. A count you change yourself, such as one that arrives from the network, rolls to its new value in the same way. Each cui_reaction is an icon, a count and whether the current user has reacted. The id keeps the animation of each pill by its position in the array, so keep the array in a stable order.
Keyboard
- Tab moves through the reactions, and Enter or Space toggles the focused one.
cui_reaction
| Field | Type | Description |
|---|---|---|
icon | const char * | An icon: a CUI_ICON_* constant, or a string from another icon font. |
count | int | the number beside the icon; a click adds or takes away 1 |
active | bool | the user has reacted: the pill is highlighted; a click flips it |
Related
- Speed dial: A round floating button that fans out a few related actions.
- Status button: A button that shows the progress of the work it started: a spinner while busy, then a check or an error.
- Theme switcher and toggle: Controls that switch the app between light, dark and the system theme.
- Confirm button: A button for destructive actions that asks for a second click before it fires.