Pulse · Message Reactions
Pulse · Message Reactions is a production-ready Social Flutter screen from FlutterKit Pro, installable with flutterkit add social-chat-reactions.
Message Reactions renders the full long-press context state for a Pulse chat message. Behind everything sits the live thread in a SafeArea Column: a top bar with a back IconButton, a gradient _MonogramPainter avatar showing 'MS', and the contact name Mira Sol, followed by a ListView of received and sent bubbles. A received bubble already carries an applied reaction pill (a painted heart plus a '2' count), and the sent bubble uses the indigo #6E56F7 brand fill. A 60%-opacity black scrim dims that thread and, tapped, fires onDismiss. Floating above it, a centered Column stacks three elements: a pill-shaped reaction picker bar of five painted glyphs (heart, laugh, wow, sad, star) plus a circular add-more button, each firing onReact with its type; the lifted selected bubble outlined in brand indigo; and a 220-wide action menu listing Reply, Copy, Forward, Pin and a danger-red Delete, each divided by hairlines and wired to onAction with its label. All glyphs are drawn by the emoji-free _ReactionBubblePainter (heart via cubic Path, five-point star via trig, and smiley faces built from arcs and dots for eyes and mouths), so there is no NO-GLYPH font risk. Self-contained pure Flutter on a near-mono dark palette (#0B0B0F background, #15151B surfaces) with the bundled Inter font, its own dark ThemeData, and an overflow-proof Stack layout. Backend-agnostic and drop-in: every interaction routes through the injected onBack, onReact, onAction and onDismiss callbacks, with no network images.
Reveal the one-line command to drop this screen into your project.
Licensed for unlimited commercial projects · resale prohibited · License
What's included
- ✓_ReactionBubblePainter: emoji-free painted heart, five-point star, and laugh/wow/sad smiley faces (arc and dot eyes, smile/frown/open mouths)
- ✓Pill-shaped reaction picker bar of five reaction glyphs plus a circular add-more button, each firing onReact with its type or 'more'
- ✓220-wide context action menu (Reply, Copy, Forward, Pin, danger-red Delete) with hairline dividers, each routed through onAction
- ✓Dimmed base thread with _MonogramPainter gradient avatar, received/sent bubbles, and an already-applied reaction pill with count
- ✓60%-opacity black scrim wired to onDismiss and a brand-indigo-outlined lifted selected bubble that anchors the overlay
- ✓Bundled Inter font, own dark ThemeData, SafeArea Stack layout and injected onBack/onReact/onAction/onDismiss callbacks
Use cases
- ✓Drop into a chat app to power the long-press emoji-reaction and message-action overlay
- ✓Ship tap-to-react quick reactions with count pills on incoming and outgoing message bubbles
- ✓Provide the Reply/Copy/Forward/Pin/Delete context menu for any messaging thread
- ✓Demonstrate painter-only reaction glyphs that render identically across devices without emoji fonts
