如何将Segoe MDL字体图标设置为WPF中的图像源?

shstlldc  于 2023-10-22  发布在  Go
关注(0)|答案(2)|浏览(126)

我试过搜索功能(当然是这里和谷歌),发现对我的问题没有任何帮助。
我使用来自Syncfusion(https://help.syncfusion.com/wpf/button/overview)的ButtonAdv控件,它需要图标(LargeIcon,SmallIcon)的图像源。
我想使用Segoe MDL2字体图标作为按钮的图像图标。我如何才能做到这一点?在Xamarin.Forms中有类似FontImageSource的东西,但我没有在WPF中找到类似的东西。
我现在没有一行代码(xaml或后面的代码),因为我不知道如何或从哪里开始。我很高兴每个想法或代码片段都能找到解决方案。
通常你会为字体图标写这样的东西:

<SomeControl>
    <ui:FontIcon Glyph="&#xE8C6;" Foreground="Black" />
</SomeControl>

并且(如果你有一个图像)对于图像源,类似这样:

<ButtonAdv LargeIcon="{StaticResource someImage}" />

谢谢

gopyfrb3

gopyfrb31#

这是可能的,虽然有点复杂。
而不是几何绘图与可视化刷你也许也可以使用一个GlyphRunDrawing。然而,这看起来更加复杂。

<Image Stretch="None">
    <Image.Source>
        <DrawingImage>
            <DrawingImage.Drawing>
                <GeometryDrawing>
                    <GeometryDrawing.Brush>
                        <VisualBrush Stretch="Uniform">
                            <VisualBrush.Visual>
                                <TextBlock FontFamily="Segoe MDL2 Assets"
                                           Text="&#xE8C6;"/>
                            </VisualBrush.Visual>
                        </VisualBrush>
                    </GeometryDrawing.Brush>
                    <GeometryDrawing.Geometry>
                        <RectangleGeometry Rect="0,0,32,32"/>
                    </GeometryDrawing.Geometry>
                </GeometryDrawing>
            </DrawingImage.Drawing>
        </DrawingImage>
    </Image.Source>
</Image>

为了更容易重用,您可以像这样创建一个StaticResourceExtension:

[MarkupExtensionReturnType(typeof(DrawingImage))]
public class IconImageExtension : StaticResourceExtension
{
    private static readonly FontFamily fontFamily
        = new FontFamily("Segoe MDL2 Assets");

    public int SymbolCode { get; set; }

    public double SymbolSize { get; set; } = 16;

    public override object ProvideValue(IServiceProvider serviceProvider)
    {
        var textBlock = new TextBlock
        {
            FontFamily = fontFamily,
            Text = char.ConvertFromUtf32(SymbolCode)
        };

        var brush = new VisualBrush
        {
            Visual = textBlock,
            Stretch = Stretch.Uniform
        };

        var drawing = new GeometryDrawing
        {
            Brush = brush,
            Geometry = new RectangleGeometry(
                new Rect(0, 0, SymbolSize, SymbolSize))
        };

        return new DrawingImage(drawing);
    }
}

这样使用:

<Image Stretch="None"
       Source="{local:IconImage SymbolSize=32, SymbolCode=0xE8C6}"/>
nlejzf6q

nlejzf6q2#

一个更简单的解决方案是将这些项目放入您的通用主题目录或直接放入PageWindow的资源中:

<TextBlock x:Key="IconEdit" Text="&#xE70F;" FontFamily="Segoe MDL2 Assets" VerticalAlignment="Center" />
<TextBlock x:Key="IconNew" Text="&#xE710;" FontFamily="Segoe MDL2 Assets" VerticalAlignment="Center" />
<TextBlock x:Key="IconDelete" Text="&#xE74D;" FontFamily="Segoe MDL2 Assets" VerticalAlignment="Center" Foreground="Crimson" />

您可以从菜单项中引用它们:

<MenuItem Header="Edit" Icon="{StaticResource IconEdit}" />

这将它们放入一个中央存储库,您可以简单地更改图标,所有引用此图标的菜单项都会自动更改。

相关问题