Skip to content

This Flutter Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.

License

Notifications You must be signed in to change notification settings

pdenert/Animated-Gradient

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Animate Gradient

pub Animated-Gradient

This Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done. You can do amazing effects using the alignments. For More info read the docs below.

Usage

Create your first animated gradient.

The only two required arguments are the primaryColors and secondaryColors.

| primaryColors length must greater or equal to 2.| | secondaryColors length must be equal to primaryColors length.|

    import 'package:animate_gradient/animate_gradient.dart';

     AnimateGradient(
        primaryColors: const [
          Colors.pink,
          Colors.pinkAccent,
          Colors.white,
        ],
        secondaryColors: const [
          Colors.blue,
          Colors.blueAccent,
          Colors.white,
        ],
        child: YourWidget(),
      ),

drawing

Play with alignments.

Alignments are optional. You can pass any of the following alignments.

primaryBegin primaryEnd secondaryBegin secondaryEnd

With this in place you can have some crazy effects.

   import 'package:animate_gradient/animate_gradient.dart';

    AnimateGradient(
       primaryBegin: Alignment.topLeft,
       primaryEnd: Alignment.bottomLeft,
       secondaryBegin: Alignment.bottomLeft,
       secondaryEnd: Alignment.topRight,
       primaryColors: const [
         Colors.pink,
         Colors.pinkAccent,
         Colors.white,
       ],
       secondaryColors: const [
         Colors.white,
         Colors.blueAccent,
         Colors.blue,
       ],
       child: YourWidget(),
     ),

drawing

Available properties

Property Type Description
primaryColors List Starting colors of the animation.
secondaryColors List Ending colors of the animation.
primaryBegin AlignmentGeometry Starting alignment of primaryColrs.
primaryEnd AlignmentGeometry Ending alignment of primaryColrs.
secondaryBegin AlignmentGeometry Starting alignment of secondaryColors.
secondaryEnd AlignmentGeometry Ending alignment of secondaryColors.
duration Duration? Duration between the transition.
controller AnimationController?
You can pass your own animation controller and use that

to control animation however you want.
animateAlignments bool? If you want to animate alignments.
reverse bool? If you want to reverse the animation.
child Widget? You can pass your own widget.

Author

This plugin is developed by Vikas Kumar.

About

This Flutter Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Dart 92.7%
  • Swift 5.2%
  • Kotlin 1.6%
  • Objective-C 0.5%