gradient_containers_plus #

A Flutter package that provides beautiful and customizable gradient container templates for your Flutter applications. This package offers pre-designed container widgets with various gradient styles, shadows, and rounded corners to enhance your app's visual appeal.

Developer #

Developed by Jam Ali Hassan

• 🌐 Portfolio
• 📧 Email: jamalihassan0307@gmail.com
• 🔗 LinkedIn
• 💻 GitHub

Features #

• 6 pre-designed gradient container templates
• Multiple gradient types (Linear, Radial, Sweep)
• Advanced effects (Glassmorphic, Neon)
• Animated gradients
• Responsive design with flexible width
• Easy to integrate and use

Getting started #

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

dependencies:
  gradient_containers_plus: ^1.0.1

Usage #

Import the package in your Dart code:

import 'package:gradient_containers_plus/gradient_containers_plus.dart';

Available Containers #

1. Vertical Gradient Container

   VerticalGradientContainer(
     height: 150,
     colors: const [Colors.blue, Colors.purple],
     child: const Center(child: Text('Vertical Gradient')),
   )
   

2. Radial Gradient Container

   RadialGradientContainer(
     height: 150,
     colors: const [Colors.orange, Colors.red],
     radius: 0.85,
     child: const Center(child: Text('Radial Gradient')),
   )
   

3. Sweep Gradient Container

   SweepGradientContainer(
     height: 150,
     colors: const [Colors.green, Colors.teal, Colors.blue],
     startAngle: 0,
     endAngle: 2 * 3.14159,
     child: const Center(child: Text('Sweep Gradient')),
   )
   

4. Animated Gradient Container

   AnimatedGradientContainer(
     height: 150,
     colors: const [Colors.purple, Colors.blue, Colors.purple],
     duration: const Duration(seconds: 2),
     child: const Center(child: Text('Animated Gradient')),
   )
   

5. Glassmorphic Gradient Container

   GlassmorphicGradientContainer(
     height: 150,
     colors: const [Colors.white, Colors.white],
     blurSigma: 10,
     borderWidth: 1,
     child: const Center(child: Text('Glassmorphic Effect')),
   )
   

6. Neon Gradient Container

   NeonGradientContainer(
     height: 150,
     colors: const [Color(0xFF00FF87), Color(0xFF60EFFF)],
     glowIntensity: 0.5,
     glowSpread: 2,
     child: const Center(child: Text('Neon Glow')),
   )
   

Customization #

Each container can be customized with:

• Custom colors
• Border radius
• Width and height
• Padding and margin
• Specific effects (blur, glow, animation duration)

Additional information #

For more information about this package, visit:

• GitHub Repository
• Pub.dev Package

To contribute to this package:

1. Fork the repository
2. Create your feature branch
3. Commit your changes
4. Push to the branch
5. Create a new Pull Request

For issues and feature requests, please use the GitHub issue tracker.