Custom Animate Button
custom_animate_btn
is a Flutter package that provides a sleek, customizable animated slider button for modern apps. Ideal for confirmation actions, logins, and unlock features. Built with smooth animations, gradient effects, and a clean UI.
Features
- 🎚️ Smooth sliding animation
- 🎨 Customizable colors and sizes
- 🔔 Completion callback
- 🌈 Gradient color effects during drag
- ⚙️ Configurable completion threshold
- 🔒 Persistent drag icon
Installation
Add to your pubspec.yaml
:
dependencies:
custom_animate_btn: ^1.0.3
Usage
import 'package:custom_animate_btn/custom_animate_btn.dart';
CustomAnimateBtn(
title: "Slide to Unlock",
onCompleted: () {
print("Unlocked!");
},
)
Example
import 'package:flutter/material.dart';
import 'package:custom_animate_btn/custom_animate_btn.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('CustomAnimateBtn Demo')),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
CustomAnimateBtn(
title: "Slide to Unlock",
completedText: "Unlocked!",
onCompleted: () {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text("Action completed!"))
);
},
width: 300,
height: 60,
icon: const Icon(Icons.lock_open, color: Colors.white),
),
const SizedBox(height: 20),
CustomAnimateBtn(
title: "Slide to Confirm",
completedText: "Confirmed!",
onCompleted: () {},
slidingColor: Colors.purple,
backgroundColor: Colors.grey[200]!,
),
],
),
),
),
);
}
}
Contact
GitHub: DilakshaDissanayake