You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

flutter_svg 2.0及以上版本如何预缓存SVG图片?

解决flutter_svg 2.0.5版本SVG预缓存问题

在flutter_svg 2.0+版本中,旧的precachePicture函数和SvgPicture.svgStringDecoderOutsideViewBoxBuilder已被废弃,可通过以下方案实现SVG预缓存:

方法一:使用SvgPicture.cache静态方法

直接调用该方法即可完成资源的解码与缓存,无需手动指定解码器:

await SvgPicture.cache(
  const AssetImage("assets/images/file.svg"),
  context: context,
);

方法二:使用新版precachePicture配合默认解码器

若习惯原调用方式,新版本仍保留precachePicture,但需替换为SvgPicture.svgDecoder作为解码器(该解码器已适配viewBox逻辑,无需额外指定OutsideViewBox相关配置):

import 'package:flutter_svg/flutter_svg.dart';

precachePicture(
  ExactAssetPicture(SvgPicture.svgDecoder, "assets/images/file.svg"),
  context,
);

方法三:通过SvgCache类精细控制缓存

适合批量预缓存场景,可直接操作缓存实例:

final svgCache = SvgCache();
await svgCache.putIfAbsent(
  "assets/images/file.svg",
  () => svgCache.loadAsset("assets/images/file.svg"),
);

内容的提问来源于stack exchange,提问作者Bsel

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.20 15:08:09