Forcing a dark theme on Windows Phone

Despite the fact that it looks terrible, Windows Phone offers users the ability to place their phones into a light theme. For any app that applies a specific color or background anywhere, testing against this theme is a critical step before submitting a new application, and is almost guaranteed to cause a few headaches.

While BlackBerry 10 allows you to force a dark theme for your app with a single line of XML, for Windows Phone you need to force individual components into a dark theme. For the most part this is done by remembering to explicitly set your background and foreground colors for every component, this can usually be done either in XAML or in C#. Below is an example of setting the colors for the ApplicationBar in C#.

ApplicationBar appBar = new ApplicationBar();
appBar.BackgroundColor = Color.FromArgb(255, 0, 0, 0);
appBar.ForegroundColor = Color.FromArgb(255, 255, 255, 255);
ApplicationBar = appBar;

Setting the SystemTray to a dark theme requires a bit a more unique approach, where you add attributes to the root element of the main PhoneApplicationPage in XAML. As seen in the following lines of code.

shell:SystemTray.BackgroundColor="Black"
shell:SystemTray.ForegroundColor="FloralWhite"

Also note that you can not set the SystemTray ForegroundColor to exactly white. It can be very close to white such as a very light gray, or the FloralWhite that I used, but it can not be exactly white. While the small print of Microsoft’s documentation is very clear on this, the reason why seems to be a complete mystery.