Change border color application bar button windows phone

Question

How do I change the application bar from this

to be like this

.

I already try code like this

<phone:PhoneApplicationPage.ApplicationBar> <shell:ApplicationBar IsVisible="True" IsMenuEnabled="False" Mode="Minimized" BackgroundColor="#01A3BE"> <shell:ApplicationBarIconButton x:Name="About" Text="About" IsEnabled="True" Click="About_Click" IconUri="/Assets/AppBar/Icon Navigation.png"/> </shell:ApplicationBar> </phone:PhoneApplicationPage.ApplicationBar>

but the border still like picture number 1 with black border. And when I open Blend it just looks like application bar style can not be edited.

Answer 1

The ApplicationBar and ApplicationBarIconButton are theme aware, they will automatically change their foreground color if you change your phone's theme to light or dark.

To style other elements, you can access the current themes foreground color via

{StaticResource PhoneForegroundBrush}

Answer 2

ApplicationBar color is following current phone theme, as also stated in @Gerrit answer. So to force it change to white, you can try applying light theme locally for your application (not changing phone theme entirely) using PhoneThemeManager .

ThemeManager.ToLightTheme();

Different ways to force your application displayed in light theme offered as answers to this question How to force windows phone 8 app to be run in light theme . And using Jeff Wilcox's PhoneThemeManager is the easiest, in my opinion.

Answer 3

This is what u want

this.ApplicationBar.ForegroundColor = Color.FromArgb(255, 255, 255, 255);

You can create ApplicationBar in code like:

ApplicationBar = new ApplicationBar();
ApplicationBar.BackgroundColor = Color.FromArgb(255, 52, 73, 94);
ApplicationBar.ForegroundColor = Color.FromArgb(255, 255, 255, 255);

Hope this helps.