holdable_button 0.0.12 copy "holdable_button: ^0.0.12" to clipboard
holdable_button: ^0.0.12 copied to clipboard

A Flutter plugin that enables users to create buttons with a hold gesture, triggering a loading animation around the button while held.

Holdable Button Flutter Plugin #

Holdable Button is a Flutter plugin that allows you to create interactive buttons with a unique animation. It enables users to hold a button, displaying a loading animation along its border, and then triggering a callback once the animation completes.

Demo 🎥 #

edge loading type:

voice oval

rectangle square

filling loading type:

long circle

Benefits 🚀 #

  • Interactive Animation: Engage users with a button that responds to long presses, offering an interactive and visually appealing experience.

  • Customizable: Tailor the button to match your app's design by adjusting parameters such as button color, loading color, border radius, child widget, animation duration, and start position.

  • User Engagement: Encourage users to interact with your app by introducing a novel way to trigger actions.

How to Use 🛠️ #

  1. Add the Holdable Button plugin to your pubspec.yaml file:

    dependencies:
      holdable_button: any
    
  2. Install the plugin by running:

    flutter pub get
    
  3. Import the package in your Dart code:

    import 'package:holdable_button/holdable_button.dart';
    
  4. Implement the HoldableButton widget:

    HoldableButton(
      loadingType: LoadingType.edgeLoading,
      width: 300,
      height: 200,
      buttonColor: Colors.blue,
      loadingColor: Colors.white,
      radius: 15.0,
      child: Text('Hold Me'),
      duration: 5,
      startPoint: 0.25,
      hasVibrate: true,
      onConfirm: () {
        // Callback when animation completes
      },
    )
    

Customization ⚙️ #

The HoldableButton widget supports the following parameters:

  • loadingType: the loading type: edgeLoading or fillingLoading.
  • buttonColor: The color of the button.
  • loadingColor: The color of the loading animation.
  • radius: The border radius of the button.
  • child: The widget inside the button.
  • duration: The duration of the animation in seconds.
  • startPoint: Start position in edgeLoading type.
  • hasVibrate: Enable Vibration after loading complete.
  • onConfirm: Callback when the animation completes.

Feel free to experiment with these parameters to achieve the desired look and behavior.

Contributing 🤝 #

Contributions are welcome! Please feel free to submit issues or pull requests.

21
likes
150
pub points
70%
popularity

Publisher

unverified uploader

A Flutter plugin that enables users to create buttons with a hold gesture, triggering a loading animation around the button while held.

Repository (GitHub)
View/report issues

Topics

#holdable #button #animation #loading #ui

Documentation

API reference

License

MIT (license)

Dependencies

flutter, flutter_web_plugins, plugin_platform_interface, web

More

Packages that depend on holdable_button