https://github.com/justprodev/flutter_cached_image

Convenient wrapper over flutter_cached_network_image with some additional features
https://github.com/justprodev/flutter_cached_image

cache flutter http image

Last synced: about 1 month ago
JSON representation

Convenient wrapper over flutter_cached_network_image with some additional features

• Host: GitHub
• URL: https://github.com/justprodev/flutter_cached_image
• Owner: justprodev
• License: mit
• Created: 2024-08-23T12:52:43.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-08-25T01:28:12.000Z (3 months ago)
• Last Synced: 2024-09-28T14:40:12.902Z (about 2 months ago)
• Topics: cache, flutter, http, image
• Language: C++
• Homepage:
• Size: 820 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Motivation

Just to preconfigure [CachedNetworkImage](https://pub.dev/packages/cached_network_image).

[Online demo](https://justprodev.com/demo/cached_image/index.html)

# Usage

Add to `pubspec.yaml` (main branch is controlled to contain only production-ready code)

```yaml

  cached_image:

    git:

      url: https://github.com/justprodev/flutter_cached_image.git

```

```dart

CachedImage.image(

  'https://picsum.photos/seed/100/300/200',

  width: 300,

  height: 200,

  fit: BoxFit.cover,

  borderRadius: const BorderRadius.all(Radius.circular(24)),

);

```

You can also preconfigure the error and placeholder widgets.

```dart

configureCachedImage() {

  CachedImage.setDefaultErrorWidget((context, url, error, [widgetParameters]) {

    if (widgetParameters == null) {

      return const SizedBox();

    }

    return ClipRRect(

      clipBehavior: Clip.hardEdge,

      borderRadius: widgetParameters.$1 ?? const BorderRadius.all(Radius.circular(4)),

      child: ColoredBox(

        color: Colors.white,

        child: SizedBox(

          width: widgetParameters.$2,

          height: widgetParameters.$3,

          child: Center(

            child: Column(

              mainAxisSize: MainAxisSize.min,

              children: [

                Text(

                  '😢',

                  style: Theme.of(context).textTheme.displayLarge,

                  textAlign: TextAlign.center,

                ),

                Text(

                  'Image not loaded',

                  style: Theme.of(context).textTheme.bodySmall,

                  textAlign: TextAlign.center,

                ),

              ],

            ),

          ),

        ),

      ),

    );

  });

  CachedImage.setDefaultPlaceholder((context, url, widgetParameters) {

    return defaultPlaceholder(context, url, widgetParameters).animate(onPlay: (c) => c.loop()).shimmer(

      colors: [

        Colors.white,

        Colors.grey[300]!,

        Colors.white,

      ],

      duration: const Duration(milliseconds: 1500),

    );

  });

}

```

See [example](/example/) for more details.