sliding_action_button 1.0.0

Sliding action button package provides prebuilt functionality for sliding(swipe) action button with some predefined shapes

sliding_action_button

A customizable Flutter slide-to-confirm button. Reduces accidental triggers on destructive or irreversible actions by requiring the user to drag a thumb across a track.

Supports circle and square shapes, solid colors and gradients, async loader state, and haptic feedback.

---

Installation

Add to your pubspec.yaml:

dependencies:
  sliding_action_button: ^1.0.0

Then run:

flutter pub get

---

Usage

Circle (default)

SlideToActionButton(
initialSlidingActionLabel: 'Slide to confirm',
finalSlidingActionLabel: '✓ Confirmed',
enabledTrackDecoration: SlideTrackDecoration.fromColor(Colors.orange),
disabledTrackDecoration: SlideTrackDecoration.fromColor(Colors.grey),
thumbIcon: const Icon(Icons.check, color: Colors.orange),
onSlideActionCompleted: () {
debugPrint('Action confirmed');
},
)

Square

SlideToActionButton(
slideButtonShape: SlideButtonShape.square,
initialSlidingActionLabel: 'Slide to pay',
finalSlidingActionLabel: '✓ Payment sent',
enabledTrackDecoration: SlideTrackDecoration.fromGradient(
LinearGradient(colors: [Colors.orange, Colors.deepOrange]),
),
disabledTrackDecoration: SlideTrackDecoration.fromColor(Colors.grey),
thumbIcon: const Icon(Icons.payment, color: Colors.orange),
onSlideActionCompleted: () {
debugPrint('Payment confirmed');
},
)

With loader (async flow)

Use this when your action involves an async operation such as an API call. The button shows a spinner after the slide completes and resets once the operation finishes.

final controller = SlideToActionController();

SlideToActionButton(
slideToActionController: controller,
slideActionButtonType: SlideActionButtonType.slideActionWithLoaderButton,
initialSlidingActionLabel: 'Slide to confirm order',
finalSlidingActionLabel: 'Processing...',
enabledTrackDecoration: SlideTrackDecoration.fromColor(Colors.orange),
disabledTrackDecoration: SlideTrackDecoration.fromColor(Colors.grey),
thumbIcon: const Icon(Icons.check, color: Colors.orange),
onSlideActionCompleted: () async {
controller.loading();
await placeOrder();
controller.reset();
},
)

---

Parameters

Parameter	Type	Default	Description
initialSlidingActionLabel	String	required	Label shown before the slide completes
finalSlidingActionLabel	String?	null	Label shown after the slide completes. Falls back to initialSlidingActionLabel
onSlideActionCompleted	VoidCallback	required	Called when the slide completes
onSlideActionCanceled	VoidCallback?	null	Called when the user releases before the threshold
slideButtonShape	SlideButtonShape	circle	Shape of the thumb and track
slideActionButtonType	SlideActionButtonType	basicSlideActionButton	Whether to show a loader after completion
slideToActionController	SlideToActionController?	null	Controls loading and reset states externally
enabledTrackDecoration	SlideTrackDecoration	orange	Track decoration when enabled
disabledTrackDecoration	SlideTrackDecoration	grey	Track decoration when disabled
thumbIcon	Widget?	null	Icon inside the thumb
thumbEnabledColor	Color	white	Thumb color when enabled
thumbDisabledColor	Color	white	Thumb color when disabled
height	double	56	Height of the track
width	double?	null	Width of the track. Fills available width when null
thumbSize	double	50	Width and height of the thumb
thumbBorderRadius	double?	null	Thumb corner radius. Derived from shape when null
parentBoxRadiusValue	double?	null	Track corner radius. Derived from shape when null
leftEdgeSpacing	double	3	Space between left edge and thumb at rest
rightEdgeSpacing	double	3	Space between right edge and thumb at full travel
completionThreshold	double	0.85	Fraction of track width required to trigger completion
enableHapticFeedback	bool	true	Fire haptic on completion
animationDuration	Duration	700ms	Snap-back and label crossfade speed
loaderColor	Color	white	Color of the loading spinner
isEnabled	bool	true	Whether the button accepts interaction
initialSlidingActionLabelTextStyle	TextStyle?	null	Text style for the initial label
finalSlidingActionLabelTextStyle	TextStyle?	null	Text style for the final label

---

Migrating from 0.0.8

If you are upgrading from version 0.0.8, see the Migration Guide for the full list of breaking changes and before/after code examples.

---

Issues and feedback

Found a bug or need a feature? Open an issue on GitHub