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.flutter-io.cn
🐛 Reporting issues
💡 Suggesting new features

📧 Contact

GitHub: @yourusername
Email: your.email@example.com