HoldToConfirmButton

This package provides a HoldToConfirmButton widget for Flutter apps. It allows users to hold down the button, which visually fills up as it's pressed. Upon complete fill, a designated action is triggered.

View Github

Installation

Add the hold_to_confirm_button package as a dependency in your pubspec.yaml file:

dependencies:
  hold_to_confirm_button: ^latest_version # Replace with the latest version available on pub.dev
YAML

Import the package in your Flutter project:

import 'package:hold_to_confirm_button/hold_to_confirm_button.dart';
Dart

Usage

Default values:

HoldToConfirmButton(
  onProgressCompleted: () {
    // Handle the completed progress here
  },
  child: const Text('Hold to increase',
    style: TextStyle(color: Colors.white),
  ),
)
Dart

default button

Custom values:

HoldToConfirmButton(
  onProgressCompleted: () {
    // Handle the completed progress here
  },
  child: const Text('Hold to increase'
    style: TextStyle(color: Colors.white),
  ),
  hapticFeedback: false,
  backgroundColor: Colors.green,
  borderRadius: BorderRadius.all(
    Radius.circular(12),
  ),
)
Dart

custom button

Customization

The HoldToConfirmButton widget offers various customization options to match your app's design:

  • child: The widget displayed within the button area (e.g., Text, Icon).
  • hapticFeedback: Enables or disables haptic feedback on button press (defaults to true).
  • backgroundColor: Sets the background color of the button.
  • borderRadius: Defines the border radius of the button.