渲染时 Flutter SVG 延迟

Question

我在行中同时显示作为 SVG 文件的图像和文本。

出于某种原因，svg 图像的渲染速度比屏幕的其余部分慢，导致延迟，这对用户体验不利。

这个延迟正常吗？我该怎么做才能让整个屏幕同时呈现？

Row(
   mainAxisAlignment: MainAxisAlignment.center,
        children: [
          SvgPicture.asset(
            'lib/assets/muslim_coloc_logo.svg',
            height: 40.0,
            width: 40.0,
          ),
          SizedBox(width: 2.0,),
          RichText(
            text: TextSpan(children: [
              TextSpan(
                text: 'uslim',
                style: MC_titleWhite,
              ),
              TextSpan(
                text: 'Coloc',
                style: MC_titleWhite50,
              ),
            ]),
          ),
        ],
      ),

Answer 1

你可以使用 PreCachePicture，它适合我：

Future.wait([
  precachePicture(
    ExactAssetPicture(SvgPicture.svgStringDecoder, 'assets/my_icon.svg'),
    null,
  ),
  precachePicture(
    ExactAssetPicture(SvgPicture.svgStringDecoder, 'assets/my_asset.svg'),
    null,
  ),
]);

您需要在之前的屏幕小部件中执行此操作，例如在您的 main 中，例如

渲染时 Flutter SVG 延迟

Flutter SVG delay when rendering

flutter

svg

rendering