Grid Background ImageSource binding breaks app return from background Windows Phone 8

Question

I am following this guide from Microsoft to load resolution dependent image as my app's background.

In my About page for instance I have this code

<Grid>
    <Grid.Background>
        <ImageBrush ImageSource="{Binding BestResolutionImage, Source={StaticResource MultiResImageChooser}}"/>
    </Grid.Background>
    <!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Margin="12,0,12,0">

    <phone:Pivot Title="ABOUT"  x:Name="helPagePiv">
        <!--Pivot item one-->
        <phone:PivotItem Header="about us">
            <controls:About />
        </phone:PivotItem>

        <!--Pivot item two-->
        <phone:PivotItem Header="change log">
            <controls:ChangeLog />
        </phone:PivotItem>
    </phone:Pivot>

</Grid>
</Grid>

It works fine but problem occurs when I click a link that launches the email app, or browser control which puts my app in the background. When I return to my app using the back hardware button, the background image is not reloaded resulting in empty background.

I imagine I'd have to use INotifyPropertyChanged somewhere. Anyway how do I make sure the background image is refreshed when returning to my app?

UPDATE I've tried changing the binding Mode but that didn't make any different.

UPDATE 2 This issue seems to be absent in Windows Phone 8.1. So it's good for now if I am updating to 8.1.

Answer 1

You would have to implement INotifyPropertyChanged in your MultiResImageChooser class. You would have to raise the property changed event for the BestResolutionImage property within such property's setter.

public class MultiResImageChooser : INotifyPropertyChanged
{
    public event NotifyPropertyChangedArgs PropertyChanged;

    ...

    public ImageSource BestResolutionImage
    {
        get
        {
            return _bestResolutionImage;
        }
        set
        {
            if(value != _bestResolutionImage)
            {
                _bestResolutionImage = value;
                OnPropertyChanged("BestResolutionImage");
            }
        }
    }

    protected virtual void OnPropertyChanged(string property)
    {
        if(null != PropertyChanged)
        {
            PropertyChanged(this, new NotifyPropertyChangedEventArgs(property));
        }
    }
}