Search packages, repositories and app categories

ducafecatFlutter ecosystem guide
spring cover
Package detailsv2.0.2

spring

A simple & powerfull pre-built animation kit for faster and easy apps developement.

AndroidiOSWebmacOSWindowsLinux
pub.dev API documentation Source code
30-day downloads
848
Likes
254
Pub points
130

Install package

flutter pub add spring

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

Spring is a lightweight, pre-built animation kit for Flutter that simplifies and accelerates app development with ready-to-use animations. Designed for both simplicity and power, it enables developers to implement smooth, responsive transitions with minimal code. The package supports multiple platforms including Android, iOS, Web, macOS, Windows, and Linux, making it versatile for cross-platform projects. With intuitive APIs, Spring enhances UI interactivity and visual appeal without requiring deep animation expertise.

Use cases

  • Rapid UI prototyping
  • Interactive button effects
  • Smooth screen transitions
  • Loading state animations
  • Onboarding screens

Key features

  • Pre-built animation presets
  • Cross-platform compatibility
  • Minimal setup
  • Highly customizable
  • Built-in easing curves
  • Lightweight performance

Suitable for

  • Beginner Flutter developers
  • Fast-paced app development
  • UI-heavy applications
  • Design-focused projects
  • Teams prioritizing speed

Considerations

  • Limited customization beyond presets
  • May increase bundle size slightly
  • Best suited for simple to moderate animations
  • Not ideal for complex custom animation logic
  • Requires understanding of basic animation principles

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

Spring Logo

A simple & powerfull pre-built animation kit.

🔨 Installation

dependencies:
     spring: ^2.0.2

simple_fade

🎥 Spring Animations

⚙ Import
import 'package:spring/spring.dart';

🕹️ Usage

Spring.slide(
     slideType: SlideType.slide_in_right,
     child: FlutterLogo(),
),

🕹️ Advanced Usage

import 'package:flutter/material.dart';
import 'package:spring/spring.dart';
import 'package:test123/blue_card.dart';
import 'package:test123/red_card.dart';

class SpringExample extends StatelessWidget {
  final SpringController springController =
      SpringController(initialAnim: Motion.play);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: Spring.slide(
          springController: springController,
          slideType: SlideType.slide_in_right,
          delay: Duration(milliseconds: 500),
          animDuration: Duration(milliseconds: 1000),
          curve: Curves.easeInExpo,
          extend: 30,
          withFade: true,
          animStatus: (AnimStatus status) {
            print(status);
          },
          child: GestureDetector(
              onTap: () {
                springController.play(motion: Motion.reverse);
              },
              child: FlutterLogo()),
        ),
      ),
    );
  }
}

🎮 SpringController

SpringController allow you to control the animations without setting the setState.

//initial anim = Motion.play
final SpringController springController =
     SpringController(); 
// you can set the initial anim using initialAnim param..
final SpringController springController =
      SpringController(initialAnim: Motion.pause,);
Controlling the animations
GestureDetector(
          onTap: () {
            springController.play(
                motion: Motion.reverse,
                animDuration: Duration(milliseconds: 300),
                curve: Curves.bounceIn,
                delay: Duration(milliseconds: 900));
          },
          child: Spring.slide(
              springController: springController,
              slideType: SlideType.slide_in_right,
              delay: Duration(milliseconds: 500),
              animDuration: Duration(milliseconds: 1000),
              curve: Curves.easeInExpo,
              extend: 30,
              withFade: true,
              animStatus: (AnimStatus status) {
                print(status);
              },
              child: FlutterLogo()),
        ),

🔈 Animation Status

You can listen for animation Staus via animStatus callBack which returns AnimStatus enum.

  • AnimStatus.forward
  • AnimStatus.completed
  • AnimStatus.reverse
  • AnimStatus.dismissed
Spring.rotate(
     springController: springController,
     animStatus: (AnimStatus status) {
          print(status);
     },
     child: FlutterLogo()),

🐞 Bugs/Requests

If you encounter any problems please open an issue. If you feel the library is missing a feature, please raise a ticket on Github and we'll look into it. Pull request are welcome.

🙏 Thanks

📃 License

MIT License

Categories

Animation & Transition

Dependencies

Dependency list 4 items

Source repository

Projects using this package

No data available yet.