tactile_loading_button 0.0.1

A customizable Flutter loading button with tactile feedback

Tactile Loading Button

A lightweight, high-utility Flutter package that converts a standard button into a smooth loading spinner during asynchronous operations. It features a tactile, responsive shrink/bounce animation upon physical interaction.

Features

• Tactile Feedback: Shrinks slightly when pressed down and pops back up on release, mimicking native platform physics.
• Asynchronous State Handling: Automatically morphs into a loading circle when a Future triggers, and disables interaction to prevent multi-click bugs.
• Customizable Styling: Adjust custom widths, heights, colors, custom spinners (loadingWidget), and background morph durations.
• Zero External Dependencies: Built entirely with native Flutter material and animation tools.

Installation

Add tactile_loading_button to your pubspec.yaml file:

dependencies:
  tactile_loading_button: ^1.0.0

Or run the following command in your terminal:

flutter pub add tactile_loading_button

Usage

Import the package in your Dart file:

import 'package:tactile_loading_button/tactile_loading_button.dart';

Implement it inside your widget tree. Ensure your onPressed callback returns a Future:

TactileLoadingButton(
  width: 200,
  height: 50,
  color: Colors.blueAccent,
  borderRadius: BorderRadius.circular(10),
  onPressed: () async {
    // Perform async task (e.g., API call, Database write)
    await Future.delayed(const Duration(seconds: 3));
  },
  // Define a complex loading widget (Row with Text)
  loadingWidget: Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      const SizedBox(
        width: 24,
        height: 24,
        child: CircularProgressIndicator(color: Colors.white),
      ),
      const SizedBox(width: 12),
      const Text(
        'Processing...',
        style: TextStyle(color: Colors.white, fontSize: 16),
      ),
    ],
  ),
  child: const Text(
    'Submit Form',
    style: TextStyle(color: Colors.white, fontSize: 16),
  ),
)

Parameters

Parameter	Type	Default	Description
onPressed	Future<void> Function()	Required	Asynchronous action executed when tapped. Keeps button loading until resolved.
child	Widget	Required	Label/Content of the button when idle (e.g., Text, Icon).
loadingWidget	Widget?	CircularProgressIndicator	Custom loading animation spinner.
width	double	200	Regular horizontal width of the button.
height	double	50	Operational height of the button.
color	Color?	Theme.primaryColor	Button background color.
borderRadius	BorderRadius?	BorderRadius.circular(8)	Inherent shape curving of the button.
pressDuration	Duration	100ms	Transition speed of the physical tap effect.
loadingDuration	Duration	300ms	Shifting speed from button to circle spinner.

License

This project is licensed under the MIT License - see the LICENSE file for details.