heart_overlay 1.1.0 heart_overlay: ^1.1.0 copied to clipboard
The HeartOverlay widget can be used to create a fun and interactive overlay that displays a heart animation when the user taps on the screen.
Heart Overlay Widget π #
The HeartOverlay
widget can be used to create a fun and interactive overlay that displays a heart animation when the user taps on the screen. It can be used as a decorative element for apps that require a playful or romantic touch, such as dating apps, greeting card apps, or social media apps.
A screen record will be provided soon
Features π€© #
- Displays a heart-shaped icon overlaid on top of eachother when tapped in quick succession while shrinking and fading at the same time just like social media apps (i.e Tik tok, Instagram).π
- The displayed icon can be styled however you like.π€
- The overlay background can be customized however you like.βοΈ
Getting started π€ #
To use this package, add heart_overlay
as a dependency in your file.
Then import
import 'package:heart_overlay/heart_overlay.dart';
Usage π§ #
Simple usage:
HeartOverlay();
More customizability:
HeartOverlay(
icon: Icon(
Icons.abc,
color: Colors.cyan,
),
verticalOffset: 10, // Vertical Offset from tap position
horizontalOffset: 10, // Horizontal Offset from tap position
duration: Duration(milliseconds: 800), // Icon to stay on screen duration
backgroundWidget: Image.asset('assets/image.png'), // Overlay container background
tapDownType: TapDownType.double, // The animation trigger type
cacheExtent: 10, // The cache extent
onPressed: (numberOfHearts) {
// Do something with the number of hearts shown or do something whenever the icon appears
},
),
Planning to add β #
- Check out the CHANGELOG for next planned updates.
Common Errors π #
If you get errors like forces infinite height
/forces infinite width
when used in a Column
, Row
or Flex
widget:
Specify a desired height
/width
OR
Wrap the HeartOverlay
in an Expanded
/Flexible
widget.
And if an Expanded
widget is used, height
/width
properites are basically useless.
Additional information βΉοΈ #
This package is available on GitHub and Pub.dev. π
If you encounter any issues or would like to contribute to the package, feel free to open a GitHub issue. Contributions are welcome and appreciated.π
Remember to leave a likeπ here and a starβ on gihub to help expose useful packages like these to others and that would be much appreciated. Thank you! π€