Search code examples
uwp-xamluwp-navigation

UWP - AppShell.xmal - MUXC:NavigationViewItem - List of available Icons (not costume made)


Currently, I am working on a solution Universal Windows (C#/xaml), where the namespace Microsoft.UI.Xaml.Controls is used.

            <MUXC:NavigationView.MenuItems>
            <MUXC:NavigationViewItem
                x:Name="ExpensesRecordsMenuItem"
                Content="{x:Bind Label}" 
                ToolTipService.ToolTip="{x:Bind Label`}"
                Icon="ContactInfo"/>
            <MUXC:NavigationViewItem
                x:Name="IncomeRecordsMenuItem"
                Content="{x:Bind Label1}" 
                ToolTipService.ToolTip="{x:Bind Label1}"
                Icon="Shop"/>
        </MUXC:NavigationView.MenuItems>

As one can see, the Icon takes a string value which is expected by NavigationViewItem and return an Icon object on the GUI, as part of the navigation view. Hence, no costume icon I had to add to the solution/project.

I have failed to find a reference to all possible list of Icons on-line, so, I could use Windows natural assets, instead of creating new icons all the time.

Is there any chance anyone here has found that list?

Thank you in advance.

Kind regards


Solution

  • You could find the complete list of icon names from Symbol enumeration then use it like the following.

    <NavigationViewItem x:Name="ExpensesRecordsMenuItem" Content="item1" Icon="CalendarDay"/>
    

    If you would like to use a glyph from the Segoe MDL2 Assets font that is not included in the Symbol enumeration, then use a FontIcon like following.

          <NavigationView>
                <NavigationView.MenuItems>
                    <NavigationViewItem x:Name="ExpensesRecordsMenuItem" Content="item1">
                        <NavigationViewItem.Icon>
                            <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE790;"/>
                        </NavigationViewItem.Icon>
                    </NavigationViewItem>
                </NavigationView.MenuItems>
            </NavigationView>