Silverlight SDK

Silverlight 3 has Released!

WHOOT!

Here's some links to get you synced up:

- Scott Guthrie's Silverilght 3 kick off announcement
- What's New in Silverilght 3
- Get Started (e.g. get new tools, SDK, runtime, tutorials, other links)
- Breaking Changes (good to read if you're migrating older apps to Silverlight 3)
- Offline Silverlight 3 MSDN Documentation
- Online Silverlight 3 MSDN Docs

Silverlight Hardware Acceleration

Caching visual elements as bitmaps allows you to take advantage of hardware accelaration. Once an object or tree of objects has been cached as a bitmap, it no longer goes through the render phase as the application refreshes, rather, the cached bitmap is rendered. The cached bitmap swapping is able to take advantage of hardware acceleration from the user’s GPU which can yield significant performance improvements for some scenarios.

LIVE, HD broadcast of the Michael Jackson memorial using IIS Smooth Streaming and Silverlight

Today, July 7^th, 10AM PT, 1PM ET – We are broadcasting the Michael Jackson memorial, live in HD from the Staples Center in Los Angeles using IIS Smooth Streaming and Silverlight: http://inmusic.ca/news_and_features/Michael_Jackson.

Breaking Changes Document Errata (Silverlight 3)

This blog post lists additions and corrections to the Silverlight 3 Breaking Changes document.

Like the breaking changes document, I'm splitting the errata into three categories-- Breaking Changes since Silverlight 3 Beta, Breaking Changes since Silverlight 2, and Upgrade Breaking Changes. See Silverlight 3 Breaking Changes document for more information on these categories

Breaking Changes since Silverlight 3 Beta

[Addition] WriteableBitmap Related Section

This section is incomplete. Here is what this section should say:

WriteableBitmap Changes

-          The PixelFormat parameter for the WriteableBitmap constructor has been removed. WriteableBitmap(int pixelWidth, int pixelHeight, PixelFormat format) is now WriteableBitmap(int pixelWidth, int pixelHeight).

-          The only supported PixelFormat is now Pbgra32.

-          Similarly, the PixelFormat and PixelFormats type has been removed.

-          The indexer has been replaced with a Pixels[] array.

-          WriteableBitmap.Lock() and WriteableBitmap.Unlock() have been removed.

-          If you use the Render method. you will need to call Invalidate in order for the bitmap to render.

[Correction] “Effects Files (.ps) can no longer be loaded as Content” Section

In the section called “Effects Files (.ps) can no longer be loaded as Content”, there is a correction in the code example:

pshader = new PixelShader() { UriSource = new Uri("SilverlightCustomEffect;component/GrayScaleEffect.fx.ps", UriKind.Relative) };

Needs a leading “/” (see highlighted below).

pshader = new PixelShader() { UriSource = new Uri("/SilverlightCustomEffect;component/GrayScaleEffect.fx.ps", UriKind.Relative) };

[Addition] Behavior change to Validator.ValidateObject/TryValidateObject

In Silverlight 3 beta, Validator.[Try]ValidateObject would validate entity-level validation attributes regardless of the success or failure of the property-level validation attributes.  Now, Validator.[Try]ValidateObject will only validate entity-level validation attributes if all property-level attributes were validated successfully.

Breaking Changes since Silverlight 2

[Addition] Image.Source now returns null when not initialized
In Silverlight 2, getting Image/ImageBrush.Source before the property was set would create an empty BitmapImage.  In Silverlight 3, if the property has not been set, it will return null.  For example, if Image.Source has not been set, the following line of code will return null in Silverlight 3:

elementWithImage.Fill.GetValue(ImageBrush.ImageSourceProperty)

[Addition] GetValue(ImageBrush.ImageSource) returns a string instead of a BitmapImage

In Silverlight 2, this code would return a BitmapImage:

myImageBrush.GetValue(ImageBrush.ImageSourceProperty);  // returns a string

In Silverlight 3, there is a known bug that this will return a string that is the URI of the bitmap image. Note that calling the property directly (myImageBrush.ImageSource) continues to correctly return the BitmapImage object.

[Addition] <asp:Silverlight> with cross-domain .xap’s has JavaScript error

When using the <asp:Silverlight> control to run a .xap file from a different domain than the ASP.net page, in Silverlight 3 the page will had a JavaScript error when be .xap is loaded.  (eg, if the ASP.net page is from foo.com and these app is from bar.com)  Other than the yellow icon in the lower left corner of the browser indicating the JavaScript error, the page should continue to work.  The underlying problem is that Silverlight 2 did not fire the Loaded event in the case of cross domain .xap’s, this bug was fixed in Silverlight 3 however the <asp:Silverlight> was not expecting Loaded to fire and accessed properties that are not available for cross-domain .xaps.

To fix the JavaScript error, either set HtmlAccess=”Disabled” on the asp:Silverlight control or replace the control with <object> (see “System.Web.Silverlight.dll has been removed from the SDK” for instructions about how to use <object>).

Upgrade Breaking Changes

[Addition] DataGrid bug where can’t keyboard to last item when HorizontalScrollBarVisibilty=Auto

The DataGrid ScrollIntoView API does not work correctly on the last item if HorizontalScrollBarVisibilty is set to Auto, and there is a horizontal scrollbar present.  In this case, the last item will be covered up by the scrollbar.  Since the Down key functionality makes use of this API, pressing down to navigate to the last item will also exhibit this behavior.  The workaround for this issue is to set HorizontalScrollBarVisibility to Visible for this scenario.  Vertical scrolling using the vertical scrollbar is not affected.

Silverlight 3 Bugs

Below is a list of Silverlight 3 bugs you might run into. The plan is for at least most of these to be fixed at some point in the future. 

Cross-domain XAP
If you are loading a XAP source file from a cross domain location, (that is loading the XAP from a location other than the server providing the Web page), and you are enabling scripting to the Silverlight application, (by setting HtmlAccess=”enabled” on the ASP.NET Silverlight controls), a JavaScript error may occur.

You can resolve this issue by either:

-          Modifying your Web page to use the object tag, (and accompanying Silverlight.js file), or,

-          Disable HtmlAccess on the Silverlight controls if they are not needed, or,

-     Use the source code in the code gallery build.  The code gallery build and source code has a fix that has been applied for this issue. See Obtaining the Source Code for the ASP.NET Silverlight Controls. 

CPU Utilization While the Application is Idle
If you are loading a large XAML or XAP with the ASP.NET Silverlight controls, then there may be a case where the client CPU is being used, even though there is no activity in the Silverlight application.

You can resolve this issue by either:

-          Modifying your application to use the object tag, and do not handle the sourceDownloadProgress or the sourceDownloadComplete events on the plug-in, or,

-          Patch your Web application with the following JavaScript:

<asp:Silverlight

OnPluginSourceDownloadComplete="downloadComplete" .. />

<script type=”text/javascript”>

function downloadComplete(sender, args) {

    var sb =

sender.get_element().content.FindName("LoadingAnimation2");

    if (sb) sb.Stop();

}

</script>

-  Use the source code in the code gallery build.  The code gallery build and source code has a fix that has been applied for this issue. See Obtaining the Source Code for the ASP.NET Silverlight Controls. 

Exception when opening OpenFileDialog/SaveFileDialog while debugging

Note that this is only an issue when you are debugging. This exception occures because there is a timeout for user-initiated actions.

Workaround: Set a breakpoint after the dialog is opened. 

Exception when opening OpenFileDialog/SaveFileDialog from a synchronous callout such as a KeyDown event handler.

Due to reentrancy issues with these dialogs, you cannot call them from KeyDown event handlers and other synchronous callouts such as LayoutUpdated and SizeChanged event handlers. The exception does not occur when the application is hosted in Internet Explorer running in protected mode.

Out of Browser: Mac (Tiger only) -- Application Install fails for applications with unicode shortnames

On the Mac OS (Tiger only), install fails when shortname contains unicode characters like:
呉音
தமிழ் 

VisualTreeHelper.FindElementsInHostCoordinates is not returning a element that has a Matrix3DProjection applied to it.

VisualTreeHelper.FindElementsInHostCoordinates does not work on elements that have Matrix3DProjection applied to it.

Videos in ListBox restart when they come into view.

Videos embedded in a ListBox may restart when the user scrolls the video(s) into view .

ScrollIntoView doesn't work when using StackPanel as ItemsPanel in ListBox. It works when using VirtualizingStackPanel.

The Workaround is to call UpdateLayout before ScrollIntoView.

Analytics.AverageProcessLoad and Analytics.AverageProcessorLoad report 0 while video is playing

These properties may erroneously return 0 when video is playing. This bug was discovered when creating a new Analytics object every 500ms. If the instance of the Analytics object is re-used, the bug is not observed.

Analytics constructor returns E_FAIL sporadically

This bug was discovered when creating a new Analytics object every 500ms. If the instance of the Analytics object is re-used, the bug is not observed.

FindName returns null for custom DataObject when used as DataContext in XAML

For example:

 <Grid x:Name="LayoutRoot" >
      <Grid.DataContext>
          <local:Foo x:Name="myDataObject"/>
      </Grid.DataContext>
</Grid>

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();
        object o = this.myDataObject; // this is null unexpectdly
    }
}

