【.NET MAUI】Shellのメニューにアイコンを表示してみる

// ----------------------------------------------------------------------------
// namespace
// ----------------------------------------------------------------------------
namespace ARuMauiSample;

// ----------------------------------------------------------------------------
// class
// ----------------------------------------------------------------------------

/// <summary>
/// MAUI
/// </summary>
public static class MauiProgram
{
    // ----------------------------------------------------------------------------
    // method
    // ----------------------------------------------------------------------------

    /// <summary>
    /// MAUIアプリケーション生成
    /// </summary>
    /// <returns>MAUIアプリケーション</returns>
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                fonts.AddFont("fa-solid-900.ttf", "FontAwesome");
            });
        
        return builder.Build();
    }
}

/// <summary>
/// MainActivity
/// </summary>
[Activity(Theme = "@style/Maui.SplashTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation | ConfigChanges.UiMode | ConfigChanges.ScreenLayout | ConfigChanges.SmallestScreenSize | ConfigChanges.Density)]
public class MainActivity : MauiAppCompatActivity
{
    // ----------------------------------------------------------------------------
    // method
    // ----------------------------------------------------------------------------

    /// <summary>
    /// Activity生成
    /// </summary>
    /// <param name="savedInstanceState"></param>
    protected override void OnCreate(Bundle savedInstanceState)
    {
        SetFont("fa-solid-900.ttf");
        base.OnCreate(savedInstanceState);
    }

    /// <summary>
    /// フォント設定
    /// </summary>
    /// <param name="fontFileName">フォントファイル名</param>
    private void SetFont(string fontFileName)
    {
        string fontPath = Path.Combine(CacheDir.AbsolutePath, fontFileName);
        using (Stream asset = Assets.Open(fontFileName))
        {
            using (FileStream dest = File.Open(fontPath, FileMode.Create))
            {
                asset.CopyTo(dest);
            }
        }
    }
}

<?xml version="1.0" encoding="UTF-8" ?>
<Shell
    x:Class="ARuMauiSample.AppShell"
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:aruControls="clr-namespace:ARu.Control.ChangeTheme"
    xmlns:fontIcons="clr-namespace:FontAwesomeFreeSolid"
    xmlns:local="clr-namespace:ARuMauiSample"
    FlyoutBackground="{AppThemeBinding Light={StaticResource SubWhite},
                                       Dark={StaticResource SubBlack}}"
    Shell.FlyoutBehavior="{OnIdiom Phone=Flyout,
                                   Default=Locked}"
    Shell.NavBarIsVisible="{OnIdiom Phone=True,
                                    Default=False}">

    <!--  Home  -->
    <FlyoutItem Title="ホーム">
        <FlyoutItem.Icon>
            <FontImageSource
                FontFamily="FontAwesome"
                Glyph="{x:Static fontIcons:FontAwesomeFreeSolid.House}"
                Color="{AppThemeBinding Light={StaticResource Black},
                                        Dark={StaticResource White}}" />
        </FlyoutItem.Icon>
        <ShellContent ContentTemplate="{DataTemplate local:MainPage}" />
    </FlyoutItem>

    <!--  Setting  -->
    <FlyoutItem Title="設定">
        <FlyoutItem.Icon>
            <FontImageSource
                FontFamily="FontAwesome"
                Glyph="{x:Static fontIcons:FontAwesomeFreeSolid.Gear}"
                Color="{AppThemeBinding Light={StaticResource Black},
                                        Dark={StaticResource White}}" />
        </FlyoutItem.Icon>
        <ShellContent ContentTemplate="{DataTemplate local:SettingPage}" />
    </FlyoutItem>

    <!--  About  -->
    <FlyoutItem Title="このアプリについて">
        <FlyoutItem.Icon>
            <FontImageSource
                FontFamily="FontAwesome"
                Glyph="{x:Static fontIcons:FontAwesomeFreeSolid.CircleInfo}"
                Color="{AppThemeBinding Light={StaticResource Black},
                                        Dark={StaticResource White}}" />
        </FlyoutItem.Icon>
        <ShellContent ContentTemplate="{DataTemplate local:AboutPage}" />
    </FlyoutItem>

</Shell>