How to convert a PackIconMarkup to a Geometry object? about mahapps.metro.iconpacks

[timunie]

Hi @GF-Huang

I have a PR open which provides an export button to the browser. It is not merged yet but feel free to clone my branch and build the browser on your own. See:

• #232 for the PR
• https://github.com/timunie/MahApps.Metro.IconPacks/tree/HamburgerMenuProposal for the branch to build
• https://github.com/MahApps/MahApps.Metro.IconPacks/wiki/How-to-build-the-solution for how to build the solution.

Happy coding
Tim

[GF-Huang]

I had write a custom MarkupExtension to do this, I hope this will be add into this repo.

public abstract class PackIconGeometryExtension<TKind> : MarkupExtension where TKind : Enum {
    public TKind Kind { get; set; }

    protected abstract IDictionary<TKind, string> DataIndex { get; }

    protected PackIconGeometryExtension() { }

    protected PackIconGeometryExtension(TKind kind) => Kind = kind;

    public override object ProvideValue(IServiceProvider serviceProvider) => Geometry.Parse(DataIndex[Kind]);
}

public class UniconsGeometryExtension : PackIconGeometryExtension<PackIconUniconsKind> {
    protected override IDictionary<PackIconUniconsKind, string> DataIndex => PackIconUniconsDataFactory.DataIndex.Value;

    public UniconsGeometryExtension() { }

    public UniconsGeometryExtension(PackIconUniconsKind kind) : base(kind) { }
}

// and so on..
public class XxxGeometryExtension : PackIconGeometryExtension<PackIconXxxKind> {
    protected override IDictionary<PackIconXxxKind, string> DataIndex => PackIconXxxDataFactory.DataIndex.Value;

    public XxxGeometryExtension() { }

    public XxxGeometryExtension(PackIconXxxKind kind) : base(kind) { }
}

Usage:

<MyButton Geometry={iconPacks:UniconsGeometry Kind=Xxx} />

[timunie]

@GF-Huang tbh at the moment I don't see a good usecase for this. Not all Icons are build the same way, so you would need to take care of this. Some geometries are mirrored, others are outline only, others are filled, etc. So just rutrning the path data may lead to wrong appearance.

Moreover I don't see the the benefit right now. Maybe you can share a sample App via github repro where we can have a look at your extension and the MyButton - Control? Maybe then your point gets clearer or we have an alternative idea for your usecase.

Anyway thank you for the idea. 👍

[GF-Huang]

Actually I'm using the attach property Iconelement.Geometry from HandyControl, but just to make my suggestion a little bit simpler, I'll just say MyButton. Maybe I replace the `<Path x:Name="PathMain" ... /> to something PackIcon will be better?

reference:

• HandyControl
• <Style x:Key="ButtonBaseStyle" BasedOn="{StaticResource ButtonBaseBaseStyle}" TargetType="Button">...</Style>
• IconElement.cs

[timunie]

Hi @GF-Huang

what do you think about this?

<StackPanel>
    <TextBlock>IconContent-Example</TextBlock>
    <Button Style="{DynamicResource Handy.Styles.Buttons.IconProposal}" Content="Proposal" hc:IconElement.IconContent=":-)"
            Background="Red">
        <hc:IconElement.IconTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding}" FontSize="15" FontFamily="Courier New" FontWeight="Bold" />
            </DataTemplate>
        </hc:IconElement.IconTemplate>
    </Button>
    <Button Style="{DynamicResource Handy.Styles.Buttons.IconProposal}" Content="IconPacks Example"
            hc:IconElement.IconPosition="Right"
            hc:IconElement.IconContent="{iconPacks:Material Kind=Teach}"
            Background="BlueViolet" />
</StackPanel>

I know this will lead to some work on your side, but I think this is way more flexible. You can then have any object as Icon, even Images or other controls. Moreover the Icon can change based on buttons content. Your Geometry can also still be used the same way.

I've sent you a draft PR which needs to be reworked on your own. HandyOrg/HandyControl#767

Happy coding
Tim