A guide to Silverlight 3 new features

                                 

Well, by now the interwebs are getting busy with the news about Silverlight 3 details announced at MIX09.  The team has been hard at work (and still aren’t resting) pushing out this beta release.  Over the next week you’ll see lots of blog posts by team members and Silverlight MVPs who have been enthusiastically waiting to share what we’ve been working on and show you some sample applications they’ve been working on.  Quite frankly, so will I :-).

But in the meantime, allow me to share my thoughts and perhaps some deeper details with you if you can’t discern them in updated API documentation or marketing messages.  The high level feature updates and what they mean to the platform are great and can be found on the Silverlight 3 Beta information section of the Silverlight community site.  I’ll try to boil it down at the developer level here though to articulate some of the core changes and what I think are relevant for you to know.

The Tools

First, to be successful and have fun, you’ll need some tools.  Here’s where you can get them:

Those would be my opinion of the bare minimum to fully evaluate Silverlight 3. 

NOTE: The Silverlight Tools installer performs one first step that requires an internet connection to download the developer runtime to install.  If you are behind a proxy server or if it fails early it is likely because it cannot retrieve that runtime because of your network configuration.  In that case, download the runtime separately and extract the tools bits (silverlight3_tools.exe /x) and then copy the downloaded developer runtime (Silverlight.3.0_developer.exe) in that directory, then run SPInstaller.exe.  Yeah, not terribly intuitive, but it works.

This should get you started on getting your environment up and running.  Before you install please know that once you do, your machine now becomes a Silverlight 3 dev machine.  You cannot down-level target to Silverlight 2.  If you still need to develop Silverlight 2 applications easily, ensure you are installing Silverlight 3 beta on a separate machine.  You’ve been warned :-).

The Resources

There will be a few places you can go to learn about things.  Here’s what I’d recommend:

These are some great starting points for resources.  As more samples and end-to-end applications come on board, I’ll be sure to point them out.

What’s New in Silverlight 3

Now on to the deeper dive stuff.  Saddle up, because this will be some long information in hopes to be as transparent as I can with the updates to the framework.  In each area I’ll be sure to point out if there are existing specific resources (labs, videos, etc.) for that specific feature.  This section represents where we are currently at with Silverlight 3.

Tooling

Besides the updates in Expression Blend 3, we’ve made improvements to the XAP compression within the Silverlight tools when creating XAP files.  We’ve seen our own application benchmarks but it is best to have you take a look at your own applications since content/resources vary across different applications.

The Eclipse for Silverlight project also announced Mac platform availability for Silverlight development (Silverlight 2).  That’s right.  Silverlight development on the Mac.

back to top

Controls

A great number of controls were added, including fulfilling some promises from the Silverlight Toolkit on bringing Mature band controls into the runtime.  Those include:

  • DockPanel
  • WrapPanel
  • Label
  • ViewBox
  • AutoCompleteBox
  • DataGrid
  • TreeView
  • Expander
  • HeaderedItemsControl
  • HeaderedContentControl

Additionally (and using some of these above as bases in some cases, new controls were added):

DataForm – The DataForm serves as a flexible control for displaying data representing a single entity definition.  This control enables various methods for display, edit/update and navigation through data.  When combined with other controls, DataForm provides a simple method for attaching to data contexts and having a quick or highly customized UI for displaying entity data.

Video: DataForm Reviewed

back to top

DataPager – The DataPager serves as a simple control to provide next/previous and numeric paging capabilities for data sets which implement the IPagedViewCollection interface.  When combined with .NET RIA Services (which ObjectDataSource automatically implements this collection), DataPager provides a quick and efficient mechanism for paging data without having to bring entire data sets to the client and page though them there.

back to top

Navigation Framework – A new navigation framework is introduced and implements two controls: Frame and Page.  Using this framework you can partition your views into separate XAML files and navigate to each view as simple as you would previously a web page.  This framework also integrates with the browser’s history journal to provide back/forward capabilities. 