The workaround is to set up the DataObject as a named resource and use a reference to it as the DataContext,

New animation API for Silverlight (Easing Functions)

Easing functions allow you to apply custom mathematical formulas to your animations. For example, you may want an object to realistically bounce or behave as though it were on a spring. You could use Key-Frame or even From/To/By animations to approximate these effects but it would take a significant amount of work and the animation would be less accurate than using a mathematical formula.

Currently, there are 11 new easing functions that you can apply to your animations. You can apply these using Blend 3 beta or you can use XAML or procedural code.

To show you the code way of working with these new functions, here's a relatively crude sample that introduces each of the new easing functions and allows you to change their properties: Easing Function Sample.

Also, I added a section on easing functions in the Animation Overview with some code examples and further explanation.

Silverlight Video Player with Source Code

Here's a link to a silverlight video player with all the basic features like progress/seek slider, full screen toggle, play/pause/resume, etc. The player is meant to be relatively simple while still sporting the basic features you'd expect in a video player. Thanks to Nick Kramer (project manager at Microsoft) for creating this player.

A few notes:
- This code is targeted at Silverlight 3 Beta. For example, it uses CacheMode property to improve performance of stretching video.
- All the code is in MainPage.xaml & MainPage.xaml.cs, the other files are pure VS defaults
- Tim Heuer started 2 versions of the SL2VideoPlayer on CodePlex (http://sl2videoplayer.codeplex.com) -- one is *very* full featured (captions, markers, etc.) -- while there also is a fork called 'min' which does exactly what this one does here.
- Known limitations -- no adaptive streaming, not common to all sites.  Minimal keyboard support (you can actually tab around but there's no focus rects), minimal accessibility support.

Silverlight Installation Experience whitepaper and sample code released

The Silverlight project templates in Visual Studio and other tools (such as Expression Blend) provide a default experience for users who do not have Silverlight installed. However, the current default experience is not very enticing:

Unless you modify the default experience, this image appears in place of your application for all users who do not have Silverlight installed. Unfortunately, many users will simply ignore this bare-bones request to install Silverlight, since it looks like an ad, and tells them nothing about what they will get if they install.

In almost all cases, you should provide a customized experience for users who need to install or upgrade. For example, you could indicate that installing Silverlight is quick and easy, and you could provide a screenshot of your application so that users can see what they will get.

However, there are some complexities involved if you want to create an experience that is as smooth as possible for all potential users. Specifically, there are several states that you should detect using JavaScript in order to respond appropriately. For example, you should indicate that users who are upgrading will need to restart their browsers, while users who are installing will need to refresh the page. Additionally, you should provide a different message for users on unsupported platforms and browsers.

Fortunately, the Silverlight product team has been thinking about ways to make this customization as easy as possible, and they have released their current guidance in the Silverlight Installation Experience White Paper and Sample Code.

The sample code includes HTML templates that you can modify in order to create a custom install experience with very little effort. These templates provide a preview of the default install experience that will be available in future releases of the Silverlight project templates for tools such as Visual Studio.

The HTML templates are lightweight and easy to localize, and are fully compatible with the existing Silverlight.js support file. Additionally, they provide JavaScript code that detects the browser size and modifies the experience in order to fit multiple form factors. The generic Web application template provides the following experience for full-size browser windows:

Of course, the whitepaper also provides complete guidance on customizing every aspect of the installation and upgrade experience. This is the preferred approach in order to create a fully-branded experience that transitions users seamlessly from the Silverlight installation to your running application.

Peeps love Silverlight too!

Okay—this entry is strictly for laughs so I apologize to anyone expecting some code examples or useful tips or tricks. Yesterday, my coworker Margaret and I took 2nd place in a little Peeps art contest held here at work. I thought you might enjoy pictures of our 2nd place entry, “Peeps Developers Conference”.

This first picture shows the crowd watching the keynote and a second shot of Scott Peepsrie giving his keynote talk.

And finally, a couple shots of the crowd…

Now back to our regular programming (pun intended).

--Cheryl

Search problems with the Silverlight 3 beta documentation

If you have used the Silverlight 3 beta documentation on MSDN, you might have noticed that none of the new topics or APIs appear in search results, regardless of whether you are searching with MSDN or another search engine. This is intentional - none of the Silverlight 3 beta documentation has been indexed for search, and it will not be indexed until the official Silverlight 3 RTW release. Therefore, the only way to get to the beta documentation on MSDN is to navigate to it in the table of contents.

The reason we are doing this is because we want to avoid confusing users who are developing for Silverlight 2 only. We do not currently indicate which Silverlight version is supported by each API for the simple reason that each new version effectively replaces the previous version. If you are in a Silverlight 3 beta topic, we assume that you got there intentionally and that you won't mistake it for a Silverlight 2 topic (although there is also some boilerplate at the top of each beta topic indicating that it is pre-release).

Unfortunately, the lack of Silverlight 3 documentation in search results can create the impression that the documentation does not exist, or that there is a bug preventing the expected behavior. Of course, much of the Silverlight 3 documentation is still under development, but you should be able to find many conceptual topics, and at least brief summaries for almost all of the reference topics.

If you are a heavy search user, I recommend that you download the CHM of the beta documentation instead of using MSDN. The CHM search works as expected. For more information on the CHM, see the following blog post: http://blogs.msdn.com/silverlight_sdk/archive/2009/03/18/silverlight-3-beta-offline-msdn-docs-chm-is-available.aspx

For information on the topics we have released with the Silverlight 3 beta, see the following blog post: http://blogs.msdn.com/silverlight_sdk/archive/2009/03/18/silverlight-3-beta-released.aspx. We are also planning to release preview versions of additional topics on this blog, so you won't have to wait for the RTW release for some of the remaining documentation. Of course, there are many other blogs that cover new SL3 features, so a general Web search should also help you if you want to explore some of the features that we haven't covered yet.

Drop shadow and blur effects in Silverlight 3 Beta

You can add drop shadows or blur effects to your objects very easily in Silverlight 3 Beta. Check out DropShadowEffect and BlurEffect. In these API reference there is code showing how to create the effects using XAML or proceedural code as well as a simple animation sample for each. I particularly like the dropshadow effect in that it's easy to control the direction, depth, and shade of the shadow cast. 

Silverlight Toolkit themes make it easy to create apps with a designer look

I’ve gotten some feedback from customers that they have pressure from their management to create Silverlight apps that look very visually appealing, but these customers, who are primarily developers, lack the tools, design skills or time to put together these kinds of applications. Let me recommend the themes that ship as part of the Silverlight Toolkit as a solution to this problem. I am really impressed with how great these themes look and most importantly, how easy they are to use.

The first step is to install the latest version of the Toolkit from here.

There are Silverlight 3 Beta and Silverlight 2 versions of the toolkit, so make sure you grab the right one. The examples I show were created with the Silverlight 3 Beta.

Once you’ve got the Toolkit installed, create a new Silverlight project with Visual Studio. Then drag a theme from the Toolbox to the XAML editing surface and VS takes care of the assembly references and xml namespace for you. The themes are all in their own assemblies to minimize the download cost to the user. In addition to the assembly for the theme you are using, you’ll get the System.Windows.Controls.Theming.Toolkit assembly, which contains the ImplicitStyleManager (ISM). ISM provides behavior similar to the built-in theming behavior available in WPF.

Here’s some images of what VS takes care of for you:

A theme inherits from ContentControl and so therefore can contain one child. Because of this, you’ll probably add a container control inside the theme tags and any additional controls you need inside of this container. The theme is then applied to all of its contents. It took me all of 5 minutes to put together something that looked like this, and I spent 4 minutes moving around the controls and changing their content.

Here’s the XAML for the example above:

Also, because of the way Silverlight applies property values, you can easily override some of the property settings locally if you don’t like the way things look. For example, I think the TextBlock’s text color is too light in the BubbleCreme theme so I explicitly set the foreground value in XAML.

Here’s how my TextBlock looks now:

Additionally, you can fully customize a theme using Visual Studio and/or Expression Blend. I am not going to get in to detail on this but Mehdi has a series of blog posts that walk you through customizing themes.

I hope you have as much fun playing around with the themes as I did. Oh, and I hope your boss loves your new professional-looking Silverlight apps.

--Cheryl

The Silverlight Documentation Sample Browser

The Silverlight 2 documentation includes many live samples. However, you can access these samples only from a topic with a "run this sample" link. The best way to find the samples in the Silverlight 2 documentation is to do a search on "run this sample".

 

For the Silverlight 3 beta release, we have improved this situation by providing a documentation sample browser. In the SL3 beta documentation, each "run this sample" link opens the sample browser to the appropriate sample and highlights the current sample in a navigation pane. You can then browse to related samples or explore samples in other categories.

 

Each sample includes one or more links back to the documentation that references the sample. This enables you read the context in which the sample is used. In most cases, you can also read the relevant snippets of the sample source code.  In some cases, you can also download a full Visual Studio project.

 



 

Please note that this is a beta release for both the documentation and the sample browser. We are planning several improvements in the coming months, but for now, you will encounter some rough edges. In particular, the sample browser currently supports Internet Explorer only, although we plan to make it work for all supported browsers by the SL3 RTW release. Additionally, the sample browser will sometimes stop working correctly, but you can get it working again by clicking in the address bar and pressing ENTER.

 

Comparison to the Silverlight Toolkit Sample Browser

 

Some of you may be familiar with the Silverlight Toolkit sample browser, which provides several additional features that we will consider for the documentation sample browser.

 



 

The documentation sample browser has some special requirements that prevent us from simply leveraging the sample browser code available in the Toolkit source code. In particular, each sample in the Silverlight documentation is a separate application, so the documentation sample browser uses a multi-frame approach rather than the integrated approach used by the Toolkit sample browser. This prevents us from providing a built-in full-screen option (although you can use the browser full-screen mode instead). It also prevents us from providing an out-of-browser experience.

 

Perhaps most interestingly, the Toolkit sample browser provides an integrated source-code viewer. This is something that we are definitely interested in for the documentation sample browser, but it is low-priority, since the relevant source code for most samples is available in the documentation. In the documentation sample browser, just click a link under Related Documentation, and the relevant topic will open in a new window.

 

The multi-frame approach used by the documentation sample browser introduces some interesting challenges that require creative solutions. Each frame in the documentation sample browser hosts a separate Silverlight application: one for the navigation pane, one for the sample header, and one for the sample itself. These separate applications communicate with one another through the HTML DOM Bridge and through the Silverlight 3 local messaging feature. As you can perhaps imagine, there are some complexities around load ordering and synchronization. Some of you will be interested in learning about these solutions, so we are planning to release the full source code of the documentation sample browser by the SL3 RTW release.

 

If you have opinions about various potential features of the documentation sample browser, please send us your feedback. Your comments will help us prioritize our future work so that we can make the sample browser as useful as possible.

 

Enjoy the samples!

 

 

The Silverlight Advertising Creation Kit

The Silverlight product team has just release some additional material for advertisers: the Silverlight Advertising Creation Kit. This download includes a whitepaper and samples that describe and demonstrate several aspects of creating ads using Silverlight 2, including:

• Creating Polite Ads
• Tracking Actions
• Ad synchronization
• clickTAG Support
• Expanding Ads
• Optimization Techniques

This material is targeted toward designers, and provides step-by-step instructions so that no previous knowledge of Visual Studio, Expression Blend, or Silverlight is required. It supplements the previously-released Silverlight Ad Publishing and Serving Guide.

You might also be interested in the following session videos from the recent Mix '09 conference:

• Silverlight and Advertising
• Delivering Ads to a Silverlight Media Player Application

Silverlight 3D Overview

Applying simple 3D effects (a.k.a. perspective transforms) to objects in your Silverlight 3 Beta application is easy. Currently there are no meshes to define, no camera, none of that "3D engine" stuff-- just 12 properties of the PlaneProjection that you define. Granted, without a real 3D engine you probably won't be creating the next WOW in Silverlight anytime soon but you can still create some cool effects without a ton of effort.

Check out the new beta MSDN Silverlight 3D Effects Overview to get started. Yes, there are images, code, and running samples in the overview which is obviously a must when trying to explain 3D.

- Sam