Changing the Background and Foreground Colors of Application Bar on WP7

Comments

Hamishwillee - A bit thin

Hi sreerajvr

This is useful information but it would be even better if you:

1. linked to reference documents on MSDN about this
2. provide an image of the application bar, showing the changed colours
3. explained what colours can be used, and why you might choose a colour
4. Provided C# information on how this colour might be changed - after all, not everyone will want to do this from XAML.

In addition, this is part of the story told by Theme aware Windows Phone application. I think it would be best to merge this content into that article. What do you think?

Regards

Hamish

Log in or Join to leave comments.

See Also

• Application Bar for Windows Phone (MSDN)

Article Metadata

---

Tested with

SDK: Windows Phone 7.1 SDK

Devices(s): Nokia Lumia 800

---

Compatibility

Platform(s): Windows Phone 7.5 (Mango)

---

Article

Created: sreerajvr (05 Apr 2012)

Last edited: hamishwillee (10 Apr 2013)

Introduction

This article shows how to change the foreground and background colour of the Windows Phone Application Bar, in XAML.

XAML

<phone:PhoneApplicationPage.ApplicationBar>
       <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True" Opacity="0.75" ForegroundColor="Green" BackgroundColor="Cyan" >
                <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
        <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
        <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
         </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

Summary

You can provide your colours with changing the attributes Opacity, Foreground and Background in the XAML.