Get the effective backcolor of app bar in WP8

Question

I'm trying to implement a custom popup menu for one of my app bar icon button (something like the PhoneFlipMenu tool). I'm using a vertical StackPanel for that:

<StackPanel x:Name="popupMenuListCommands" Grid.Row="1" 
            Orientation="Vertical" VerticalAlignment="Bottom" 
            Background="{StaticResource PhoneDisabledBrush}"
            Visibility="Collapsed">
    <TextBlock Text="menu item 1" Style="{StaticResource PopupMenuListCommand}" />
    <TextBlock Text="menu item 2" Style="{StaticResource PopupMenuListCommand}" />
</StackPanel>

It is shown when the user presses the app bar button:

void appBarIconButtonList_Click(object sender, EventArgs e)
{
    popupMenuListCommands.Visibility = Visibility.Visible;
    ApplicationBar.IsVisible = false;
}

There are 2 problems:

1) How can I retrieve the effective color of the application bar to use it in my stack panel? ApplicationBar.BackgroundColor returns #00000000, but obviously the effective color of the app bar background is not this. For instance, it is a dark gray when the dark phone theme is on.

If we cannot retrieve this color dynamically, perhaps, we just need to hard code 2 color values for the dark and white themes. Then the question is what are their values?

2) How to use the color retrieved on the previous step to make the stack panel non-transparent? Now I see the main content under it even if I specify the background brush explicitly.

Answer 1

You can get the application bar color from the app resource named "PhoneChromeBrush". So all you need to do is set the stack panel background to this brush.

    <StackPanel x:Name="popupMenuListCommands" Grid.Row="1" 
        Orientation="Vertical" VerticalAlignment="Bottom" 
        Background="{StaticResource PhoneChromeBrush}"
        Visibility="Collapsed">
<TextBlock Text="menu item 1" Style="{StaticResource PopupMenuListCommand}" />
<TextBlock Text="menu item 2" Style="{StaticResource PopupMenuListCommand}" />

This way you don't have to worry about the phone dark or light theme.

Answer 2

App bar uses a default phone color according to the theme. So, instead of using the app bar color why not use the default theme color? That will also do the same. http://www.jeff.wilcox.name/2012/01/phonethememanager/ this will help you.

For dark theme the color is rgb (31, 31, 31). For light theme the color is rgb (221,221,221).

Hope this helped. Cheers