Search packages, repositories and app categories

flutter_animated_reaction cover
Package detailsv0.0.2

flutter_animated_reaction

Flutter Animated Reaction is an animated reaction overlay(Example. Facebook, LinkedIn) which can be customized using your own reaction icons(images/gifs).

AndroidiOSWebmacOSWindowsLinux
30-day downloads
36
Likes
34
Pub points
130

Install package

flutter pub add flutter_animated_reaction

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Flutter Animated Reaction is a customizable animated overlay for social media-style reactions, similar to Facebook or LinkedIn. It allows developers to display animated reaction icons—such as images or GIFs—when users interact with content. The package supports multiple platforms including Android, iOS, Web, macOS, Windows, and Linux, making it ideal for cross-platform apps. With simple integration via pub add, it enhances user engagement through dynamic visual feedback.

Use cases

  • Social media app interactions
  • User reaction animations
  • Interactive post feeds
  • Engagement-driven UI elements
  • Real-time feedback in messaging apps

Key features

  • Customizable reaction icons
  • Support for images and GIFs
  • Cross-platform compatibility
  • Simple integration with Flutter
  • Animated overlay effects

Suitable for

  • Developers building social networking apps
  • UI designers seeking interactive feedback
  • Apps requiring real-time user reactions
  • Projects targeting multiple platforms
  • Teams wanting lightweight animation solutions

Considerations

  • Requires proper asset management for icons
  • Performance may vary with complex GIFs
  • Limited customization beyond icon and animation style
  • Best suited for moderate-scale animations
  • May need additional state management for complex workflows

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Flutter Animated Reaction

Flutter Animated Reaction is an animated reaction overlay(Example: Facebook, LinkedIn) which can be customized using your own reaction icons(images/gifs). Wherever your reaction button is on the screen, this package helps you to pop up an animated reaction overlay at the right location on the screen with your preferred reactions icon.

Demo

animated

Features

  • Customized reaction icon i.e. images, gifs can be added in the list
  • Cool animation to display the reaction overlay
  • Dragging any reaction icon generates nice animation
  • In built facebook reaction icons
  • Reaction sound feature

Getting started

import 'package:flutter_animated_reaction/flutter_animated_reaction.dart';

Usage

For better understanding, you can see example application.

AnimatedFlutterReaction().showOverlay(context: context,
                                      key: key,
                                      onReaction: (val){
                                         print(val);
                                      });
Parameters
Parameter Description
Key Global Key used in the reaction button . It is used to find the renderBox and measure it's position.
reactions List of all reaction icons which you want to show in the overlay.(Image/Gifs path)
onReaction(int) It is triggered when any of the reaction is tapped
backgroundColor It describes overlay background color
overlaySize It specifies overlay width
iconSize It can set the size of reaction icons. Default size is (45,45)

How to Contribute

  1. Fork it
  2. Create your feature branch (git checkout -b new-feature)
  3. Commit your changes (git commit -m 'Add some feature')
  4. Push to the branch (git push origin new-feature)
  5. Create new Pull Request

Categories

Dependencies

Dependency list 1 items

Source repository

Projects using this package

No data available yet.