heart_overlay 1.3.0 copy "heart_overlay: ^1.3.0" to clipboard
heart_overlay: ^1.3.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.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:heart_overlay/heart_overlay.dart';

void main() {
  runApp(const MainApp());
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData.dark(useMaterial3: true),
      home: const HeartOverlayTestWidget(),
    );
  }
}

class HeartOverlayTestWidget extends StatelessWidget {
  const HeartOverlayTestWidget({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black45,
      appBar: AppBar(
        title: const Text('Heart Overlay'),
        centerTitle: true,
        backgroundColor: Colors.cyan,
      ),
      body: Column(
        children: [
          Expanded(
            child: HeartOverlay(
              duration: const Duration(seconds: 5),
              backgroundColor: Colors.black,
              tapDownType: TapDownType.single,
              // verticalOffset: 20,
              // horizontalOffset: -100,
              cacheExtent: 30,
              splashAnimationDetails: const SplashAnimationDetails(
                enableSplash: true,
                animationDuration: Duration(seconds: 3),
              ),
              icon: const Icon(
                Icons.favorite,
                color: Colors.redAccent,
                size: 100,
              ),
              onPressed: (numberOfHearts) {
                // Do something with the number of hearts or do something whenever the icon appears
              },
              // child: Center(
              //   child: ElevatedButton(
              //     onPressed: () {},
              //     child: const Text('Tap here'),
              //   ),
              // ),
            ),
          ),
          // Expanded(
          //   child: HeartOverlay(
          //     duration: const Duration(seconds: 2),
          //     backgroundColor: Colors.white10,
          //     tapDownType: TapDownType.single,
          //     icon: const Text('✌️'),
          //     splashAnimationDetails: const SplashAnimationDetails(
          //       enableSplash: true,
          //     ),
          //     size: 60,
          //     // Sometimes it might be nesessary to add vertical and horizontal offset
          //     verticalOffset: 20,
          //     horizontalOffset: -10,
          //     onPressed: (numberOfHearts) {
          //       // Do something with the number of hearts or do something whenever the icon appears
          //     },
          //     child: Center(
          //       child: ElevatedButton(
          //         onPressed: () {},
          //         child: const Text('Tap here'),
          //       ),
          //     ),
          //   ),
          // ),
        ],
      ),
    );
  }
}
8
likes
0
pub points
72%
popularity

Publisher

unverified uploader

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.

Repository (GitHub)
View/report issues

License

unknown (LICENSE)

Dependencies

flutter

More

Packages that depend on heart_overlay