imageflow 1.0.7

A powerful Flutter image loader with lazy loading, caching, and progressive loading capabilities. Built by jamalihassan0307.

🌟 ImageFlow 🌟

An advanced Flutter package for optimized image loading with caching and lazy loading capabilities

An advanced image loader for Flutter with caching, placeholders, and progressive loading. ImageFlow provides optimized lazy loading capabilities, ensuring your app's images load efficiently and smoothly.

✨ Features

🏎️ Optimized Lazy Loading

• Loads images only when they become visible in the viewport
• Reduces memory usage and initial load time

🛠️ Advanced Caching Support

• Efficient local storage caching
• Customizable cache duration
• Automatic cache management

🔄 Placeholder & Error Handling

• Customizable loading placeholders
• Elegant error states
• Smooth transitions between states

📱 Adaptive Image Quality

• Progressive image loading
• Low-res to high-res transitions
• Bandwidth-aware loading

🚀 Prefetching & Preloading

• Smart preloading of off-screen images
• Configurable prefetch policies
• Background loading support

🌍 Network & Offline Support

• Offline-first approach
• Automatic network state detection
• Fallback mechanisms for offline usage

🎨 Extended Format Support

• GIF support
• SVG rendering
• Extensible format handlers

Android Setup

Add the following permission to your Android Manifest (android/app/src/main/AndroidManifest.xml):

<uses-permission android:name="android.permission.INTERNET"/>

This permission is required for loading images from the internet.

🚀 Getting Started

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

dependencies:
  imageflow: ^1.0.7

💻 Usage Examples

Basic Usage

LazyCacheImage(
  imageUrl: 'https://example.com/image.jpg',
)

With Custom Placeholder

LazyCacheImage(
  imageUrl: 'https://example.com/image.jpg',
  placeholder: const Center(
    child: CircularProgressIndicator(),
  ),
)

With Error Handling

LazyCacheImage(
  imageUrl: 'https://example.com/image.jpg',
  errorWidget: const Icon(
    Icons.error_outline,
    color: Colors.red,
  ),
)

Advanced Usage

LazyCacheImage(
  imageUrl: 'https://example.com/image.jpg',
  fit: BoxFit.cover,
  maxWidth: 300,
  maxHeight: 300,
  visibilityFraction: 0.1,
  cacheDuration: const Duration(days: 7),
)

Adaptive Quality Loading

LazyCacheImage(
  imageUrl: 'https://example.com/high-quality.jpg',
  lowResUrl: 'https://example.com/low-quality.jpg',
  enableAdaptiveLoading: true,
  fit: BoxFit.cover,
)

Offline Mode Support

LazyCacheImage(
  imageUrl: 'https://example.com/image.jpg',
  enableOfflineMode: true,
  placeholder: const Text('Loading from cache...'),
)

With Prefetching

// Prefetch multiple images
await ImageUtils.prefetchImages([
  'https://example.com/image1.jpg',
  'https://example.com/image2.jpg',
]);

// Use in widget
LazyCacheImage(
  imageUrl: 'https://example.com/image1.jpg',
  enableOfflineMode: true,
)

Interactive Image Viewer

InteractiveViewer(
  minScale: 0.5,
  maxScale: 4.0,
  child: LazyCacheImage(
    imageUrl: 'https://example.com/image.jpg',
    fit: BoxFit.contain,
  ),
)

🎯 Use Cases

1. Image Lists & Grids

Perfect for optimizing performance in scrolling lists:

ListView.builder(
  itemBuilder: (context, index) => LazyCacheImage(
    imageUrl: images[index],
    visibilityFraction: 0.1,
  ),
)

2. SVG Support

Automatically handles SVG images:

LazyCacheImage(
  imageUrl: 'https://example.com/vector.svg',
  fit: BoxFit.contain,
)

3. Offline Support

Images remain available offline after first load:

LazyCacheImage(
  imageUrl: url,
  placeholder: const Text('Loading from cache...'),
)

4. Cache Management

Easy cache control:

final cacheProvider = CacheProvider();

// Clear specific image
await cacheProvider.clearCache(imageUrl);

// Clear all cached images
await cacheProvider.clearAllCache();

// Get cache size
final size = await cacheProvider.getCacheSize();

🤝 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 helpful, please give it a star on GitHub!

Contact

• 👨‍💻 Developed by Jam Ali Hassan
• 🌐 Portfolio
• 📧 Email: [e-mail]
• 🔗 LinkedIn