Pulse · Story Reply — Social Flutter screen
Social
35 views

Pulse · Story Reply

Pulse · Story Reply is a production-ready Social Flutter screen from FlutterKit Pro, installable with flutterkit add social-story-reply.

Story Reply is the modal overlay Pulse shows when a viewer wants to answer someone's story privately. It renders over a translucent black scrim (55% opacity) so the current story stays visible but dimmed. Top-to-bottom: a full-bleed dimmed story fills the background via the _StoryBackdropPainter CustomPainter — a cool dusk gradient with a painted moon and layered hills — wrapped in a GestureDetector that fires onClose when tapped to dismiss. A SafeArea header row pairs a small 40x54 rounded story thumbnail (the same _StoryBackdropPainter) with a 'Replying to Maya Lin' title and an 'Only Maya can see your reply' privacy subline, plus a close IconButton. A Spacer pushes the interaction cluster to the bottom: a horizontally scrollable 62px reaction rail of six 52px circular chips (love, haha, wow, fire, clap, sad), each a colored Material icon that calls onReaction with its string id. Beneath it a pinned input bar sits on the _surface color with a top hairline — a rounded 'Send a reply…' pill and a gradient-filled circular send button (accent-to-brand indigo) wired to onSend. Palette is Pulse's dark near-mono with the #6E56F7 indigo brand and #9B8CFF accent; typography is the bundled Inter font. Fully self-contained pure Flutter with its own dark theme, SafeArea insets top and bottom, no network images, overflow-proof, and backend-agnostic through the injected onClose, onReaction and onSend callbacks.

Reveal the one-line command to drop this screen into your project.

Licensed for unlimited commercial projects · resale prohibited · License

What's included

  • _StoryBackdropPainter CustomPainter drawing a dusk gradient, moon and quadratic-bezier hills, reused full-bleed and as the header thumbnail
  • Six-item horizontal reaction rail (love/haha/wow/fire/clap/sad) as 52px circular chips, each firing onReaction with its string id
  • Author header chip with 'Replying to Maya Lin' title, 'Only Maya can see your reply' privacy line and a close IconButton
  • Pinned reply bar: rounded 'Send a reply…' pill plus a gradient indigo circular send button wired to onSend
  • Translucent black scrim with a tap-to-dismiss GestureDetector over the dimmed story that triggers onClose
  • Bundled Inter font, Pulse dark theme with #6E56F7 brand / #9B8CFF accent, double SafeArea and overflow-proof layout

Use cases

  • Let viewers send a private direct reply to a friend's story inside a social feed app
  • Offer one-tap emoji reactions to ephemeral stories without opening a full chat thread
  • Drop into a Stories or Close Friends feature as the reply-and-react overlay
  • Prototype a private story-response flow with mockable onReaction and onSend hooks

Related screens