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.

Demo Animation

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

Libraries

custom_animate_btn