-1

I am using MahApps and AvalonDock for my WPF application, AvalonDock tab header icon can only accept URI icon source. However, from my understanding MahApps icon need to set like below:

<MenuItem.Icon>
    <iconPacks:PackIconMaterial Kind="Close" Foreground="Red" />
</MenuItem.Icon>

But AvalonDock does not accept this when I bind the icon property from the respective ViewModel, how can I change this MahApps icon into URI?

Joshua Chan
  • 49
  • 4

1 Answers1

0

If you look on the GitHub Wiki then you will find the class MenuItemEx which allows you to use the IconTemplate property.

With this you can set the Icon like this:

<MenuItemEx Header="Menu with an icon">
  <MenuItemEx.IconTemplate>
    <DataTemplate>
      <iconPacks:PackIconMaterial Kind="Close" Foreground="Red" />
    </DataTemplate>
  </MenuItemEx.IconTemplate>
</MenuItemEx>

It's also possible to use the PackIcon Image MarkupExtensions to get an Image:

<Grid Orientation="Horizontal">
    <Grid.Resources>
        <Style TargetType="Image">
            <Setter Property="Margin" Value="1" />
            <Setter Property="Width" Value="16" />
            <Setter Property="HorizontalAlignment" Value="Center" />
            <Setter Property="VerticalAlignment" Value="Center" />
        </Style>
    </Grid.Resources>

    <Image Source="{iconPacks:MaterialImage Kind=Close, Brush=Red}" />
</Grid>

Or anywhere else where an ImageSource is needed.

punker76
  • 14,326
  • 5
  • 58
  • 96
  • Yes I understand, but my problem is in AvalonDock, AvalonDock only accept URI format of icon source. So my way to solve it is to force the MahApps Icon to change into URI format and bind to the tab header. – Joshua Chan Feb 16 '22 at 01:32
  • @JoshuaChan I have updated my answer with the PackIcon Image MarkupExtension. With this you can set the Icon source on the AvalonDock. – punker76 Feb 18 '22 at 12:08