1

我有一个在 Photoshop 中使用图标和一些文本的 PNG 制作的 PNG。尝试导入时，我无法将其从 Sketch 或 Photoshop 导出为 SVG，我在Error: No vector content found使用草图中的复制 SVG 代码直接获取 SVG 时遇到了问题；


<svg width="150px" height="161px" viewBox="0 0 150 161" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <g id="Login" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="Login---no-data" transform="translate(-105.000000, -150.000000)">
            <image id="Logo" x="105" y="150" width="150" height="161" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUg.....TkSuQmCC"></image>
        </g>
    </g>
</svg>

并来自 Photoshop；

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="238" height="252" viewBox="0 0 238 252">
  <image id="Gradient_Fill_1" data-name="Gradient Fill 1" width="238" height="252" xlink:href="data:img/png;base64,iVBORw0KGgoAAAAN.....U5ErkJggg=="/>
</svg>

（我已经缩短了两个 href 的数据以避免它变得庞大）

这两个都给出了相同的错误。这里出了什么问题，我尝试使用在线转换将 PNG 转换为 SVG，但我仍然得到同样的结果。我假设 android studio 不支持xlink:href=...，如果是这种情况，我该如何将其展平为路径（在这里猜测这就是我要做的）。

4

2 回答 2

0

如果您的图像是 PNG 文件格式，则它是光栅图像，而不是 SVG 的矢量。因此，要将您的图像置于矢量中以获得矢量图像的所有好处（无限可扩展性等），您应该首先将其转换为基于矢量的图形。最好的方法是在 Illustrator 中描摹图像（主菜单 --> 对象 --> 图像描摹），然后根据需要调整描摹设置以获得更好的效果，这取决于图像。之后，您将能够将图像保存为 SVG。

这是一个简短的截屏视频，如何将光栅图像转换为矢量图像： https ://www.screencast.com/t/tCmaSGTYa

PS 当然，可以将光栅图像嵌入到 SVG 中，但在这种情况下，它将是一个伪造的矢量图像，在调整大小后会变得模糊（我相信这不是你想在应用程序中使用的） .

希望这有助于节日快乐！

于 2019-12-29T16:43:09.837 回答
0

如果您使用 Photoshop 来设计您想要的任何东西，它是基于光栅的工具，而不是基于 svg（矢量）的工具。你从 Photoshop 中得到的任何东西都会变成一个光栅化的文件。如果您正在寻找 SVG 导出，那么您必须使用 Adob​​e Illustrator、Sketch 应用程序的 XD 来获取 svg 格式的文件。在这些工具中设计您的图标、徽标和其他图形内容，并获得文件的 SVG 导出。好运！

于 2019-12-26T06:15:49.637 回答