gradient_containers_plus #

Jam Ali Hassan
Flutter Developer

Overview #

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.

Installation #

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

dependencies:
  gradient_containers_plus: ^1.0.6

Usage Examples #

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'), ), )

Features #

✨ 6 pre-designed gradient container templates:

• 🎨 Vertical Gradient Container with customizable colors and direction
• 🔄 Radial Gradient Container with adjustable radius and center point
• 🌈 Sweep Gradient Container with configurable start and end angles
• ✨ Animated Gradient Container with smooth color transitions
• 🌟 Glassmorphic Gradient Container with blur and transparency effects
• 💫 Neon Gradient Container with customizable glow effects

🎯 Additional Features:

• 📱 Responsive design with flexible width and height
• 🎨 Customizable borders, shadows, and corner radius
• 🔌 Easy integration with any Flutter widget
• 📚 Comprehensive documentation and examples
• 💻 Full Platform Support:
  • Android ✓
  • iOS ✓
  • Web ✓
  • Windows ✓
  • macOS ✓
  • Linux ✓

Customization #

Each container can be customized with:

• 🎨 Custom colors and gradients
• 🔲 Border radius and width
• 📐 Container dimensions
• 📏 Padding and margin
• ✨ Specific effects (blur, glow, animation duration)
• 🌗 Shadow properties
• 📍 Child widget positioning

Documentation #

For detailed documentation, please visit our API Reference.

Additional Information #

• 📦 Pub.dev Package
• 💻 GitHub Repository
• 🐛 Issue Tracker

Contributing #

We welcome contributions! To contribute:

1. 🍴 Fork the repository
2. 🌿 Create your feature branch
3. ✍️ Commit your changes
4. 🚀 Push to the branch
5. 📬 Create a Pull Request

License #

This project is licensed under the MIT License - see the LICENSE file for details.

Contact #

• 👨‍💻 Developed by Jam Ali Hassan
• 🌐 Portfolio
• 📧 Email: jamalihassan0307@gmail.com
• 🔗 LinkedIn