By enabling this framework you can implement deep linking support in your Silverlight application easily.  This will help also with enabling certain SEO enhancements for your Silverlight application.  Watch the video to see how you can implement this as well as implement custom routing for friendly URIs without exposing your XAML location definitions.

Video: Navigation Framework

back to top

New Toolkit Controls – Several new controls were also introduced as a part of the Silverlight Toolkit.  Click on the links of those enabled here to view a video tutorial of the control.

For more information on the Silverlight Toolkit, visit their project page and get the updates for both Silverlight 2 and Silverlight 3 Beta.

back to top

Media

Media has been a strong point in Silverlight since day 1, but we’ve added some features based on customer feedback including support for new media types like H.264 and AAC encoding.  Additionally we’ve added support for RAW audio/video pipeline support, which will enable developers to provide audio/video decoding outside the runtime and render in Silverlight – opening up some new areas for wide support for 3rd party codecs.

back to top

Graphics

Perspective 3D transform support was added to enable 3D scenarios and putting objects on a plane for various user experience scenarios.  It’s fairly simple and no different than how you already interact with transforms (and of course, Expression Blend makes this easier), by manipulating the PlaneProjection:

   1: <Button Height="56" HorizontalAlignment="Left" Margin="66,73,0,0" VerticalAlignment="Top" Width="200" Content="Button">

   2:     <Button.Projection>

   3:         <PlaneProjection RotationZ="-53" RotationY="56" RotationX="20"/>

   4:     </Button.Projection>

   5: </Button>

This will enable various 3D scenarios (like CoverFlow type user interfaces, for example) and make for some type of transitions a lot easier (like front/back ‘flipping’ animations).

Video: Perspective 3D in Silverlight

back to top

Pixel Shader APIs were added to allow developers to create effects like blur and drop shadow effects (included) but also enable developers to create their own effects.  As an example of using the included Blur effect you could implement the effect on any UIElement (pictures and any UI XAML element).  The code below:

   1: <Button Content="Tim Heuer" FontSize="24" Width="150" Height="100">

   2:     <Button.Effect>

   3:         <BlurEffect Radius="10" />

   4:     </Button.Effect>

   5: </Button>

would result in the UI here:

Additionally as mentioned you can create your own effects.  Check out the video link for an example of how to use some existing DirectX type effect code and create your own Silverlight effects based on them.

Video: Silverlight 3 Effects

back to top

Animation Easing effects are now a part of Silverlight providing you with a set of easing animations such as bounce, elastic effects, etc.  These interpolators will help with smoother animation transitions and other visual effects you are trying to accomplish.

back to top

Cached Composition (GPU support) support enables leveraging the GPU for rendering which then frees up normal CPU processing for other things.  This will be a helpful API for having the ability to cache a visual tree for using for simple transforms or for offloading certain scenarios (media) to hardware versus having the software handle those tasks.

back to top

A new Bitmap API will enable developers to build applications that do more granular manipulation like a red-eye correction editor for photos being able to correct specific pixels writing them back to the bitmap.

back to top

Text improvements including more efficient rendering and animation of text within an application.  Additionally, making use of the JavaScript API for local font support would accelerate application load time when local fonts can be used.  While not in the beta, we will be adding ClearType support for text rendering in the final version of Silverlight 3.

Image Improvements including the decoding of image data before it is added to the visual tree and enabling control over the image cache.

back to top

UI Framework Enhancements

Element-to-Element Binding is now available in Silverlight 3.  This enables your UI elements to have binding toward properties of each other.  For instance:

   1: <Grid x:Name="LayoutRoot" Background="White">

   2:     <StackPanel Orientation="Vertical">

   3:         <Slider x:Name="myslider" Minimum="0" Maximum="100" />

   4:         <TextBlock Text="{Binding Value, ElementName=myslider}" />

   5:     </StackPanel>

   6: </Grid>

