Porting Silverlight-Based Applications to Windows Phone

This topic describes development and design choices that you need to make when you port an existing Silverlight-based application to run on Windows Phone.. Although most of the code in a Silverlight-based application can be ported unmodified to a Windows Phone project, there are some issues to consider.

You need to use a multiple-pass process to port most applications. In the first pass, port your application code to the appropriate Windows Phone project and update the code. In subsequent passes, optimize the application for Windows Phone.

To update the code

  1. Create a Windows Phone project by using Windows Phone SDK, and add the user code from your existing application to the Windows Phone project.

    For networking applications that connect to a web service, verify that the web service does not require the client application to implement any features that are not supported on Windows Phone. For more information, see Networking in Silverlight for Windows Phone.

    Important note Important Note:

    If your Silverlight-based application uses the Frame and Page navigation model, you must change the root frame so that it derives from PhoneApplicationFrame and set each page so that it derives from PhoneApplicationPage. For more information, see Frame and Page Navigation.

  2. Compile the code and correct any errors.

    Errors might occur because of implementation differences between Silverlight and Silverlight for Windows Phone. For detailed information, see Implementation Differences Between Silverlight and Silverlight for Windows Phone and Class Library Support for Windows Phone. For networking applications, see Networking in Silverlight for Windows Phone.

Next, optimize the application for Windows Phone. This step involves reviewing testing the application multiple times to make sure that you consider all phone-specific issues.

To optimize the application for Windows Phone

  1. Adapt the application UI to support the Windows Phone screen size and resolution.

    Windows Phone has a smaller screen size than hardware normally used for other Silverlight-based applications. This can result in text that is too small to read or targets for touch input that are too small to use. Text should not be hard coded, and font size should be 15 points or larger. Touch targets should not be smaller than 9 mm or 34 pixels square.

    The screen resolution on Windows Phone OS 7.0 is 480 x 800 in portrait mode, and 800 x 480 in landscape mode. Most applications need to support both modes. If users need to use portrait mode, you might need to disable keyboard input, especially to support hardware that has a sideways keyboard.

    Grid and StackPanel layouts are most adaptable to applications that use different screen modes, such as portrait and landscape. For additional information, see Designing a Flexible User Interface.

    The Canvas layout uses fixed screen coordinates and, depending on the implementation, might not scale easily without re-coding. If you are using a Canvas, you might need to force the user to use either portrait or landscape mode.

    For media-based applications, use the recommended media encoding settings described in Media in Silverlight for Windows Phone.

  2. Update the application to conform to the design system that is codenamed Metro.

    Control templates, such as the Silverlight Button, are updated for Windows Phone to provide the Metro appearance and behavior. See User Experience Design Guidelines for Windows Phone for a complete set of guidelines for designing a Windows Phone application.

    In many scenarios, you can add a Panorama or Pivot control to enable the user to quickly navigate between views or pages, and to provide a Metro appearance and behavior to the application.

    The Application Bar for Windows Phone is used to provide users with quick access to an application's most common tasks. Consider adding an Application Bar control to the program to enhance ease of use.

  3. Adapt the application for touch input.

    Larger targets make touch input easier for the user. Touch targets should not be smaller than 9 mm or 34 pixels square. You might want to minimize the amount of keyboard input required.

    The re-templated Silverlight controls such as ListBox support gestures. For custom controls, you can use mouse events to simulate gestures such as double-tap and tap and hold. For additional information, see Input in Silverlight for Windows Phone.

  4. Test the application and optimize performance. Some application features such as animations might need to be re-coded to meet user expectations for performance. For additional information, see Creating High Performance Silverlight Applications for Windows Phone and Graphics in Silverlight for Windows Phone.

  5. Optimize the application for networking, if necessary.

    Although network bandwidth might be lower on a device, network latency is more likely to affect your application’s performance. The radio stack might need to wake up before the device can receive data over the network. Following are a few considerations for networking applications:

    • Applications that depend on Internet connectivity should cache data in isolated storage and provide an error message when a network connection is not available.

    • If the application makes frequent web service requests, you might need to limit the frequency of requests or buffer larger amounts data before sending a request.

    • If the application waits for updates from a web service, you might need to use the Microsoft Push Notification Service, which enables you to receive either toast notifications if your application is not running, or raw notifications if your application is in the foreground.

  6. Consider extending or improving the application by adding platform-specific features such as the accelerometer, GPS, or a camera. For more information, see Windows Phone Development.