Flutter 中的 SVG 精灵

svg sprite in flutter

提问人:Мартынов Олег 提问时间:11/14/2023 最后编辑:Мартынов Олег 更新时间:11/15/2023 访问量:54

问:

我有一个从互联网上得到的 svg 精灵,里面有各种图标,我怎样才能从这个精灵中获取特定的图标?

我尝试使用 flutter_svg 和 jovial_svg 库。我该怎么办,请帮忙 如果您需要更多信息,我很乐意提供

SVG 结构表示一组符号

<symbol id="icon-without-shower" viewBox="0 0 30 30">
        <rect width="30" height="30" rx="2" fill="#F8F8F8"/>
        <path d="M22.25 24a.75.75 0 0 0 1.5 0h-1.5zm-9.534-5.143a.75.75 0 0 0-1.5 0h1.5zM11.216 20a.75.75 0 0 0 1.5 0h-1.5zm-1.81-1.143a.75.75 0 0 0-1.5 0h1.5zM7.905 20a.75.75 0 0 0 1.5 0h-1.5zm8.12-1.143a.75.75 0 0 0-1.5 0h1.5zM14.526 20a.75.75 0 1 0 1.5 0h-1.5zm-1.81 2.857a.75.75 0 0 0-1.5 0h1.5zM11.216 24a.75.75 0 0 0 1.5 0h-1.5zm-1.81-1.143a.75.75 0 0 0-1.5 0h1.5zM7.905 24a.75.75 0 0 0 1.5 0h-1.5zm8.12-1.143a.75.75 0 0 0-1.5 0h1.5zM14.526 24a.75.75 0 1 0 1.5 0h-1.5zm-4.5-12.255l-.222-.716.223.716zM12.15 8.06l-.706-.252.706.252zM23.75 24V9.663h-1.5V24h1.5zM22.008 6.32l-.24-.168-.86 1.23.24.167.86-1.229zm-3.105-1.07H15.05v1.5h3.854v-1.5zM11.45 7.785l-.007.022 1.412.505.008-.022-1.413-.505zm-.234 1.33v2.028h1.5V9.115h-1.5zm.527 2.744l1.939.602.445-1.432-1.939-.602-.445 1.432zm4.758 3.677H7.43v1.5h9.07v-1.5zm-6.252-3.075l1.94-.602-.446-1.432-1.939.602.445 1.432zm.966 6.396V20h1.5v-1.143h-1.5zm-3.31 0V20h1.5v-1.143h-1.5zm6.62 0V20h1.5v-1.143h-1.5zm-3.31 4V24h1.5v-1.143h-1.5zm-3.31 0V24h1.5v-1.143h-1.5zm6.621 0V24h1.5v-1.143h-1.5zM7.75 15.855a3.554 3.554 0 0 1 2.5-3.394l-.446-1.432a5.054 5.054 0 0 0-3.554 4.826h1.5zm-.32-.32a.32.32 0 0 1 .32.32h-1.5c0 .652.528 1.18 1.18 1.18v-1.5zm8.751.32a.32.32 0 0 1 .32-.32v1.5a1.18 1.18 0 0 0 1.18-1.18h-1.5zm-2.5-3.394a3.554 3.554 0 0 1 2.5 3.394h1.5c0-2.213-1.44-4.17-3.554-4.826l-.445 1.432zm-2.238-4.654c-.15.42-.227.862-.227 1.308h1.5c0-.273.047-.545.139-.803l-1.412-.505zm1.589-1.981a3.823 3.823 0 0 0-1.582 1.96l1.413.504c.176-.494.515-.913.96-1.19l-.791-1.274zm2.017-.576c-.713 0-1.412.2-2.017.576l.791 1.274c.368-.229.793-.35 1.226-.35v-1.5zm6.719.902a5 5 0 0 0-2.865-.902v1.5a3.5 3.5 0 0 1 2.005.631l.86-1.229zm1.744 2.138a4.079 4.079 0 0 0-1.504-1.97l-.86 1.23c.44.306.771.741.951 1.245l1.413-.505zm.238 1.373c0-.468-.08-.933-.238-1.373l-1.413.505c.1.278.151.572.151.868h1.5z" fill="gray"/>
        <path d="M4 24.778L24.778 4" stroke="gray" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
    </symbol>
颤振 飞镖 SVG svg-精灵

评论

0赞 enxaneta 11/14/2023
这取决于精灵 SVG 中的内容。请看这篇文章: css-tricks.com/svg-fragment-identifiers-work
0赞 Мартынов Олег 11/14/2023
谢谢,我会阅读并回复您
0赞 Мартынов Олег 11/15/2023
我编辑了描述并添加了svg结构
0赞 Мартынов Олег 11/15/2023
嗨,据我了解,flutter_svg无法按 id 显示 svg 部分。我需要从精灵中获取特定符号并显示它

答: 暂无答案