Would enable the value of the TextBlock to automatically update based on the position of the Slider’s thumb that the user moves in the Slider.  This is accomplished through this UI update and no code is required.

Video: Element-to-Element Binding

back to top

Styling improvements including dynamic changes and BasedOn styling.  This first enables you to change a style at runtime or to also mark a control’s style to be based upon an existing style definition.  This is helpful in dynamic control scenarios as well as providing user customizable user interfaces without the developer having to manage the visual tree re-rendering as an intense task now.

back to top

You now have the ability to style the CaretBrush for input controls.  This is helpful for high-contrast situations so that the Caret (cursor marker) is visible in contrast situations or however else you want to present the caret to the user.  You can do something as simple as:

   1: <TextBox CaretBrush="Blue" />

or as crazy as:

   1: <TextBox>

   2:     <TextBox.CaretBrush>

   3:         <VideoBrush SourceName="MyMovie" />

   4:     </TextBox.CaretBrush>

   5: </TextBox>

Why you’d want your input cursor to be a video, I have no idea (and hopefully you wouldn’t)…but just know that you can do that now :-).

back to top

With a built-in mechanism now for binding validation (and UI templates for validation), your application in XAML will now honor your data source’s exception layer for data binding. 

   1: <TextBox Text="{Binding Text, Mode=TwoWay, ValidatesOnExceptions=true}" />

For example, if your data has a requirement for a field to have data and the user tries to perform an action without entering the required data, your application will show default validation UI which you can change/customize if you’d like.

back to top

LocalConnection API

The LocalConnection API enables the scenarios for Silverlight applications to communicate with each other through an asynchronous messaging system.  This is helpful in advertising scenarios as well as when you have islands of Silverlight functionality mixed with standard HTML content as well.  The LocalConnection APIs have a LocalMessageSender and LocalMessageReceiver that operate as sort of a pub-sub model.  Silverlight applications across domains can also communicate with each other given the sender/receivers enable that via the code (default is not global communication).

Video: LocalConnection API in Action

back to top

Application Model Enhancements

The introduction of the complimentary API to OpenFileDialog, we now have the SaveFileDialog.  Guess what, it does exactly what you’d think it does by providing a mechanism to write content out to the client machine, prompting the user where to place that content via the standard OS-specific save dialog boxes.

Video: SaveFileDialog API

back to top

Merged ResourceDictionary support is now available!  This enables you to manage ResourceDictionary files in separate files and simply reference them in your XAML like:

   1: <Grid x:Name="LayoutRoot" Loaded="LayoutRoot_Loaded" >

   2:    <Grid.Resources>

   3:        <ResourceDictionary>

   4:            <ResourceDictionary.MergedDictionaries>

   5:                <ResourceDictionary Source="/myexternalresources.xaml" />

   6:            </ResourceDictionary.MergedDictionaries>

   7:         </ResourceDictionary>

   8:     </Grid.Resources>

   9: </Grid>

Very helpful in managing external dictionary files and maintainability of an application.

back to top

Assembly caching enables extensions to Silverlight that are not a part of the core runtime, but can be managed by the runtime to be cached, thus saving your application from having to download extension assemblies each time the application loads.  For example a reference to System.Windows.Controls.Data at compile time will result in a smaller XAP and in the AppManifest.xaml having this notation:

   1: <Deployment.ExternalParts>

   2:   <ExtensionPart Source="http://go.microsoft.com/fwlink/?LinkID=XXXXXX" />

   3: </Deployment.ExternalParts>

Which at runtime would result in your application loading and then the external parts being requested/downloaded and cached.  Each extension assembly that can have this enabled would be represented as a separate ExternalPart in the manifest.  This is not turned on by default and you can enable this in your Visual Studio project properties.

back to top

