Add support for UTF-32 glyphs in icon components

[pierre3]

Added components that extend the size of the icon Glyph to 32-bit.

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• New feature or enhancement
• UI change (please include screenshot!)
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Internationalization and localization
• Other (please describe):

What is the current behavior?

See discussions #1399

Issue Number: N/A

What is the new behavior?

• Added classes for Utf32Icon derived from the following components:

  • UIIcon
  • UIButton
  • UIDropDownButton
  • UIDropDownMenuItem

• Introduced helper methods in DevToys.Api.GUI for creating instances of Utf32Icon components. These methods take the font name and the int type Glyph code as arguments to create instances of the Utf32Icon version.

Example Usage

IUIUtf32Icon icon32 = Icon("FluentSystemIcons", 983184);
IUIUtf32IconButton button32 = Button("FluentSystemIcons", 983184, "Button");
IUIUtf32IconDropDownButton ddButton32 = DropDownButton("FluentSystemIcons", 983184, "DDButton");
IUIUtf32IconDropDownMenuItem ddMenuItem = DropDownMenuItem("FluentSystemIcons", 983184, "DDMenuItem");

Other information

The changes are as follows.

1. Extend the Glyph property in FontIcon.razor.cs from char to int.

public partial class FontIcon : StyledComponentBase
{
    //...

    [Parameter]
    public int Glyph { get; set; }

    //...

2. Add the interfaces IUIUtf32GlyphProvider and IUIUtf32IconProvider.

// UTF-32 version of the Glyph property
public interface IUIUtf32GlyphProvider
{
    int Utf32Glyph { get; }
}

// UTF-32 version of the IconGlyph property
public interface IUIUtf32IconProvider
{
    int Utf32IconGlyph { get; }
}

3. Create derived classes that implement these interfaces for the following components in DevToys.Api.

Components to be updated:

• IUIIcon
• IUIButton
• IUIDropDownButton
• IUIDropDownMenuItem

Components supporting UTF-32 icons:

• IUIUtf32Icon: IUIIcon, IUIUtf32GlyphProvider
• IUIUtf32IconButton: IUIButton, IUIUtf32IconProvider
• IUIUtf32IconDropDownButton: IUIDropDownButton, IUIUtf32IconProvider
• IUIUtf32IconDropDownMenuItem: IUIDropDownMenuItem, IUIUtf32IconProvider

4. The differences between the existing char type Glyph and the new int type Glyph will be resolved in xxPresenter.razor.

<FontIcon id="@UIIcon.Id"
    IsVisible="@UIIcon.IsVisible"
    IsEnabled="@UIIcon.IsEnabled"
    HorizontalAlignment="@UIIcon.HorizontalAlignment"
    VerticalAlignment="@UIIcon.VerticalAlignment"
    Glyph="@(UIIcon is IUIUtf32GlyphProvider provider ? provider.Utf32Glyph : UIIcon.Glyph)"
    FontFamily="@UIIcon.FontName"
    Height="@UIIcon.Size"
    Width="@UIIcon.Size" />

<FontIcon 
    Glyph="@(UIDropDownButton is IUIUtf32IconProvider provider ? provider.Utf32IconGlyph : UIDropDownButton.IconGlyph)"
    FontFamily="@UIDropDownButton.IconFontName"
    Height="16"
    Width="16" />

Quality check

Before creating this PR:

• Did you follow the code style guideline as described in CONTRIBUTING.md
• Did you build the app and test your changes?
• Did you check for accessibility? On Windows, you can use Accessibility Insights for this.
• Did you verify that the change work in Release build configuration
• Did you verify that all unit tests pass
• If necessary and if possible, did you verify your changes on:
  • Windows
  • macOS
  • Linux

The following items were tested.

• Confirmed that icons are displayed correctly with the added components (both 16-bit and 32-bit).
• Verified that icons are displayed correctly with existing components.
• Ensured that changing the Glyph and IconGlyph properties switches the icons.
• Confirmed that existing extensions function correctly.

[veler]

Hello,
Thank you for very much for this PR and sorry for the time it took me to look at it. I looked at it in detail and tested it on my side. It is really great! I appreciate your attention to details! I don't have any comment on it. Approved :D
Thank you again!