cached_network_svg_image 1.2.0 cached_network_svg_image: ^1.2.0 copied to clipboard
A Flutter package for caching SVG images.
Cached Network SVG Image #
cached_network_svg_image
is a Flutter package that allows you to easily load and cache SVG images from the network. It provides a simple and efficient way to display SVG images with caching, placeholders, and error handling. 🌐🖼️
Features ✨ #
- Load SVG images from the network. 🌍
- Cache images for offline use. 📦
- Display a placeholder while the image is loading. ⏳
- Show an error widget if the image fails to load. ❌
- Customize the fade-in duration for the image. ⏱️
Installation 🛠️ #
Add the following to your pubspec.yaml
file:
dependencies:
cached_network_svg_image: any
Then, run flutter pub get
to install the package. 🚀
Usage 📖 #
Import the package in your Dart file:
import 'package:cached_network_svg_image/cached_network_svg_image.dart';
Use the CachedNetworkSVGImage
widget to display an SVG image from the network:
CachedNetworkSVGImage(
imageUrl: 'https://upload.wikimedia.org/wikipedia/commons/0/02/SVG_logo.svg',
placeholder: const CircularProgressIndicator(color: Colors.green),
errorWidget: const Icon(Icons.error, color: Colors.red),
width: 250.0,
height: 250.0,
fadeDuration: const Duration(milliseconds: 500),
),
Parameters 📋 #
imageUrl
: The URL of the SVG image. 🌐cacheKey
: A custom cache key to use for the image. 🔑placeholder
: A widget to display while the image is loading. ⏳errorWidget
: A widget to display if the image fails to load. ❌width
: The width of the image. 📏height
: The height of the image. 📏fadeDuration
: The duration of the fade-in animation when the image loads. ⏱️headers
: A map of headers to pass with the network request. 🗂️cacheManager
: A custom cache manager to use for caching the image, Default isDefaultCacheManager()
. 📦fit
: How the image should be inscribed into the space allocated for it. 🔲alignment
: How the image should be aligned within its bounds. 📐matchTextDirection
: Whether to paint the image in the direction of the TextDirection. ↔️allowDrawingOutsideViewBox
: Whether to allow the image to draw outside its view box. 📏color
: The color to apply to the image. 🎨colorBlendMode
: The blend mode to apply to the image color. 🎨semanticsLabel
: A description of the image for accessibility tools. 🏷️excludeFromSemantics
: Whether the image should be excluded from semantics. 🚫colorFilter
: A color filter to apply to the image. 🎨placeholderBuilder
: A builder function to create the placeholder widget. 🛠️theme
: The theme to apply to the image. 🎨
Functions 🔧 #
preCache
: A function to pre-cache the image. 📦clearCacheForUrl
: A function to clear the cache for a specific URL. 🗑️clearCache
: A function to clear the entire cache. 🗑️
Example 💡 #
Here is a complete example of how to use the cached_network_svg_image
package:
import 'package:flutter/material.dart';
import 'package:cached_network_svg_image/cached_network_svg_image.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Cached Network SVG Image Example'),
),
body: Center(
child: CachedNetworkSVGImage(
imageUrl: 'https://upload.wikimedia.org/wikipedia/commons/0/02/SVG_logo.svg',
placeholder: const CircularProgressIndicator(color: Colors.green),
errorWidget: const Icon(Icons.error, color: Colors.red),
width: 250.0,
height: 250.0,
fadeDuration: const Duration(milliseconds: 500),
),
),
),
);
}
}
License 📄 #
This project is licensed under the MIT License. See the LICENSE file for more details.