読者です 読者をやめる 読者になる 読者になる

しっぽを追いかけて

ぐるぐるしながら考えています

Unity と猫の話題が中心   掲載内容は個人の私見であり、所属組織の見解ではありません

UWP のタイトルバーの配色を変更したい

C# UWP Windows 10 Windows ランタイムアプリ

UWP ではなぜかアプリケーションの RequestedTheme="Dark" を指定しても

f:id:matatabi_ux:20150903233203p:plain

タイトルバーは白のままでちぐはぐになってしまいます・・・

ちゃんとてっぺんまで暗色テーマにしたい!

ということで App.xaml.cs に下記のコードを追加します

/// <summary>
/// Provides application-specific behavior to supplement the default Application class.
/// </summary>
sealed partial class App : PrismUnityApplication
{
    ~ 中略 ~

    /// <summary>
    /// Initialize application event handler
    /// </summary>
    /// <param name="args">Activated event arguments</param>
    /// <returns>Task</returns>
    protected override Task OnInitializeAsync(IActivatedEventArgs args)
    {
        // Registration service instance to Unity container
        this.Container.RegisterInstance<INavigationService>(this.NavigationService, new ContainerControlledLifetimeManager());

        // Customize title bar colors
        var titleBar = ApplicationView.GetForCurrentView().TitleBar;
        titleBar.BackgroundColor = Colors.Black;
        titleBar.ForegroundColor = Colors.White;
        titleBar.InactiveBackgroundColor = Colors.Black;
        titleBar.InactiveForegroundColor = Color.FromArgb(0xff, 0x66, 0x66, 0x66);
        titleBar.ButtonBackgroundColor = Colors.Black;
        titleBar.ButtonForegroundColor = Colors.White;
        titleBar.ButtonInactiveBackgroundColor = Colors.Black;
        titleBar.ButtonInactiveForegroundColor = Color.FromArgb(0xff, 0x66, 0x66, 0x66);
        titleBar.ButtonHoverBackgroundColor = Color.FromArgb(0xff, 0x17, 0x17, 0x17);
        titleBar.ButtonHoverForegroundColor = Colors.White;
        titleBar.ButtonPressedBackgroundColor = Color.FromArgb(0xff, 0x34, 0x34, 0x34);
        titleBar.ButtonPressedForegroundColor = Colors.White;

        return base.OnInitializeAsync(args);
    }

    ~ 中略 ~
}

追加したのは初期化時の ApplicationView.GetForCurrentView().TitleBar で取得した ApplicationViewTitleBar の各種配色プロパティの変更コードです

どういうわけか XAML からの変更方法が見つからなかったのですが、こんな感じで配色が指定できるようですね

これで起動すると・・・

f:id:matatabi_ux:20150904000427p:plain

きれいに染まりましたね