搜索插件、代码仓与 APP 分类

spring 封面
插件详情v2.0.2

spring

一个简单而强大的预构建动画套件,可加快应用开发速度并简化开发流程。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
848
喜欢数
254
Pub 分数
130

安装插件

flutter pub add spring

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

Spring 是一个轻量级的预构建动画工具包,专为 Flutter 设计,可简化并加速应用开发,提供即用型动画。它兼顾简洁与强大,使开发者能够以最少的代码实现流畅、响应迅速的过渡效果。该包支持 Android、iOS、Web、macOS、Windows 和 Linux 等多个平台,适用于跨平台项目。通过直观的 API,Spring 能够增强用户界面的交互性和视觉吸引力,而无需深入的动画专业知识。

适合场景

  • 快速UI原型设计
  • 交互式按钮效果
  • 平滑的屏幕过渡
  • 加载状态动画
  • 引导屏幕

主要特点

  • 预构建的动画预设
  • 跨平台兼容性
  • 最小设置
  • 高度可定制
  • 内置缓动曲线
  • 轻量级性能

适合对象

  • 初学者 Flutter 开发者
  • 快速应用开发
  • 以UI为主的应用程序
  • 注重设计的项目
  • 注重速度的团队

使用建议

  • 超出预设之外的自定义功能有限
  • 可能会略微增加包大小
  • 最适合简单到中等的动画
  • 不适合复杂的自定义动画逻辑
  • 需要了解基本的动画原理

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

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

所属分类

依赖

依赖清单 4 项

源码仓库

使用此插件的项目

暂无相关数据。