thanos_snap_effect 0.0.8 copy "thanos_snap_effect: ^0.0.8" to clipboard
thanos_snap_effect: ^0.0.8 copied to clipboard

High-performance, high-customizable, and easy-to-use "Thanos Snap" effect for Flutter.

example/example.md

Example code for the Snappable widget:

import 'package:example/random_image.dart';
import 'package:flutter/material.dart';
import 'package:thanos_snap_effect/thanos_snap_effect.dart';

class AnimationControllerExampleScreen extends StatefulWidget {
  static const routeName = '/animation_controller_example_screen';

  const AnimationControllerExampleScreen({super.key});

  @override
  State<AnimationControllerExampleScreen> createState() => _AnimationControllerExampleScreenState();
}

class _AnimationControllerExampleScreenState extends State<AnimationControllerExampleScreen>
    with SingleTickerProviderStateMixin {
  late final _animationController = AnimationController(
    vsync: this,
    duration: const Duration(milliseconds: 1500),
  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // backgroundColor: Colors.black,
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: const Text('Animation Controller Example'),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          const Spacer(
            flex: 1,
          ),
          Snappable(
            animation: _animationController,
            outerPadding: const EdgeInsets.all(40),
            style: const SnappableStyle(
              particleSize: SnappableParticleSize.absoluteDp(
                width: 8,
                height: 8,
              ),
            ),
            child: const RandomImage(),
          ),
          const Spacer(),
          Snappable(
            animation: _animationController,
            style: const SnappableStyle(
              particleSize: SnappableParticleSize.squareFromRelativeHeight(0.03),
            ),
            child: const FlutterLogo(
              size: 200,
              style: FlutterLogoStyle.stacked,
            ),
          ),
          const Spacer(),
          Padding(
            padding: const EdgeInsets.all(32.0),
            child: AnimatedBuilder(
              animation: _animationController,
              builder: (BuildContext context, Widget? child) {
                return Slider(
                  value: _animationController.value,
                  onChanged: (value) => _animationController.value = value,
                );
              },
            ),
          ),
          const Spacer(),
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          _animationController.forward(from: 0);
        },
        tooltip: 'Start',
        child: const Icon(Icons.play_arrow),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }
}

copied to clipboard
41
likes
160
points
574
downloads

Publisher

unverified uploader

Weekly Downloads

2024.09.16 - 2025.03.31

High-performance, high-customizable, and easy-to-use "Thanos Snap" effect for Flutter.

Repository (GitHub)

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on thanos_snap_effect