TFlexFMXBadge

Small count or label indicator that can float over other controls (like notification badges).

Key Properties

Text: string
Badge text content (numbers, letters, or short text).

BadgeColor: TAlphaColor
Background color of the badge.

TextColor: TAlphaColor
Text color (default: White).

FloatingMode: Boolean
When True, badge floats over its target control.

TargetControl: TControl
Control that the badge should float over (when FloatingMode = True).

BadgePosition: TBadgePosition
Position relative to target: bpTopLeft, bpTopRight, bpBottomLeft, bpBottomRight, bpCenter, etc.

OffsetX / OffsetY: Single
Fine-tune badge position with pixel offsets.

AutoSize: Boolean
Automatically size badge to fit text content.

Badge1.Text := '5';
Badge1.BadgeColor := TAlphaColors.Red;

Badge1.FloatingMode := True;
Badge1.TargetControl := Button1;
Badge1.BadgePosition := bpTopRight;
Badge1.Text := '3';

Use FlexFMXCSS classes like 'badge-primary', 'badge-danger' for Bootstrap styling
Floating badges automatically stay on top of their target control
Badge auto-hides when text is empty