Expand description
Badge — a pill-shaped label for tags, status indicators, and counts.
Badge renders a short piece of text inside a rounded-pill container.
Common uses include tag chips on list items, unread-count bubbles in
navigation rails, and severity labels in alert rows. The pill chrome
(corner radius, padding, surface tint) is driven by the active
BadgeStyle; callers may swap it per-instance (.style(...)) or
theme-wide via theme.style_slots.badge.
§When to use
- Inline chip that annotates another widget (version tag, “NEW” label).
- Standalone count indicator; pair with
SeverityBadgefor icon-backed status glyphs.
§Accessibility
Announces as Role::Label with its resolved text as the AT name.
The inner TextWidget is hidden from AT to avoid double-announcement;
the badge emits that label’s text runs from its own node instead, so a
reader can review the text by character, word and line rather than only
hear it.
let _badge = Badge::new(lit!("NEW"))
.background(Color::new(0.2, 0.6, 1.0, 1.0));§Touch and pen
Nothing to do, and it is worth saying why: a Badge carries no pointer
handler of any kind — no tap, no hover, no drag — so it is not a target,
takes no press and needs no widened hit area. Its only pointer-adjacent
feature is a tooltip, whose touch route is the long press the tooltip
package owns. A badge that an app makes tappable does so by wrapping it,
and the wrapper is the target.
Structs§
- Badge
- A pill-shaped label for displaying tags, counts, or status.