SVG raw 未在颤动中显示文本

Posted 2023-03-28

【中文标题】SVG raw 未在颤动中显示文本

【英文标题】：SVG raw not showing text in flutter

【发布时间】：2021-10-14 10:03:18

【问题描述】：

我有一个 svg 文件，其中包含将在我的颤振应用程序中修改的文本。问题是：在我的应用程序中，svg 图标显示良好，但图标内的文本却没有（如果我在浏览器中打开图标，则文本显示正常）。

我正在使用一个地图 sdk，它需要 svg 图标作为 Uint8List 来绘制它，所以我需要 svg 原始代码单元来绘制图标（我不能更改它）。

我将添加代码示例以澄清。

 rawSvg = await rootBundle.loadString(SVG_ICON_ASSET); 
 rawSvg = rawSvg.replaceAll('##', eventsCount.toString());
    
return MapImage.withImageDataImageFormatWidthAndHeight(
        Uint8List.fromList(rawSvg.codeUnits),
        ImageFormat.svg,
        200,
        200);

【问题讨论】：

检查eventsCount.toString() 的行为是否符合预期...甚至可以暂时删除该行以检查## 是否正确呈现。

【参考方案1】：

确保将文本转换为路径。您可以通过打开 Inkscape 来查看，对我来说 Inkscape 就足够了，所以我不使用 Adob​​e Illustrator，我也不知道它的任何内容。但是在 Inkscape 中，您可以通过仅选择文本对象并转到 Object - 然后从下拉菜单中选择 Objects 来检查它，它将显示一个新窗口（我使用的是最新版本，所以如果您使用的是旧版本，界面可能会有所不同）。

在这里您将看到您的文本对象。如果它有像​​我已经将其转换为路径的路径，那么您可能应该在 android Studio 中检查路径颜色，因为 Android Studio 有时在转换为矢量图形期间会更改路径颜色。如果文本不在路径中，您可以如下所示进行转换。

我创建了另一个文本对象来解释不要混淆。将其转换为路径后，每个 Character 都会被转换为路径。

这一切都是因为 Android Studio 无法将对象转换为路径，有时甚至不显示错误。