spring

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

Spring は、Flutter 向けの軽量で事前に構築されたアニメーションキットであり、すぐに使えるアニメーションを提供することでアプリ開発を簡素化し、高速化します。シンプルさとパワフルさを兼ね備え、最小限のコードで滑らかで応答性のある遷移を実装できます。このパッケージは Android、iOS、Web、macOS、Windows、Linux など複数のプラットフォームをサポートしており、クロスプラットフォームプロジェクトに適しています。直感的な API を備えており、アニメーションの専門知識がなくても UI のインタラクティビティと視覚的魅力を高めます。

用途

迅速なUIプロトタイピング
インタラクティブなボタンエフェクト
スムーズな画面遷移
読み込み状態のアニメーション
オンボーディング画面

主な機能

事前に構築されたアニメーションプリセット
クロスプラットフォーム互換性
最小限のセットアップ
非常にカスタマイズ可能
組み込みのイージングカーブ
軽量なパフォーマンス

適している対象

初心者のFlutter開発者
高速なアプリ開発
UI中心のアプリケーション
デザインに焦点を当てたプロジェクト
スピードを重視するチーム

注意事項

プリセットを超えるカスタマイズは限られている
バンドルサイズがわずかに増加する可能性があります
シンプルから中程度のアニメーションに最適
複雑なカスタムアニメーションロジックには適していない
基本的なアニメーション原則の理解が必要です

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

A simple & powerfull pre-built animation kit.

🔨 Installation

dependencies:
     spring: ^2.0.2

🎥 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

A special thanks to Felix Blaschke for his simple_animations & supercharged packages. This package literally depends on it.
Thanks to gskinner.com for universal_platform package.

📃 License

MIT License

パッケージ、リポジトリ、アプリカテゴリを検索

パッケージをインストール