When the first edition of this book was released, Silverlight 2 was just starting to gain adoption. It was a brand new technology from Microsoft (the managed code version was, anyway), one with strong competition. Though Silverlight 2 could have been used to build rich business applications, it didn't have the chops to be a strong contender in that space yet. Many of the features in this section are useful in applications of all sorts; I hate to classify them under the heading of "business," but that's the largest consumer of these features.

Validation, covered in chapter 13, was one of the biggest new features for business applications. Silverlight didn't add just validation but included support for validation through attributes, validation through exceptions, and even asynchronous validation, all of which work with the Silverlight controls. Silverlight even made it possible to completely customize the style of the validation information provided to the end-user.

One technology that builds heavily on the validation stack is WCF RIA Services (chapter 17). A good bit of the validation functionality rolled into the Silverlight runtime actually came from that project. WCF RIA Services provides a way to share validation and logic between the client and server as well as a framework for validation, data access, and security, shareable between Silverlight and other clients.

WCF RIA Services builds upon the WCF stack, but it's not the only enhancement there. The Silverlight networking stack, described in chapter 14, was greatly enhanced to support in-browser and out-of-browser operation, as well as SOAP 1.2 and a number of new protocol enhancements. These changes make it easier to use Silverlight behind a firewall where the services often have different requirements than those on the Internet.

Despite the promises of a paperless office, printing (covered in chapter 19) is still a staple of business applications everywhere. Printing in Silverlight is optimized for relatively short reports or documents, as well as for the equivalent of print-screen operations. It's super simple to use—as easy as working with XAML on the pages.

Finally, we come to a biggie: out-of-browser sandboxed and trusted applications. Covered in section 5.1, out-of-browser mode was one of the most significant enhancements made to how Silverlight operates. Silverlight 3 introduced the basic out-of-browser mode with a sandbox roughly equivalent to the one in browser. Silverlight 4 opened up whole new classes of applications by adding the trusted application mode with its reduction in prompts, increased file access, and (on Windows) access to IDispatch COM Automation servers. All of these features add up to a platform that's more than capable of being the client for our complex business applications.

One of the next major areas of enhancement for Silverlight is media.

Silverlight was first and best known for its media capabilities. The Silverlight media team didn't rest on that, instead pumping out enormous advances in media in both Silverlight 3 and 4.

Silverlight 2 included a Media Stream Source API for pushing media through the pipeline. But that API required that the bits be preencoded into one of the formats natively understood at the time. Though useful, this could lead to double-encoding and made transcoding even more difficult.

Silverlight 3 added support for pushing raw video and audio out of custom Media Stream Source implementations, as covered in section 20.6. As a result, you can write a managed codec for any type of media or even do something crazy like I did and use it to generate audio and video in real time for an emulator. Another option for generating video or at least images in real-time is the new bitmap API covered in section 21.2.

Speaking of codecs, one of the new codecs added was H.264 for video. H.264 has emerged as one of the most popular codecs for TV and video for devices. It was a logical choice for an additional native Silverlight format because now content producers can use even more of their content without reencoding. To appeal to the same audience, Silverlight 3 and 4 also continued to improve DRM capabilities, including the addition of offline DRM.

A new and exciting feature for Silverlight 4 is built-in support for video and audio capture devices or, specifically, webcams and microphones. Though not yet quite at the level that would allow you to create a real-time video chat application, the support does open up a number of new possibilities for application development. Webcam and microphone support are both covered in section 20.7.

Under the covers, Silverlight now has support for all formats of portable network graphics (PNG), something that was only partially supported in previous versions. Silverlight 4 also has support for pixel shaders and a set of built-in performance-tuned effects such as drop-shadow and blur, covered in section 18.4.

With all of these advancements plus a number of performance optimizations and even additions such as the Silverlight Media Framework, Silverlight continues its leadership in the media space, offering everything you need to build rich media-centric applications.

Sometimes, what you want is more than just a media experience; you want an application that can be truly interactive. Silverlight has your back there, too.

Since Silverlight 2, user interaction has received a number of important enhancements. Two of the most requested features, mouse scroll wheel and right-click mouse support (both covered in section 8.2), are now baked into the Silverlight core runtime.

