Confetti Package in Flutter

Today I’ll take an in-depth look at the confetti package in my app. It is published by the FunWithFlutter team. It is a celebrating animation by blasting colorful confetti around the screen.

Installation and importing of the package are similar to all other packages. Its latest release version is 0.5.4.+1for the time being. The usage of the widget is demonstrated with default values:

ConfettiWidget(
    confettiController: _controller,
    emissionFrequency: 0.02,
    numberOfParticles: 10,
    maxBlastForce: 20,
    minBlastForce: 5,
    blastDirectionality: BlastDirectionality.directional,
    blastDirection: pi,
    gravity: 0.2,
    shouldLoop: false,
    displayTarget: false,
    colors: null,
    minimumSize: const Size(20, 10),
    maximumSize: const Size(30, 15),
    particleDrag: 0.05,
    canvas: MediaQuery.of(context).size,
    child: null,
)

You can watch the video to imagine the widget.

Confetti Package

First, we need to define a ConfettiController which extends ChangeNotifier. Its duration is set to 30 seconds as default. It has two methods which are play and stop.

The emissionFrequency is set to 0.02 and should be a double value between 0 and 1. The higher the value the higher the likelihood that particles will be emitted on a single frame.

The numberOfParticles to be emitted per emission. It is an int value and the default is set to 10. You need to consider that increasing this property can cause some performance issues. So, 10 is good!

The maxBlastForce and minBlastForce will determine the maximum and minimum blast force applied to a particle within its first 5 frames of life. They are double values and the default of maxBlastForce is set to 20 and the default of minBlastForce is set to 5.

The blastDirectionality is an enum that takes one of two values — directional or explosive. The default is set to directional, but I like the explosive one.

The gravity is the speed at which the confetti will fall. The higher the gravity the faster it will fall. It can be set to a value between `0` and `1` Default value is `0.1`. At that point, you need to measure the gravity while the app is in use. Look here for more info.

You can also try the web version of this package from here.

deremakif/ConfettiApp