This storyboard can be translated to: The image will rotate through 360 degrees every two seconds at a constant rate of rotation, and will continue to rotate forever. If you wish, you can set it to rotate through 360 degrees at a different speed, for example, every five seconds instead of every two seconds. You simply need to modify the Duration property.

The Height and Width of spin image need to be equal, otherwise, you’ll get a weird rotation. The CenterX and CenterY need to be half the value of the Height (or Width). The image Spinner.png that I provided in the SpinnerControl is 40 x 40, but in the above code, I specified 50 x 50 and I made sure to set the Stretch property to Uniform.

The other control in the SpinnerControl is a TextBlock which you probably know. You can configure it with your own values and you can even add dependency properties to the control to make it more general.

One of the suggested guidelines when creating a Windows Phone application is that when the user quits an application, the states of the pages are saved, so that when the user re-opens the application, it feels like he never quit.

With the Mango update, it is now possible to save the states of application pages, providing there is enough memory. However, there will be some cases when the application will tombstone. The purpose of my utility static class StateManager will help to save a ListView/ScrollViewer scroll position or other controls that have an internal ScrollViewer.

Before explaining my utility class works, let’s see what happen when the scroll position is not saved:

1- Create a “Windows Phone Databound Application”. 2- Run the app then scroll the list to the last item. 3- Press the Start button. 4- Press the Back button.

The state is preserved. Great, but…

Now, stop debugging the application and go to the properties of the project. In the Debug section, check the option “Tombstone upon deactivation while debugging”. This is the only way to force the tombstoning process while debugging.

Execute the last 3 steps and you’ll see that the list scroll position is not saved.

To fix this issue, insert the StateManager class (provided at the end of the article) in your project and call StateManager.SaveScrollViewerOffset and StateManager.RestoreScrollViewer on the list that you want to save/restore scroll position. The best places to insert those calls are in the method OnNavigatedTo and OnNavigatedFrom.

When I first read the excellent book 101 Windows Phone 7 Appsby Adam Nathan, I was surprised to learn that if you create a “Windows Phone Application” or a “Windows Phone Pivot Application” in Visual Studio, the application title is not displayed as it is the built-in metro applications of the Windows Phone OS.

If you want to see the differences for yourself, follow these steps:

1- Create a “Windows Phone Pivot Application”.
2- In the MainPage.xaml, change the “MY APPLICATION” title to “SETTINGS”.
3- Change the header name of the first pivot item from “first” to “system”.
4- Change the header name of the second pivot item from “second” to “application”.
5- Run the application.

You’ll see:

Now, exit the application and go in the “Settings” application of the emulator, then look at the page:

Do you see a difference in the “SETTINGS” application title?

To approximate the same design as the OS, the author suggests a style that you can apply to your pivot control:

The same issue happens with every page (PhoneApplicationPage). Instead of applying the fix to all the pages of an application, I created the TitleControl (the code is available for download at the end of the article).

Two of the goals behind the TitleControl were:

1- Get rid of all the XAML code that displays the header.

2- Remove the unnecessary extra grid that displays the header and the content. Remember, if you can have less containers like panels, a grids, or stack panels in a page, your loading speed will be faster.

With the release of the Mango update, having a minimized application bar with an application using the panorama control is now part of the Metro experience. The best example is the games hub. The minimized application bar uses the Opacity property as you can see in the following picture.

To mimic the application bar of the game hub, follow these 2 steps:

1- Add the following XAML code where the panorama control resides to add the application bar.

The application bar will use a solid color (i.e. no opacity) when it will be expanded. It’s easier to read like this:

When I implemented this behaviour in one of my applications, I discovered that the application bar was appearing while the splash screen was shown. It’s very subtle, but it feels like a bug. I saw this bug on some other applications in the Marketplace. Here is a screenshot with the splash screen with the application bar.

To correct this bug, it’s very easy:

1- Make the application bar hidden by default in the XAML code. It’s already included in the first step at the top (IsVisible=”False”).

2- In the page of the application bar, add the event handler Loaded of the page, then add ApplicationBar.IsVisible = true.

All Windows Phone applications that use Internet data should always check if there is a valid Internet connection. If there is no connection, a proper message should be displayed to the user. If your application relies on a specific server, don’t assume that Internet is not available if a call to the server returns an error, because the server might be down while the Internet is still available.

The proper way to check if you have an Internet connection (WIFI, Ethernet, or none) is calling the property:

NetworkInterface.NetworkInterfaceType

Unfortunately, even if it’s not obvious, calling this property on the UI thread can block the UI for many seconds. To avoid this problem, I created a NetworkInformationUtility class (the class and the sample project are available at the end of the post):