One of the newer and hotter user interaction mechanisms is multi-touch, covered in section 8.3. The ability to support multipoint interaction with the user interface, especially in kiosk and handheld/tablet scenarios, is quickly becoming a requirement for many applications. Silverlight now includes core runtime support for multipoint touch interaction with Silverlight application.

Another user interaction piece missing from Silverlight 2 was the easy ability to show dialogs and pop-up windows (simulated) within your applications. Silverlight now not only has those (covered in chapter 15) but also notification toast, covered in chapter 5.

Finally, all the interaction in the world has no value if your user can't read the text on the screen. Happily, Silverlight includes plenty of improvements in text as well.

By far, the biggest improvement to text since Silverlight 2 is proper ClearType font rendering. Silverlight 2 performed only grayscale rendering, giving text a fuzzy appearance unless you carefully picked your color schemes.

While ClearType may be important for font rendering in general, right-to-left or bidirectional (BiDi) text is something that's absolutely essential for the correct rendering of many non-European languages. Silverlight supports not only BiDi text but also input method editors (IMEs) for complex composite characters for many languages, especially eastern languages.

Finally, one great improvement to text rendering and entry is the inclusion of the new rich text box control. This control allows you to display or edit text that includes multiple fonts and styles. The control can even embed other elements that can be interactive when the control is in read-only mode.

ClearType, BiDi and IME text, and the rich text box are all covered in chapter 9, along with insight into the text rendering stack in general and how to apply these new features to text throughout Silverlight.

Those are the major items. Of course, there are many more improvements sprinkled throughout. In addition to capturing the major items in this book, I've also added information based on the experience gained from working with Silverlight since its inception as well as recent knowledge gained from working closely with the Silverlight product team. In important areas, such as layout and rendering, I've gone deeper than needed by the average developer to provide some insight into the inner workings of Silverlight.

That was a lot to cover. I hope you enjoy reading it as much as I enjoyed writing it. Before we start covering individual feature areas, we'll need to get our development environment set up and build a small "Hello World!" application.

Silverlight 4 requires Visual Studio 2010 to work with projects and build the solutions. The multitargeting support of Visual Studio 2010 means that your applications can target either Silverlight 3 or Silverlight 4, once you have the Silverlight 4 tools installed.

If you don't already have a version of Visual Studio 2010, you can get the free Visual Web Developer 2010 Express from Microsoft at www.microsoft.com/express/Web/. The free web developer tools will enable you to create Silverlight 4 applications as well as ASP.NET applications. If you want additional features and tools as well as the ability to create more than just web applications, upgrade to Visual Studio 2010 Pro or higher.

Once you have installed Visual Studio 2010, visit http://silverlight.net/getstarted/ and use the Web Platform Installer to install the Silverlight 4 tools and SDK as well as any optional components.

The Silverlight tools for Visual Studio 2010 and the SDK contain everything you need to develop Silverlight 4 applications, including WCF RIA Services 1.0.

Optionally, you may want to install Microsoft Expression Blend 4. The link for that is also available on the Get Started page on Silverlight.net. Expression Blend 4 provides a designer-friendly set of tooling that makes creating complex animations, behaviors, and layouts a snap.

Microsoft and the community have created a number of helpful sites that will make your learning process go smoothly.

The official Microsoft Silverlight developer site is http://silverlight.net. There you'll find videos, sample applications, tutorials, add-ons and the community forums, all designed to help you be the best and most efficient Silverlight developer you can be.

In addition to Silverlight.net, http://channel9.msdn.com includes interviews with community and product team members, as well as tutorials. Silverlight.TV, located on Channel 9 at http://channel9.msdn.com/shows/SilverlightTV/, is a great resource for timely insight into the Silverlight products and releases.

The MSDN documentation for Silverlight 4 may be found at http://bit.ly/SL4MSDN.

Also, as a completely shameless plug, you may want to subscribe to my own blog at http://10rem.net. You can also follow me on twitter; my id is @pete_brown.

Finally, one other place you'll want to visit is Dave Campbell's Silverlight Cream: http://bit.ly/SilverlightCream. Dave has done a spectacular job, daily compiling the best Silverlight posts on the web. From Dave's link blog, you'll get an idea of what other community member blogs to subscribe to.

