background_animated 0.4.0 copy "background_animated: ^0.4.0" to clipboard
background_animated: ^0.4.0 copied to clipboard

a package that provides animations to use in the background or foreground

License

Background animated #

Add cool effects, with plenty of customization!

Installation #

1. Depend on it #

Add this to your package's pubspec.yaml file:

dependencies:
    background_animated: ^0.4.0

2. Install it #

You can install packages from the command line:

$ pub get background_animated

Alternatively, your editor might support pub. Check the docs for your editor to learn more.

3. Import it #

Now in your Flutter code, you can use:

import 'package:background_animated/background_animated.dart';

Usage #

If you want to give YourWidget a 3D rain background, simply wrap it with the ParallaxRain widget, with YourWidget as the child parameter. You can also have the rain effect in the foreground, use multiple drop colors, adjust the speed, add trails to your drops and lots more!

Outlined shapes Angled filled shapes with fading trails

For example:

ParallaxRain(
    dropColors: [
        ...Colors.primaries,
        ...Colors.accents,
    ],
    child: Text(
        "Text Here",
    ),
),

If you want to give YourWidget a 3D starfield background, just wrap it with the Starfield widget, with YourWidget as the child parameter. You can also have the Starfield effect in the foreground, use multiple colors, adjust the speed, add trails to your shapes and more!

Outlined shapes with trails Filled shapes with trails

For example:

Starfield(
    colors: [
        ...Colors.primaries,
        ...Colors.accents,
    ],
    child: Text(
        "Text Here",
    ),
),

If you want to give YourWidget a fireworks background, just wrap it with the Fireworks widget, with YourWidget as the child parameter. You can also have the fireworks effect in the foreground, use multiple colors shapes and more!

Outlined shapes Filled shapes

For example:

Fireworks(
    shapeColors: [
        ...Colors.primaries,
        ...Colors.accents,
    ],
    particleColors: [
        ...Colors.primaries,
        ...Colors.accents,
    ],
    child: Text(
        "Text Here",
    ),
),

If you want to give YourWidget a perlin noise background, just wrap it with the PerlinNoise widget, with YourWidget as the child parameter. You can also have the perlin noise effect in the foreground, use multiple colors, widths, numbers, and more!

lots of thick lines Lots of thin lines A whole lot more thin lines

For example:

PerlinNoise(
    colors: [
        ...Colors.primaries,
        ...Colors.accents,
    ],
    child: Text(
        "Text Here",
    ),
),

Ideas??? #

Please feel free to suggest new animations / ideas and I will do my best implementing them and also don't forget to submit your suggestions for code / performance improvements

About me #

Visit my LinkedIn at https://www.linkedin.com/in/amr-elbasuony or Add me on discord via https://discord.com/users/zerstoria or Contact me by email: amrahmedelbasuony@gmail.com or Use whatsapp: https://wa.link/myun5k

6
likes
150
points
141
downloads

Publisher

unverified uploader

Weekly Downloads

a package that provides animations to use in the background or foreground

Repository (GitHub)
View/report issues

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on background_animated