In this post we will show you the way to Restore and Preserve Page state for a Windows Phone application page.
Let us put some controls on the phone application page.
<Grid
x:Name="ContentPanel"Grid.Row="1"
Margin="12,0,12,0">
<TextBox
x:Name="txtValue"
Height="100"
Margin="12,37,58,470"
/>
<CheckBox
x:Name="chkValue"
Height="100"
Margin="251,144,0,364"
HorizontalAlignment="Left"
Width="134"
/>
<Slider
x:Name="sldValue"
Value="30"
Height="100"
Margin="28,383,58,124"
/>
</Grid>
To bind to the values of these controls, let us create a Data class as below,
There are three properties to bind values to three controls of the page. Next we
need to add PropertyChanged event and implementing a method called
NotifyPropertyChanged, which raises the PropertyChanged event.
Next we need to create properties for each control. We need to call the NotifyPropertyChanged event in the setter of property to notify when value
changed at the control. The control value would be bind with two way binding with
these properties. Eventually Data class will be as below,
using
System.Runtime.Serialization;
using
System.ComponentModel;
using
WindowsPhoneApplication3;
namespace
RestorePageState
{
[DataContract]
public class
Data :
INotifyPropertyChanged
{
private string
textValue;
private bool
chckValue;
private double
sliderValue;
public string
TextValue
{
get
{
return textValue;
}
set
{
textValue =
value;
NotifyPropertyChanged("TextValue");
}
}
public bool
ChckValue
{
get
{
return chckValue;
}
set
{
chckValue =
value;
NotifyPropertyChanged("ChckValue");
}
}
public double
SliderValue
{
get
{
return sliderValue;
}
set
{
sliderValue =
value;
NotifyPropertyChanged("SliderValue");
}
}
public event
PropertyChanged EventHandler PropertyChanged;
private void
NotifyPropertyChanged(stringpropertyName)
{
if (null !=
PropertyChanged)
PropertyChanged(this,
new
PropertyChangedEventArgs(propertyName));
}
}
}
As of now Data class is in place. Next we need to write code to preserve the
page state. We need two variables in the code behind,
-
One bool variable to check whether we are loading new
instance of page or not?
-
Object of Data class to bind values to
controls.
Next we need to override the OnNavigatedFrom function of page class to persist value
in state dictionary.
Now we need to override the OnNavigatedTo function. This function is called when
used navigates to this page.
Essentially there are three tasks we are performing in the above function
-
Checking if it is new instance of the page.
-
If yes then checking if value of data control
[object of data class ] is null
-
If null then reading from the state else
creating new instance of that.
Full source code behind to preserve page value is
as below,
using
Microsoft.Phone.Controls;
namespace
RestorePageState
{
public partial
class MainPage :
PhoneApplicationPage
{
DatadataToBindControls;
bool isNewInstanceofPage;
public MainPage()
{
InitializeComponent();
isNewInstanceofPage = true;
}
protected override
void OnNavigatedFrom(System.Windows.Navigation.NavigationEventArgs
e)
{
if (e.NavigationMode !=
System.Windows.Navigation.NavigationMode.Back)
{
State["Data"]
= dataToBindControls;
}
}
protected
override void
OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs
e)
{
if (isNewInstanceofPage)
{
if (dataToBindControls ==
null)
{
if (State.Count> 0)
{
dataToBindControls = (Data)State["Data"];
}
else
{
dataToBindControls = newData();
}
}
DataContext =
dataToBindControls;
}
isNewInstanceofPage = false;
}
}
}
We have code behind now bind the value of the controls, bind the value with mode
two way as below,
<Grid
x:Name="ContentPanel"Grid.Row="1"
Margin="12,0,12,0">
<TextBox
x:Name="txtValue"
Height="100"
Margin="12,37,58,470"
Text="{BindingTextValue,Mode=TwoWay}"/>
<CheckBox
x:Name="chkValue"
Height="100"
Margin="251,144,0,364"
HorizontalAlignment="Left"
Width="134"
IsChecked="{BindingChckValue,Mode=TwoWay}"/>
<Slider
x:Name="sldValue"
Height="100"
Margin="28,383,58,124"
Value="{BindingSliderValue,Mode=TwoWay}"/>
</Grid>
Before debugging, the last step we need to perform is
enable Tombstone upon deactivation while debugging in the properties page.
Now press F5 to run the application.
In this way you can preserve page state in Windows Phone 7.5 or mango phone.
I hope this post was useful. Thanks for reading.