現在のカラーテーマを取得する - WinUI

WinUI3アプリケーションで現在のカラーラーマを取得するコードを紹介します。

概要

WinUI 3アプリケーションで現在のカラーテーマを取得するには、 FrameworkElementオブジェクトのActualTheme プロパティを参照します。

プログラム

WinUI 3アプリケーションを作成します。

コード

以下のコードを記述します。

MainWindow.xaml

<Window
    x:Class="GetCurrentColorTheme.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:GetCurrentColorTheme"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <StackPanel Orientation="Vertical" HorizontalAlignment="Center" VerticalAlignment="Center">
      <Button x:Name="myButton" Click="myButton_Click">Click Me</Button>
      <TextBlock x:Name="TextBlock1" Text="(Theme)"/>
  </StackPanel>
</Window>

MainWindow.xaml.cs

using Microsoft.UI.Xaml;
using Microsoft.UI.Xaml.Controls;
using Microsoft.UI.Xaml.Controls.Primitives;
using Microsoft.UI.Xaml.Data;
using Microsoft.UI.Xaml.Input;
using Microsoft.UI.Xaml.Media;
using Microsoft.UI.Xaml.Navigation;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;

// To learn more about WinUI, the WinUI project structure,
// and more about our project templates, see: http://aka.ms/winui-project-info.

namespace GetCurrentColorTheme
{
  /// <summary>
  /// An empty window that can be used on its own or navigated to within a Frame.
  /// </summary>
  public sealed partial class MainWindow : Window
  {
    public MainWindow()
    {
      this.InitializeComponent();
    }

    private void myButton_Click(object sender, RoutedEventArgs e)
    {
      myButton.Content = "Clicked";
      ElementTheme th = ((FrameworkElement)Content).ActualTheme;
      TextBlock1.Text = th.ToString();
    }
  }
}

解説

このウィンドウのUIElementオブジェクトインスタンスであるContentプロパティをFrameworkElementでキャストし、 ActualThemeプロパティを参照して現在のカラーテーマを取得します。

ElementTheme th = ((FrameworkElement)Content).ActualTheme;

取得したElementTheme オブジェクトをToString()メソッドで文字列に変換すると、カラーテーマの名称を取得できます。カラーテーマの名称をTextBlockに表示します。

TextBlock1.Text = th.ToString();

実行結果

ライトモードでプロジェクトを実行します。下図のウィンドウが表示されます。

中央のボタンをクリックします。"Light"の文字列がテキストブロックに表示されます。

続いて、ダークモードでプロジェクトを実行します。下図のウィンドウが表示されます。

中央のボタンをクリックします。"Dark"の文字列がテキストブロックに表示されます。

アプリケーションでカラーテーマを変更した場合の結果

アプリケーションでシステムのカラーテーマと違うテーマに変更した場合の動作を確認します。
アプリケーションのApp.xamlを以下のコードに変更します。
RequestedTheme="Light" を追加しています。アプリケーションでのカラーテーマの変更の詳細はこちらの記事を参照してください。

App.xaml

<Application
    x:Class="GetCurrentColorTheme.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:GetCurrentColorTheme"
    RequestedTheme="Light">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />
                <!-- Other merged dictionaries here -->
            </ResourceDictionary.MergedDictionaries>
            <!-- Other app resources here -->
        </ResourceDictionary>
    </Application.Resources>
</Application>

システムのカラーテーマをダークに設定してアプリケーションを実行します。アプリケーションのウィンドウはライトカラーで表示されます。