I like the thought you have to put in to a Windows Phone 7 application, to make it work in both dark and light themes together with the accent colors. But at the same time it creates quite a few challenges. One of those is to have a panorama background and title graphics that reacts to your default settings.

The trick is to have the view model handle what graphics should be displayed and make it sensitive to theme changes. The first I did was to use the them detection method proposed by An Insomniac Geek This looks like this in my version (as I place it in the base class for my views):

Next is to fix the properties for the ViewModel that is attached to the view like this:

Finally fix the bindings in the view:

For some extra fun don’t forget to set the property in the sample date for blendability. It’s always better to support this for blend design time as well.

I use this method whenever I need graphics in my view that should be theme aware, for example an image for titles and headers.

8 Comments

  1. I am trying to make my apps background change with light/dark. Where do these snippets of code go? App.Xaml.cs? Mainpage.xaml.cs?

  2. @Omega

    I use the MVVM pattern for my applications.

    Most code go into the ViewModel as properties. That way I can just bind to it in the View (XAML). None of it should be in the code behind page.

  3. okay, so it goes in the XAML. bear with me I have next to no coding knowledge, learning as I go. Not sure where the ViewModel is…ugh I need to read a book lol.

Trackbacks for this post

  1. Tweets that mention Theme aware panorama background in windows phone 7 — Jayway Team Blog -- Topsy.com
  2. Creating a WP7 app: Supporting dark and light themes « Timdams's Blog
  3. Theme dependent panorama background « World Wide Code
  4. 蒼の王座・裏口 » Lightテーマ/Darkテーマ用にPanoramaの背景画像をコードで切り替える方法
  5. Theme Aware Panorama Control for Windows Phone | Jason Mitchell

Leave a Reply