Flutter: Using Magic Container

Neetish Singh
2 min readJul 3, 2022

--

Introduction:

This article will help you to understand how to use Magic Container from Flutter’s pub.dev and utilizing it to enhance Container widget in flutter development.

Features & Options:

There are several types & features withing containers provided by Magic Containers in version 0.0.1 . Few types are listed below.

  1. Normal Containers: Magic Containers will work as usual containers if you will use the flags doMagic=false & doGradient=false .
Normal Container

2. Containers with Gradient: You can also convert a container to container having gradient based on the color selection you provide. To use it you need to provide a Color List in variable colors and doGradient=true.

MagicContainer(
colors: [Colors.amber, Colors.white, Colors.red],
doMagic: true,
milliseconds: 5,
);

The result will look like:

Magic Container with Gradient

3. Blinking Color Effect Container: You can also use Magic container to blink container with the set of colors provided after a given timestamp. It will keep blinking forever. To establish it you will need to provide timestamp value and doMagic=true.

Package Installation:

You can directly install the package using:

flutter pub add magiccontainer

It is available for all the Operating Systems.

What’s Next:

MagicContainer v 1.0.0 will contain:

  1. Glossy Effect
  2. Blurry & translucent Effect
  3. Custom Theme Merging

You can read more about it official pub.dev & to contact developer Neetish Singh

--

--