Customizing the Appearance of the System Tray

Unlike the ApplicationBar, the SystemTray class uses dependency properties, making it compatible with the XAML data binding infrastructure. SystemTray has the following four display-related properties:

BackgroundColor

ForegroundColor

Opacity

IsVisible

Each of these properties coincides with the ApplicationBar properties. In the sample, the SystemTray is bound to the same viewmodel properties as the AppBar, as shown:

Click here to view code image

<phone:PhoneApplicationPage
...
    shell:SystemTray.IsVisible="{Binding SystemTrayVisible}"
    shell:SystemTray.BackgroundColor="{Binding BackgroundColor}"
    shell:SystemTray.ForegroundColor="{Binding ForegroundColor}"
    shell:SystemTray.Opacity="{Binding BarOpacity}">
...
</phone:PhoneApplicationPage>

Thus, when you alter the appearance of the application bar, the changes are also applied to the system tray.