At this point, your developer machine is set up, you've subscribed to a few blogs, created an account at Silverlight.net, and maybe even poked around a little on the sites. Before we get into the features in detail in the rest of the book, I thought it would be good to see just how easy it is to build your first Silverlight "Hello World!" application.

Open Visual Studio 2010. Choose File > New Project and create a new Silverlight Application project. The name isn't important but I chose FirstSilverlightApplication for mine. Figure 1.2 shows the dialog with the correct project type selected and named.

Figure 1.2. Visual Studio 2010 New Project dialog with the correct project type selected and named

Once you click OK, you'll be presented with another dialog. This dialog provides options specific to the Silverlight project. Figure 1.3 shows the dialog.

Figure 1.3. The New Silverlight Application options dialog

Typically, you'll leave the options at their default values and just click through this dialog. But it's important to understand what's available to you. Table 1.1 describes each of the options presented in this dialog.

Once the new solution is created, you'll see two projects. The first one is the Silverlight application; the second is the website. The website project contains a folder ClientBin, which will contain the compiled output (.xap file) from your Silverlight application. It also contains two test pages that may be used to test your Silverlight application. By default, the .aspx page is set as the startup page but you may use the HTML page if you later plan to host on a non-.NET server. (Yes, Silverlight applications may be hosted by any HTTP server and not just Internet Information Services [IIS] running ASP.NET.)

With the project open and ready, it's time to turn to the user interface.

Open the MainPage.xaml file; it's usually open by default when you create a new Silverlight project. MainPage.xaml is the start page for your application, set as such by a single line of code inside App.xaml.cs.

Inside the opening and closing Grid tags, add the following XAML markup:

<Button Content="Get Tweets"
        Height="23"
        HorizontalAlignment="Left"
        Margin="12,12,0,0"
        x:Name="GetTweets"
        VerticalAlignment="Top"
        Width="75"/>
<ListBox x:Name="TweetList"
        Margin="12,41,12,12"/>

Figure 1.4. The Visual Studio 2010 IDE showing the markup correctly entered for MainPage.xaml

That markup creates two elements on the page: a Button and a ListBox. You could've dragged those controls from the toolbox onto the design view but that would be hard to describe in detail in this book. In the design view, you should end up with a form that looks like figure 1.4.

Next, double-click the Get Tweets button to create an event handler in the code-behind. Incidentally, this code, like all code in Silverlight, will run on the client inside the Silverlight plug-in. The event handler will be used in the next section, where we make a call to the Twitter search API.

The next step is to call out to the Twitter search API. Fill out the event handler we just created in the code-behind to include this code:

private void GetTweets_Click(object sender, RoutedEventArgs e)
{
  WebClient client = new WebClient();

  client.DownloadStringCompleted += (s,ea) =>
    {

      System.Diagnostics.Debug.WriteLine(ea.Result);
    };
  client.DownloadStringAsync(
    new Uri("http://search.twitter.com/search.atom?q=silverlight"));
}

The code here does a few interesting things. First, it creates an instance of WebClient, one of the easiest to use network clients in Silverlight. It then sets up an event handler using a lambda expression to respond to the results. Finally, it asynchronously calls the method to download the result string from search.twitter.com. The search is for tweets mentioning "silverlight".

The network call is asynchronous because all network calls in Silverlight are asynchronous. This can take a little getting used to at first but is easy to deal with once you've done it a few times. Chapter 14 goes into detail on how to use the asynchronous methods as well as the reasons behind them.

If you run the application, click the Get Tweets button, and view the output window, you'll see that you've already built enough to call Twitter and pull back the results in XML format. Not bad for a few lines of code! Our next step is to parse the results and display them in the ListBox control.

If you look in the output window from your last run, you'll see that the result format is an AtomPub document with an entry node for each of the results. In Silverlight, you can parse Atom a couple ways: you can use the built-in parsing of the SyndicationFeed class or you can use LINQ to XML to parse the results.

LINQ to XML is a great technology and has many uses above and beyond AtomPub document parsing, so I'm going to go that route. We'll end up with a little more code than the alternative approach, but I think it's worth it.

public class Tweet
{
    public string Message { get; set; }
    public Uri Image { get; set; }
}

private ObservableCollection<Tweet> _tweets =
    new ObservableCollection<Tweet>();

PARSING WITH LINQ TO XML

