- Introducing the Application Frameworks
- Understanding Silverlight
- Understanding the XNA Framework
- Summary
- Q&A
- Workshop
- Exercise
Understanding Silverlight
Silverlight for Windows Phone is based on the Silverlight 3.0 out-of-browser model and is targeted at media-based applications and rich, interactive text applications. The Windows Phone Silverlight runtime has been optimized for the tight memory environment of Windows Phone.
From a programmer’s perspective, Silverlight is an event-driven programming framework consisting of declarative markup, known as Extensible Application Markup Language (XAML), with supporting code. Silverlight projects can also have graphics, audio, and video resources. For controls, Silverlight uses a visual control tree, and when an item is added to that control tree, it is there until you remove it.
Silverlight offers a visual control framework for tasks such as input, user-interface (UI) rendering, media playback, controls, layouts, data binding, gestures, software input panels, and more. The Windows Phone developer tools also provide Microsoft Visual Studio project templates for basic applications, Panorama applications, and Pivot applications, which conform to the Metro design guidelines that can be used to jump-start your application development.
Silverlight offers a number of unique advantages to application developers and are the most common applications in the Windows Phone Marketplace. These applications are easy to build and are easy to polish.
Visual controls make a developer’s life easier and represent prebuilt templates for a number of common tasks. Silverlight for Windows Phone ships with a large number of stock controls, including Button, CheckBox, TextBox, TextBlock, WebBrowser, MediaElement, the Bing Map control, and more. The default control toolbox for Windows Phone Controls is shown in Figure 3.1.
Figure 3.1 Default control palette in the Visual Studio Toolbox.
Silverlight also has great visual designers in both Visual Studio and Microsoft Expression Blend to assist with the layout and formatting of Phone pages. Expression Blend, shown in Figure 3.2, focuses on the application designer experience rather than the developer experience and can be used for advanced layout and styling of Silverlight applications. Without the designer, it would be necessary to run the program to visually check layouts and rendering.
Figure 3.2 Expression Blend visual designer.
Being able to apply styles and resources for a common look and feel can save developers a large amount of effort and work. In web development, Cascading Style Sheets (CSS) are used to provide a common way to define a look and feel that may be applied across all assets in your project. Similarly, Silverlight offers Resource Dictionaries and Styles as a means to style common controls. Styles are commonly used to apply font items such as foreground, style, and family, as well as apply layouts to various flow templates.
Many applications make use of multiple pages and need a way to navigate between those pages. The Silverlight for Windows Phone application framework supports a navigation style similar to that used by web browsers, providing a history stack and backward and forward navigation methods. Applications may navigate from one page to another using document URIs and the NavigationService provided by the page framework. Navigation history is automatically maintained, keeping track of where you navigated from. Using the page navigation framework, Silverlight applications can easily integrate into the Windows Phone navigation model.
Most programmers have experience in event-driven programming metaphors. Traditionally, line-of-business applications built using VB, C#, or even Java use an event-driven metaphor. Events are raised and methods (either procedures or functions), which subscribe to those events, call the appropriate code in response. For certain types of applications, such as informational or forms-based applications, this is the preferred model and Silverlight fully embraces it.
In keeping with its Windows Presentation Foundation (WPF) base, Silverlight supports vector-based image formats and has a high-performance, vector-based rendering engine built in. Unlike raster, or bitmap, images, which can lose picture quality (called pixelation) when they are scaled to larger sizes, vector images use geometric paths for drawing so they dynamically scale without pixelation. Figure 3.3 shows the XAML for a vector-based smiley face image inside the Visual Studio design surface.
Figure 3.3 Vector-rendered smiley face inside Visual Studio.
Silverlight for Windows Phone is a very powerful event-driven programming framework allowing developers to bring their applications to life with a minimum of effort. Although the use of XAML in Silverlight is usually considered a benefit, it can also be a potential drawback, requiring study in the areas of layout, control binding, and other areas to become proficient.
Great Silverlight Examples
Many thousands of applications are available through the Windows Phone Marketplace. The following sections contain a couple of examples of what can be accomplished using Silverlight for Windows Phone.
The Facebook application, shown in Figure 3.4, by Microsoft offers a great look at an application styled for Windows Phone. The various levels of information are presented in a flowing manner, and the text fits in well with the Metro style across the phone. Explore how the various screens interact in this application before you begin designing your own.
Figure 3.4 The Facebook application interface.
Popper 2
Not all Silverlight applications need to adhere to the Metro style. Bill Reiss, of Blue Rose Games (http://www.bluerosegames.com/brg), has published a fantastic bubble breaker game called Popper 2, shown in Figure 3.5. Games don’t necessarily work very well in the standard Metro styling for Windows Phone, so Popper 2 uses an alternative user interface to render a Silverlight game on Windows Phone. These innovations include custom menus, screen flow, and much more. This is a great application to explore if you’re interested in an alternative Silverlight user-interface style.
Figure 3.5 Popper 2 menu and screen.