有没有办法在MudBrazor图标中添加新图标。我正在做一个关于纺织的项目，我需要MudBlazor的不同图标。我找到了图标，但不知道如何在MudBlazor中添加它们。提前感谢！
您可以将自己的SVG作为字符串分配给MudIcon。下面是一个在内部图标和自定义图标之间切换的示例https://materialdesignicons.com/当你搜索病毒时会发现。
Fiddle：https://try.mudblazor.com/snippet/QawlPlcwzUWsYLCo
<MudIcon Class="ma-4" Icon="@selectedIcon" Color="Color.Primary" />
<MudButton Class="ma-4" Variant="Variant.Filled" Color="Color.Primary" OnClick="ChangeIcon">Switch Icon</MudButton>
@code{
//Virus from Material Design Icons
string virus = "<svg style="width:24px;height:24px" viewBox="0 0 24 24">"+
"<path fill="currentColor" d="M19.82 14C20.13 14.45 20.66 14.75 21.25 14.75C22.22 14.75 23 13.97 23 13S22.22 11.25 21.25 11.25C20.66 11.25 20.13 11.55 19.82 12H19C19 10.43 18.5 9 17.6 7.81L18.94 6.47C19.5 6.57 20.07 6.41 20.5 6C21.17 5.31 21.17 4.2 20.5 3.5C19.81 2.83 18.7 2.83 18 3.5C17.59 3.93 17.43 4.5 17.53 5.06L16.19 6.4C15.27 5.71 14.19 5.25 13 5.08V3.68C13.45 3.37 13.75 2.84 13.75 2.25C13.75 1.28 12.97 .5 12 .5S10.25 1.28 10.25 2.25C10.25 2.84 10.55 3.37 11 3.68V5.08C10.1 5.21 9.26 5.5 8.5 5.94L7.39 4.35C7.58 3.83 7.53 3.23 7.19 2.75C6.63 1.96 5.54 1.76 4.75 2.32C3.96 2.87 3.76 3.96 4.32 4.75C4.66 5.24 5.2 5.5 5.75 5.5L6.93 7.18C6.5 7.61 6.16 8.09 5.87 8.62C5.25 8.38 4.5 8.5 4 9C3.33 9.7 3.33 10.8 4 11.5C4.29 11.77 4.64 11.93 5 12L5 12C5 12.54 5.07 13.06 5.18 13.56L3.87 13.91C3.45 13.56 2.87 13.41 2.29 13.56C1.36 13.81 .808 14.77 1.06 15.71C1.31 16.64 2.28 17.19 3.21 16.94C3.78 16.78 4.21 16.36 4.39 15.84L5.9 15.43C6.35 16.22 6.95 16.92 7.65 17.5L6.55 19.5C6 19.58 5.5 19.89 5.21 20.42C4.75 21.27 5.07 22.33 5.92 22.79C6.77 23.25 7.83 22.93 8.29 22.08C8.57 21.56 8.56 20.96 8.31 20.47L9.38 18.5C10.19 18.82 11.07 19 12 19C12.06 19 12.12 19 12.18 19C12.05 19.26 12 19.56 12 19.88C12.08 20.85 12.92 21.57 13.88 21.5S15.57 20.58 15.5 19.62C15.46 19.12 15.21 18.68 14.85 18.39C15.32 18.18 15.77 17.91 16.19 17.6L18.53 19.94C18.43 20.5 18.59 21.07 19 21.5C19.7 22.17 20.8 22.17 21.5 21.5S22.17 19.7 21.5 19C21.07 18.59 20.5 18.43 19.94 18.53L17.6 16.19C18.09 15.54 18.47 14.8 18.71 14H19.82M10.5 12C9.67 12 9 11.33 9 10.5S9.67 9 10.5 9 12 9.67 12 10.5 11.33 12 10.5 12M14 15C13.45 15 13 14.55 13 14C13 13.45 13.45 13 14 13S15 13.45 15 14C15 14.55 14.55 15 14 15Z" />"+
"</svg>";
private string selectedIcon = Icons.Custom.Brands.MudBlazor;
private void ChangeIcon()
{
if (selectedIcon == Icons.Custom.Brands.MudBlazor)
{
selectedIcon = virus;
}
else
{
selectedIcon = Icons.Custom.Brands.MudBlazor;
}
}
}
以下是我的操作方法：
- 我用icomoon.io创建了自己的图标字体；选择"；步骤
- 我在"；生成字体"步MudBrazor文献指出；MudIcon组件将显示任何支持连字的图标字体"(2022年4月2日(
- 已下载字体并将其添加到"wwwroot"文件夹中
- 在"中添加了对css文件的引用；wwwroot/index.html"；(对于PWA(，例如像这样的
<link href="css/fe/fe.css" rel="stylesheet">。确保您根据自己的需要调整路径 - 现在你终于可以使用你的图标了
当您引用图标而不是使用@Icons.Material.Sharp.FrontHand时，请使用如下字符串："icomoon-liga fe-backhand""icomoon liga"；似乎可以结扎"fe反手；用"；fe-"；作为可以在字体设置中定义的类前缀；反手；是您给图标的名称/代码。
示例：
<MudIconButton Icon="icomoon-liga fe-backhand" Color=Color.Dark
OnClick=@(() => HitTheBall(false)) />
可以添加来自其他来源的图标和您自己的图标(作为SVG路径定义(。您将找到其他信息https://mudblazor.com/components/icons#custom-图标。