LINQ is something you may have used on other .NET projects. If so, you'll feel right at home because it's supported in Silverlight as well. If not, it's pretty easy to pick up. Think of it almost like SQL but in code and working on objects and written backwards, with no database in sight. Okay, it's not exactly like SQL, but it's a great query language that lets you perform iterations and filters in a single line of code. In any case, you won't need to be a LINQ expert for this example.

Right-click the project and choose Add Reference; add a reference to System.Xml.Linq. Figure 1.5 shows the dialog with the correct reference selected.

Once the reference is added, replace the Debug.WriteLine statement and the event handler declaration in the code-behind with the code from listing 1.1. This code performs the actual parsing of the XML document returned by Twitter search and loads the tweets collection with the processed results.

Figure 1.5. The Add Reference dialog with System.Xml.Linq selected for LINQ to XML functionality

Example 1.1. Processing the Twitter search results using LINQ to XML

Be sure to right-click and resolve the XDocument class in order to add the correct using statement to the top of your code.

The code does some interesting processing. It first loads the results into an XDocument so that it may be processed using LINQ statements. It then goes through the document selecting each entry element and creating a new Tweet object from each . The Tweet object itself is filled out by first grabbing the title element's value and assigning that to the Message and then doing another LINQ query to find the link element that has a type of image/png and assigning that to the Image property . Finally, the code loops through each of the results and adds them to the tweets collection .

The namespace declaration at the top is necessary because the Atom namespace is the default xmlns in the document. When parsing XML, you need to have the default namespace declared or the results will be empty.

With the parsing out of the way, the next step is to bind the ListBox to the _tweets collection so that it has a place to pull the data from.

BINDING THE LISTBOX

Silverlight is all about binding data. Chapter 11 goes into detail on how binding works and how to use it. For now, it's important to understand that rarely in Silverlight will you find yourself assigning data directly to controls. Instead, you'll set up binding relationships and let the elements pull the data as it becomes available.

In this case, we want to set the ListBox's ItemsSource property to our collection, so that it knows to load its individual items from the collection when the collection is updated. Since we're using an ObservableCollection, the ListBox will be alerted whenever an item is added to or removed from that collection.

Figure 1.6. The default presentation for the ListBox items leaves something to be desired. It looks like WinForms or something! I demand more from our first Silverlight example.

Add the following line of code to the MainPage constructor, under the InitializeComponent call:

TweetList.ItemsSource = _tweets;

That's all you need to do to set up the binding relationship for the ListBox. Run the application and retrieve the tweets. You should end up with something that looks like figure 1.6.

That's not really what we want, though. All we see are a bunch of type names. We want to display images and text. The reason you see the type name is because this is the default item template behavior. By default, the individual items are presented as their ToString call. This works fine for a string or numbers or similar, but with complex types? Not so much.

Our final step in this walkthrough is to pretty up the ListBox results so we can see something more meaningful.

To make the ListBox present items using a format of our own choosing, we need to use a DataTemplate. DataTemplates are covered in detail in section 11.4. For now, understand that they're a chunk of XAML that'll be used to format each item in the list.

The DataTemplate for this ListBox will contain two columns for each row. The first column will contain the picture of the tweeter; the second will contain the body of the tweet.

Open MainPage.xaml and replace the entire ListBox declaration with the XAML from listing 1.2.

Example 1.2. DataTemplate to format the tweets

In this markup, we first tell the ListBox that we want its content to take up the full width of the ListBox, without any horizontal scrolling . The next bit of markup defines the grid, with an autosized first column and a full-width second column . Then, we bind an Image to the Image property of the Tweet class and a TextBlock to the Message property .

The end result of the work we've done, including this fine ListBox DataTemplate, is shown in figure 1.7.

I've been working with Silverlight and WPF for a number of years now, but it never fails to impress me just how easy it is to have complete control over what your application displays. I remember the days when you had to purchase specialty controls to do something as simple as display an image inside a ListBox. Now, all you need to do is a little XAML. And, if you don't feel like typing in XAML, you can crack open Expression Blend and use it to design the DataTemplate interactively on the design surface. As a famous dark lord of the Sith once said, "Impressive...most impressive."

Figure 1.7. The end result of the Twitter search "Hello World!" example looks good!