Adding transparent filter to Panorama background like Market place

Question

I am trying to add a transparent layer to my panorama background to dim the background image so the content can be displayed regardless of the colours in the images. Just like in the WP7 Market Place or the Pictures Hub on the phone.

I have played with the Opacity Mask. created a transparent image in paint.net to be used as opacity mask.

<ImageBrush x:Name="MyOpacityBrush" Stretch="Fill" ImageSource="../Images/imageFilter.png" />
    <ImageBrush x:Name="panoramaBrush" ImageSource="../Images/cloudsPanorama.jpg" />

And use it in my Panorama like:

<controls:Panorama x:Name="ViewPanorama" Visibility="Visible" Background="{StaticResource panoramaBrush}" OpacityMask="{StaticResource MyOpacityBrush}" />

However, this dims the whole page including any content displayed as if the transparent image is on top of everything. Is there a trick I am missing here. Perhaps add the opacity to the Grid?

Answer 1

Set the opacity of the background image (in xaml) to 0.6. Black or White text will be readable.

Answer 2

You can just set the opacity of the PNG image that you use as the background image*?

No need for additional masks, etc.

*You can do this in Paint.net by opening the image and then editing the property of the layer to adjust the opacity.

Answer 3

Use an opacity mask in a brush built with your imageSource Then use the brush as the background of your Panorama Control