responsive_grid_layout
A powerful, customizable responsive grid widget for Flutter with automatic width calculation and flexible layout options.
✨ Features
- 🎯 Automatic width calculation - Perfect item sizing based on available space
- 📱 Responsive by default - Adapts to different screen sizes automatically
- 🎨 Flexible layouts - Fixed or responsive modes
- ⚡ High performance - Efficient rendering with builder pattern
- 🎭 Animation support - Smooth transitions when items appear
- 🔄 Loading states - Built-in skeleton loading
- 📦 Easy to use - Intuitive API with sensible defaults
📸 Screenshots
Add screenshots of your examples here
🚀 Getting Started
Add this to your pubspec.yaml:
dependencies:
responsive_grid_layout: ^1.0.0
Then run:
flutter pub get
💡 Usage
Basic Example
import 'package:responsive_grid_layout/responsive_grid_layout.dart';
ResponsiveGrid(
itemCount: items.length,
itemsPerRow: 3,
horizontalSpacing: 16,
verticalSpacing: 16,
itemBuilder: (context, index, width) {
return MyCard(data: items[index]);
},
)
Responsive Mode
ResponsiveGrid(
itemCount: products.length,
minItemWidth: 250, // Minimum width per item
maxItemsPerRow: 4, // Max items on large screens
itemBuilder: (context, index, width) {
return ProductCard(product: products[index]);
},
)
Using Children
ResponsiveGrid(
itemsPerRow: 3,
children: [
Card(child: Text('Item 1')),
Card(child: Text('Item 2')),
Card(child: Text('Item 3')),
],
)
📖 Full Documentation
For complete documentation, examples, and API reference, visit:
🤝 Contributing
Contributions are welcome! Please read our contributing guidelines first.
📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
💖 Support
If you find this package useful, please consider:
- ⭐ Starring the repo
- 👍 Liking on pub.dev
- 🐛 Reporting issues
- 💡 Suggesting new features
📧 Contact
- GitHub: @yourusername
- Email: [email protected]
Libraries
- responsive_grid_layout
- A responsive grid layout widget for Flutter.