Add InfoBadge for NavigationViewItems

[Porterbg]

Is your feature request related to a problem? Please describe

Could you implement InfoBadge in buttons for NavigationViewItems?
You can find it in the WinUI 3 sample app.

Describe the solution you'd like

Example usage

<NavigationViewItem x:Name="InboxPage" Content="Inbox" Icon="Mail">
    <NavigationViewItem.InfoBadge>
        <InfoBadge x:Name="infoBadge1" Value="5" Opacity="{x:Bind InfoBadgeOpacity, Mode=OneWay}"/>
    </NavigationViewItem.InfoBadge>
</NavigationViewItem>

Describe alternatives you've considered

No response

Additional context

No response

[jbryknar]

That sounds good, and I don't know how the author of the project is doing with the implementation, but I decided to implement this feature myself to contribute to the development. In the code there is only preparation in the form of pre-created files for the component. When I'm done, I'll make a Pull Request. I am now implementing IconBadge in NavigationView so that it works for all Menu types (compact, minimal, fluent, expanded ...).

Note: I implemented it according to https://learn.microsoft.com/en-us/windows/apps/design/controls/info-badge, where I kept the WinUI colors, brushes and styles.

[jbryknar]

Implementation complete, just checking all styles and details to match 1:1 with WinUI.

[jbryknar]

Already merged into the develpment branch in PR: #869.

[Othman-Saleh]

Is there any way to set a custom background and text/icon color?

I found the solution:

In C#:

InfoBadgeCreateTest.Resources["InfoBadgeSuccessSeverityBackgroundBrush"] = System.Windows.Media.Brushes.Red;
InfoBadgeCreateTest.Resources["InfoBadgeValueForeground"] = System.Windows.Media.Brushes.White;

Or in XML:

<ui:InfoBadge.Resources>
    <SolidColorBrush x:Key="InfoBadgeSuccessSeverityBackgroundBrush" Color="Red"/>
    <SolidColorBrush x:Key="InfoBadgeValueForeground" Color="White"/>
</ui:InfoBadge.Resources>

I wish the property was exposed, it would makes things a lot more straight forward. But for now, this will do. Thanks!