A new Network monitoring API is introduced to enable the scenarios of checking when the network status changes (i.e., connected/disconnected) as well as simple checking if the network is available.  To hook up to the NetworkChange event:

   1: NetworkChange.NetworkAddressChanged += new NetworkAddressChangedEventHandler(NetworkChange_NetworkAddressChanged);

and to query if the network is available:

   1: bool connected = NetworkInterface.GetIsNetworkAvailable();

These are both helpful in the following scenario and biggest addition to the application model framework.

back to top

Out-of-browser Experiences have now come to Silverlight!  This is a highly requested featured and is enabled with no additional download/plugin.  Each and every Silverlight 3 application can be enabled to run as a desktop application (yes, cross-platform with Windows/Mac) by subscribing to a series of APIs and defining the application in the manifest.  By defining the application in the manifest like:

   1: <Deployment.ApplicationIdentity>

   2:         <ApplicationIdentity

   3:             ShortName="MyTasks"

   4:             Title="MyTasks -- Get-r-done">

   5:             <ApplicationIdentity.Blurb>A simple tasks list you can take with you on the go.</ApplicationIdentity.Blurb>

   6:             <ApplicationIdentity.Icons>

   7:                 <Icon Size="16x16">AppIcons/task16.png</Icon>

   8:                 <Icon Size="32x32">AppIcons/task32.png</Icon>

   9:                 <Icon Size="48x48">AppIcons/task48.png</Icon>

  10:                 <Icon Size="128x128">AppIcons/task128.png</Icon>

  11:             </ApplicationIdentity.Icons>

  12:         </ApplicationIdentity>

  13:     </Deployment.ApplicationIdentity>

The application would now be enabled to be installed onto the desktop via a simple right-click context menu, or via an API like:

   1: Application.Current.Detach();

This is a really great scenario and in combination with the network detection can enable occaisionally connected applications.  See the video for a demonstration on the fundamentals of this feature.

Video: Out-of-browser Experiences

back to top

Application Frameworks

Alongside Silverlight 3 Beta, the team is releasing .NET RIA Services.  .NET RIA Services simplifies the traditional n-tier application pattern by bringing together the ASP.NET and Silverlight platforms. The RIA Services provides a pattern to write application logic that runs on the mid-tier and controls access to data for queries, changes and custom operations. It also provides end-to-end support for common tasks such as data validation, authentication and roles by integrating with Silverlight components on the client and ASP.NET on the mid-tier.

One paragraph cannot do this framework justice, so be sure to download the .NET RIA Services bits and go through the walk-through lab that is included with the install.

View the Guide: .NET RIA Services User Guide

back to top

Connected Systems Enhancements

Various improvements in ‘connected systems’ (web services, etc.) framework areas have been introduced to help faster and more secure scenarios for communication.

Binary XML support is introduced which enables Silverlight to communicate with Windows Communication (WCF) services using the Binary XML data format in addition to regular text XML.  The use of the Binary XML format results in smaller message sizes and better performance in the messaging with the service.

back to top

A command-line utility (slsvcutil.exe) is a part of the SDK tools to enable proxy code generation via command-line instead of just the Add Service Reference feature in the Visual Studio tools.  Using this feature is as simple as:

   1: slsvcutil.exe http://myservice.com/myendpoint.svc?WSDL

and can be as enhanced as emulating exactly the Add Service Reference feature for automated builds, etc.

back to top

Additional Improvements

Some other additional improvements in other areas include:

  • Better support for high contrast screen situations for colors/text by recognizing all the system colors
  • Deep Zoom additional APIs and improvements on the use of multiple MultiScaleImages

Over the next few weeks keep an eye on the Silverlight community site resources are for more video tutorials on these features and more. 

What do you think of some of what we’ve implemented in Silverlight 3?

by timheuer

Advertisements

One Response

  1. […] Fused Film placed an observative post today on A guide to Silverlight 3 new featuresHere’s a quick excerpt…framework also integrates with the browser’s history journal to … receivers enable that via the code (default is not global communication). […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: