Grid の Background に背景色を設定しているのに変わらない

かずきさんの UWP 入門見て勉強してた最中に出くわした現象で、なんでや！;つД｀)とずっと悩んでいたのですが、解決？したので共有します。

目次

まずは、こちらの「おわかりいただけただろうか」のソースコードです。ちなみに、NuGet で、Microsoft.Xaml.Behaviors.Managed をインストール済みです。

現象が出るソースコード

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:c="using:Microsoft.Xaml.Interactions.Core"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
        <i:Interaction.Behaviors>
            <c:EventTriggerBehavior EventName="PointerEntered">
                <c:ChangePropertyAction PropertyName="Background" Value="Blue" />　★セットしてるのに・・・(´･ω･)(･ω･｀)ﾈｰ
            </c:EventTriggerBehavior>
            <c:EventTriggerBehavior EventName="PointerExited">
                <c:ChangePropertyAction PropertyName="Background" Value="{ThemeResource ApplicationPageBackgroundThemeBrush}" />
            </c:EventTriggerBehavior>
        </i:Interaction.Behaviors>
    </Grid>
    
</Page>

Grid 内（ここでは結果的にウィンドウ内）にマウスカーソルが入ると、背景色が“青”に変わって、逆に、マウスカーソルがウィンドウから出ると、元の色に戻るという動きをしたいのですが、マウスカーソルがウィンドウ内に入っても、背景色は”青“に代わりません。

そして、解決方法がこちらです。

現象が出なくなった（うまく動作するようになった）ソースコード

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:c="using:Microsoft.Xaml.Interactions.Core"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid Background="Transparent">　★あらかじめ、背景色を付けた
        <i:Interaction.Behaviors>
            <c:EventTriggerBehavior EventName="PointerEntered">
                <c:ChangePropertyAction PropertyName="Background" Value="Blue" />
            </c:EventTriggerBehavior>
            <c:EventTriggerBehavior EventName="PointerExited">
                <c:ChangePropertyAction PropertyName="Background" Value="{ThemeResource ApplicationPageBackgroundThemeBrush}" />
            </c:EventTriggerBehavior>
        </i:Interaction.Behaviors>
    </Grid>
    
</Page>

これで、背景色が青に変わってくれるようになりました！良かった！どうやら Grid は、Background に色を塗っておかないと、色を変えても変わらない？仕様みたいです。

で、気付いた

入門の方のタグでは、

<Page
    x:Class="App1.MainPage"
    ～略～
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">　★ Grid に背景色
        <i:Interaction.Behaviors>
        ～略～

で、多分、デフォルトで、Grid に背景色が設定されているんですね。で、現在（私の環境）では、

<Page
    x:Class="App1.MainPage"
    ～略～
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">　★Page に背景色

    <Grid>
        <i:Interaction.Behaviors>
        ～略～

になっているんですよね。Visual Studio の生成コードの仕様変更が入った？？

終わりに

っていう話でした。解決？と null 条件演算子みたいな書き方になったのは、裏付けがとれなかった（有識者の方の記事を見つけることができなかった）ためです。しかし、動作を見るとそういう仕様みたいですね。