Community.Toolbox and IconPack in Code Behind

[Petronius-ch]

Hi,

I'm using Community.Toolbox with target framework net.8.0 on windows 10. Installed Nugets are these:

    <PackageReference Include="CommunityToolkit.Mvvm" Version="7.1.2" />
    <PackageReference Include="MahApps.Metro" Version="2.4.10" />
    <PackageReference Include="MahApps.Metro.IconPacks" Version="4.11.0" />
    <PackageReference Include="Microsoft.EntityFrameworkCore" Version="8.0.8" />
    <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="8.0.8" />
    <PackageReference Include="Microsoft.Extensions.Hosting" Version="6.0.0" />

What I want is, to use an IconPack Icon in the HamburgerMenu, defined in ShellViewModel.cs.:

    // TODO: Change the icons and titles for all HamburgerMenuItems here.
    public ObservableCollection<HamburgerMenuItem> MenuItems { get; } = new ObservableCollection<HamburgerMenuItem>()
    {
        new HamburgerMenuGlyphItem() { Label = Resources.ShellMainPage, Glyph = "\uE8A5", TargetPageType = typeof(MainViewModel) },
        new HamburgerMenuIconItem() { Label = "Home", Icon = new PackIconMaterial {                   Kind = MahApps.Metro.IconPacks.PackIconMaterialKind.Duck,
                  Width = 75,
                  Height = 75,
                  Foreground = Brushes.Goldenrod },TargetPageType = typeof(CodeViewModel) }
    };

It compiles, but on the hamburgermenu I see the Glyph ok, but not the icon - there is the classname only (as text).

Any idea, whats wrong here...?
Thanks

[timunie]

check your ItemTemplate

[Petronius-ch]

Thanks for answering (sorry for being a bit late...) - I got the idea. It works now :-)

First, in the ShellViewModel.cs I added this to MenuItems:

        new HamburgerMenuIconItem()
            {
                Label = "Duck Icon", 
                Icon = new PackIconMaterial() 
                {
                    Kind = PackIconMaterialKind.Duck 
                },
                TargetPageType = typeof(MyPageViewModel)
            }

Next I had to add a new TemplateSelector in the Class MenuItemTemplateSelector (which is missing):

    public DataTemplate IconPackDataTemplate { get; set; }
...
        if (item is HamburgerMenuIconItem)
        {
            return IconPackDataTemplate;
        }

Finally use the new Template in xaml:

            <templateSelectors:MenuItemTemplateSelector.IconPackDataTemplate>
                <DataTemplate DataType="{x:Type controls:HamburgerMenuIconItem}">
                    <Grid Height="48">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="48" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <ContentControl
                            Grid.Column="0"
                            Width="24"
                            Height="24"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            Content="{Binding Icon}"
                            ToolTip="{Binding Label}" />
                        <TextBlock
                            Grid.Column="1"
                            VerticalAlignment="Center"
                            FontSize="16"
                            Text="{Binding Label}" />
                    </Grid>
                </DataTemplate>
            </templateSelectors:MenuItemTemplateSelector.IconPackDataTemplate>