tiktok_double_tap_like

Package Overview

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

A Flutter package that replicates TikTok's double-tap-to-like feature with smooth, customizable heart animations. It allows developers to integrate a responsive double-tap gesture that triggers a heart icon animation, enhancing user engagement in social media apps. The package supports custom heart icons and animation styles, making it easy to match app aesthetics. Compatible across Android, iOS, Web, macOS, Windows, and Linux, it’s ideal for content-driven platforms seeking interactive feedback mechanisms.

Use cases

Social media apps
Video sharing platforms
Content discovery interfaces
User engagement features
Interactive storytelling apps

Key features

Double-tap to like gesture
Customizable heart animations
Support for multiple platforms
Configurable animation speed
Easy integration with existing UI
Heart icon customization

Suitable for

Developers building video-centric apps
Teams wanting TikTok-style interactions
Apps focused on user engagement
Cross-platform social features
UI designers seeking animated feedback

Considerations

May require gesture detector optimization
Animation performance on low-end devices
Potential overlap with other tap gestures
Limited to like functionality only
Requires careful handling of rapid double taps

Original README

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

TikTok Double Tap Like

About

TikTok Double Tap Like is a Flutter package that provides a widget that can be used to like a video by double tapping on it, just like TikTok.

Example

DoubleTapLikeWidget(
      onLike: (likeCount) {
        //Do something when the user double taps
      },
      likeWidget: const Image(image: AssetImage('assets/icons/heart.png')),
      likeWidth: 200,
      likeHeight: 200,
      child: VideoPlayer(),
    )

Notes

You have to provide a widget that will be displayed when the user double taps on the screen, whether Text, Icon...etc. You can use the likeWidget property to provide that widget.
You can also provide the width and height of the widget using the likeWidth and likeHeight properties. The default values are 200 each.
You have the likeCount param in onLike in case you want to know how many times the user has liked the video.
It's pretty efficient and performant, I've created the animation explicitly using AnimationController, Animation, Tween and AnimatedBuilder. Also, there's an applied mechanism to removing the added hearts off of the screen.

Help me

If you like this package you can support me on

Search packages, repositories and app categories

Install package