Silverlight 5 whats new overview

What’s New In Silverlight 5Jeff Brand

Developer and Platform [email protected] | slickthought.net | @jabrand

What’s New in Silverlight 5

Agenda

MVVM Databinding Enhancements

Binding In Style SettersImplicitDataTemplatesRelativeSource Ancestor BindingsCustom Markup ExtensionsDatabinding DebuggingDataContextChanged EventUpdateSourceTrigger

WCF RIA Services Enhancements

Text, Printing & MediaUnrestricted File AccessTrusted Apps In-BrowserGroup PolicyP/InvokeHTML supportMultiple Windows64-bit

Focused on your top asks:User Voice:

DataBinding Enhancements

Enabling MVVM, but also just more productive

Services Models

Person VehicleCalenda

rPeople Vehicles Tax

Orders ShippingSchedul

es

Layers Of Our Applications

UI (XAML)

Code Behind (XAML.cs/vb)

Data

Presentation logic

Not reusable

EF POCO XML

WCF

SQL Server

OracleTelco

Switches

Web Service

s

Media Streams

Web Service

s

UI (XAML)

OrdersCode Behind

(XAML.cs/vb)

UI (XAML)

PeopleCode Behind

(XAML.cs/vb)

How to test?How to reuse?How can the designer update the UIHow to provide different views

Laptop/DesktopTablet/Slate w/TouchPhone

REST JSON RIA

Appointments

Laptop/DesktopAppointmentsCode Behind

(XAML.cs/vb)

Services Models

Person VehicleCalenda

rPeople Vehicles Tax

Orders ShippingSchedul

es

MVVM

Class Libraries

Data

EF POCO XML

WCF

SQL Server

OracleTelco

Switches

Web Service

s

Media Streams

Web Service

s

REST JSON RIA

Test API w/VSTTLeverage logic across UIsDesigner parties on XAMLSkin across varied form factors

Laptop/DesktopTablet/Slate w/TouchPhone

Aggregation of data & services for your presentation logic

Tablet/SlateAppointmentsCode Behind

(XAML.cs/vb)

PhoneAppointmentsCode Behind

(XAML.cs/vb)

Test Framework

Visual Studio

Team Test

ViewModel (VM.cs/vb

Benefits of MVVM

Separation of concerns

Data binding (XAML)

Unit testing

Designer and developer symbiosis

Consistent, Maintainable, Scalable

MVVM Enhancements

Reduce the need for UI codeHow to reduce code?Enhance DataBinding

Silverlight 5 Binding In Style SettersImplicitDataTemplatesRelativeSource Ancestor BindingsCustom Markup ExtensionsDatabinding DebuggingDataContextChanged EventUpdateSourceTriggerWCF RIA Services EnhancementsText, Printing & Media

MVVM Enhancements

Binding In Style SettersImplicitDataTemplatesRelativeSource Ancestor BindingsCustom Markup ExtensionsDatabinding DebuggingDataContextChanged EventUpdateSourceTriggerWCF RIA Services EnhancementsText, Printing & Media

Binding Style Setters

How do I change styles without shipping new XAML?Can I set the styles in the database?

demo

Binding Style Setters How It Works

Create a Class to expose your values

Instance the Class in your Resources

Bind the value to the instanced resource<Style TargetType="TextBlock"> <Setter Property="Foreground" Value="{Binding ForegroundColor}, Source={StaticResource MyAppStyles}”

namespace MyProject.Styles { public class MyAppStyles : INotifyPropertyChanged { public Brush ForegroundColor {

get { return _foregroundColor; }

set { _foregroundColor = value; NotifyPropertyChanged("ForegroundColor");

<ResourceDictionary xmlns:stylesNS="clr-namespace:MyProject.Styles">

<stylesNS:MyAppStyles x:Key=“MyAppStyles"/>

MVVM Enhancements

Binding In Style SettersImplicit DataTemplatesRelativeSource Ancestor BindingsDatabinding DebuggingCustom Markup ExtensionsDataContextChanged EventUpdateSourceTriggerWCF RIA Services EnhancementsText, Printing & Media

Implicit Data Templates

Template Based On TypeHeterogeneous Collections

With Inheritance Hierarchy

demo

<Application.Resources><ResourceDictionary>

<DataTemplate x:Key=“StatesDataTemplate"><Grid>

<StackPanel Orientation="Horizontal"><TextBlock Text="{Binding StateCode}"/><TextBlock Text="{Binding StateName}"/>

</StackPanel></Grid>

</DataTemplate></ResourceDictionary>

</Application.Resources>

<Application.Resources> <ResourceDictionary> <DataTemplatex:Key="vehiclesDataTemplate">

DataType="models:Vehicle"> <Image Source="Vehicle.png"/> </DataTemplate> </ResourceDictionary></Application.Resources>


<DataTemplate x:Key="stateDataTemplate">DataType=“models:State">

<Grid><StackPanel Orientation="Horizontal">

<TextBlock Text="{Binding StateCode}"/><TextBlock Text="{Binding StateName}"/>

</StackPanel></Grid>




<DataTemplate DataType="models:Vehicle">

<Image Source="Vehicle.png"/></DataTemplate>

<DataTemplate DataType="models:Car"><Image Source="Car.png"/>

</DataTemplate>

<DataTemplate DataType="models:Truck"><Image Source="Truck.png"/>

</DataTemplate>

<DataTemplate DataType="models:Motorcycle"><Image Source="Motorcycle.png"/>



MVVM Enhancements


Relative Source Ancestor BindingHow do I bind to data up the visual tree?

<ListBox ItemsSource="{Binding Path=Appointments}"> <ListBox.ItemTemplate><DataTemplate><Grid ...

<TextBlock Text="{Binding Time}" …

<ComboBox ItemsSource="{Binding DataContext.Status, RelativeSource={RelativeSource FindAncestor AncestorType=UserControl,

Mode=FindAncestor}}"

namespace SLInsurance.ViewModels { public class AppointmentsViewModel { public ObservableCollection<Appointments> Appointments{ get; set; }

public ObservableCollection<Status> Status{get; set; }

namespace SLInsurance.Views { public partial class AppointmentView : UserControl {...

this.DataContext = new ViewModels.AppointmentViewModel();

Relative Source Ancestor Binding

Used For Control Hierarchy Binding As Well

<DataTemplate x:Key="StateComboBoxDataTemplate"> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding StateCode}" Margin="0,0,5,0"/> <TextBlock Text="{Binding StateName}" Visibility="{Binding IsDropDownOpen, RelativeSource={RelativeSource FindAncestor

AncestorType=ComboBox}, Converter={StaticResource BoolToVisibilityConverter} }"/></StackPanel>

demo

MVVM Enhancements


DataBinding Debugging

demo

DataBinding Debugging

Bound Instance & Type

Values of the Final Source

Pipeline• Initial• AfterValue• AfterStringFormat• AfterTypeConversion• …

XAML BreakpointsBreak when objects are bound,

such as Grid Cycling

Locals:Dig into what’s working, what’s

notFull Debugging Support

((System.Windows.Data.Debugging.BindingDebugState)BindingState).Error != null

MVVM Enhancements


Custom Markup Extensions

demo

public partial class Appointments : UserControl {

private void OnAppointmentsListbox_SelectionChanged(object sender, SelectionChangedEventArgs e){this.DataService.GetClaimById(GetClaimsCallback,

((AdjusterAppointment) (this.appointmentsListbox.SelectedItem)).Claim_Id); }

private void GetClaimsCallback(ObservableCollection<Claim> claims) {this.AppoinmentsListBox.Items.Add(claims[0]);

<ListBox x:Name="appointmentsListbox"ItemsSource="{Binding Appointments}"

SelectionChanged="OnAppointmentsListbox_SelectionChanged">UI (XAML)


ViewModel (VM.cs/vb

Services Models

Custom Markup Extensions

How do I get my event handler code out of my Code Behind

Data

public void GetClaimById(Action<ObservableCollection<Claim>> callback, string claim_Id) {var query = DataContext.GetClaimByIdQuery(claim_Id);_getClaimCallback = callback;_claimLoadOperation = DataContext.Load<Claim>(query);…

Custom Markup ExtensionHow It Works

public class MethodInvokeExtension : IMarkupExtension<object> {// Properties Exposed in XAML as Intellisense Lovepublic String Method { get; set; }

// Invoked by the XAML Parser @ runtimepublic object ProvideValue(IServiceProvider serviceProvider) {

<UserControl x:Class=“AppointmentsView" xmlns:MyUtils="clr-namespace:SLInsurance;assembly=SLInsurance">

...<StackPanel x:Name="LayoutRoot">

<ComboBox Name=“appointmentsListBox" SelectionChanged="{MyUtils:MethodInvoke Method=OnAppointmentChanged}"

MVVM Enhancements


DataContextChanged Event

It just worksIncrease Memory Efficiency “handle references”

this.DataContextChanged += View_DataContextChanged;…void View_DataContextChanged(object sender, DependencyPropertyChangedEventArgs e) { INotifyPropertyChanged customer; customer = e.OldValue as INotifyPropertyChanged; if (customer != null) customer.PropertyChanged -= customer_PropertyChanged;

customer = e.NewValue as INotifyPropertyChanged; if (customer != null) customer.PropertyChanged += customer_PropertyChanged;}

MVVM Enhancements


UpdateSourceTriggerHow can I get key stroke changes?

private void vinTextBox_TextChanged(object sender, TextChangedEventArgs e) { Helpers.VinCarInfo carInfo = Helpers.VINParser.Parse(vinTextBox.Text); this.vehicleYearsAutoComplete.Text = carInfo.Year.Value.ToString(); this.vehicleMakeAutoComplete.Text = carInfo.Make; this.vehicleModelComboBox.SelectedValue = carInfo.Model;

<TextBox Name="vinTextBox"Text="{Binding SelectedClaim.InsuredVIN, Mode=TwoWay}"

TextChanged="vinTextBox_TextChanged" UI (XAML)


ViewModel (VM.cs/vb

Services Models

Data

public void GetVehicleMakes(Action<ObservableCollection<string>> callback, int year) { _getVehicleMakesCallback = callback; this.SearchServiceClient.GetVehicleMakesCompleted += OnGetVehicleMakesCompleted; this.SearchServiceClient.GetVehicleMakesAsync(year); }

public void LoadVehicleYears() {this.DataService.GetVehicleYears(GetVehicleYearsCallback);

}public void LoadVehicleMakes(Nullable<int> year) {

if (year.HasValue) {this.DataService.GetVehicleMakes(GetVehicleMakessCallback, year.Value);

…

public void LoadVehicleModels(Nullable<int> year, string make) {if (year.HasValue) {

this.DataService.GetVehicleModels(GetVehicleModelssCallback, year.Value, make);

UpdateSourceTrigger

Moving code from the UI to the testable ViewModel

<TextBox Name="vinTextBox"Text="{Binding SelectedClaim.InsuredVIN, Mode=TwoWay}"UpdateSourceTrigger=PropertyChanged}"

UI (XAML)


ViewModel (VM.cs/vb

Services Models

Data

void OnClaimPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e) {switch (e.PropertyName) {

case "InsuredVIN":ParseVIN();break;

…

private void ParseVIN() {Helpers.VinCarInfo carInfo = Helpers.VINParser.Parse(this.SelectedClaim.InsuredVIN);

this.SelectedClaim.InsuredYear = carInfo.Year;this.SelectedClaim.InsuredMake = carInfo.Make;this.SelectedClaim.InsuredModel = carInfo.Model;

…

UpdateSourceTrigger

demo

MVVM Enhancements


WCF RIA Services for Silverlight 5

Complex Types (SP1)

Custom ClientCode

Gen(SP1)

DateTimeOffset

MVVM Support

EF Code First

(coming soon)

But Wait, There’s More

TextPrintingMedia


Text Enhancements

Linked Text ContainersFlow Rich Text from one container to anotherDynamically flows on resize

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus enim dolor, molestie at auctor id, auctor ultrices nisi. Curabitur urna lorem, luctus hendrerit dapibus quis, facilisis sed orci. Aliquam nunc massa, placerat id pretium eget, luctus sit amet diam. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque fermentum neque at nisl bibendum cursus. Aliquam sollicitudin elit eu nunc placerat et pulvinar mauris condimentum. Donec sed sapien elit, vel condimentum justo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut ut odio nunc. Maecenas vitae quam urna. Nulla a ante imperdiet sem tincidunt porta. Donec est tellus, imperdiet eget ullamcorper eu, laoreet vel lorem. Fusce ornare nislmollis lacus cursus semper suscipit urna ultricies. Phasellus magna justo, commodo sodales auctor nec, euismod vitae purus.

Vivamus dignissim feugiat tristique. Cras aliquet sapien non justo sagittis imperdiet. In a velit mauris, eu sodales magna. Fusce lectus lectus, blandit non semper vitae, cursus ut purus. Vestibulum quis aliquam augue. Morbi id est sed diam imperdiet pretium vitae a turpis. Sed vel sapien arcu. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ac diam ut ante imperdiet lacinia. Integer sit amet justo sit amet tortorfacilisis id sit amet augue. Etiam in risus vel erat molestie viverra. Suspendisse pellentesque bibendum sagittis. Etiam convallis leo at dui ornare eget elementum odio dictum. Integer tempus ultricies lectus. Maecenas dictum ipsum id nisl adipiscing eu iaculis tortor suscipit. Etiam sed sapien neque, in ultricies magna. Aliquam in nisl et lectus bibendum vestibulum. Donec suscipit, velit vitae convallis accumsan, tortor magna dignissim purus, sed convallis orci tortor sed sem. Cras quis est id turpis congue porta. Proin pharetra mattis nulla quis vestibulum.

Ut in sapien id mauris egestas rhoncus a eget erat. Vivamus tempor tempus quam facilisis dapibus. Curabitur volutpat ipsum vitae tortor tincidunt sed malesuada urna tincidunt. Quisque porttitor, neque id malesuada faucibus, quam leo auctor nisl, quis aliquet enim ligula ut odio. Etiam vel turpis magna. Cras iaculis est sem. Pellentesque malesuada, libero eu tempor tempor, tellus ipsum dignissim sapien, id facilisis augue ipsum vitae quam. Cras quis imperdiet leo. In orci purus, placerat ac ultricies in, elementum vitae turpis. Nunc lectus sapien, sagittis id luctus ut, hendrerit ut massa. Sed purus sapien, pharetra id faucibus nec, semper id lacus. Phasellus et lectus leo, eget

adipiscing lorem. Donec fermentum lacus dolor. Etiam laoreet tristique nisi, sit amet convallis nunc lacinia et. Integer aliquam, magna ac porttitor congue, est libero consectetur lacus, lobortis porta orci risus nec magna. Integer sapien purus, volutpat sit amet vehicula vitae, accumsan a felis. Sed a nulla vel enim laoreet consequat. Nulla ut neque massa, at semper enim.risus nec magna. Integer sapien purus, volutpat sit amet vehicula vitae, accumsan a felis. Sed a nulla vel enim laoreet consequat. Nulla ut neque massa, at semper enim.

<RichTextBox OverflowContentTarget="{Binding ElementName=overflow1}"><RichTextBoxOverflow x:Name="overflow1" OverflowContentTarget="{Binding ElementName=overflow2}"><RichTextBoxOverflow x:Name="overflow2" OverflowContentTarget="{Binding ElementName=overflow3}">...

Text Clarity

Sharpens text by snapping with pixelsGreat for low res devices

Vector

Bitmap

Shapes

Text

0 100 200 300 400 500 600 700 800

Spool Time

BitmapVector

(milliseconds)

Vector Printing

Shapes

Text

0 20 40 60 80 100 120 140

File Size Sent to Printer

BitmapVector

(MB)

Trick PlayWhere did they joke about…

Speed through videos, search for soundsNew dimension to searchNo “Alvin & The Chipmunks”

Unrestricted File AccessSL5 trusted

apps can access:

SL4 trusted apps

can access:

Unrestricted File Access

demo

Agenda

Unrestricted File AccessTrusted Apps In-BrowserGroup PolicyP/InvokeHTML supportMultiple Windows64-bitPivotViewer

Trusted Apps

SL4: OOB apps run trusted with user consentSL5: in-browser trusted apps with admin consent

Set permissions via group policyNo prompts or installsFamiliar navigation modelCan be part of a larger HTML site

Trusted Apps

SandboxedApp

Trusted SL4 App

TrustedSL5 App

Prompt-free No Yes Yes

Cross domain networking No Yes Yes

Full keyboard in full screen mode

No Yes Yes

COM No Yes Yes

Unrestricted file access

No Kinda Yes

P/Invoke No No Yes

Run in-browser No No Yes

Creating a Trusted App

Just like SL4 trusted OOB

<OutOfBrowserSettings> <OutOfBrowserSettings.SecuritySettings> <SecuritySettings ElevatedPermissions="Required" /> </OutOfBrowserSettings.SecuritySettings></OutOfBrowserSettings>

Creating a Trusted App

Sign the .xapSame as for a trusted OOBIn Visual Studio or on command line

signtool.exe sign /v /f nameOfCert.pfx /p "<password>" nameOfApp.xap

or

Agenda


Permissions in Group Policy

Actually, only one permission – trusted or notNetwork admin specifies which publishers are trusted

Publishers identified by Authenticode certificatePut certificate in client machine’s trusted publisher storeSame as ClickOnce

Xaps are associated with publishers by Authenticode

Agenda


P/Invoke

P/Invoke lets you call native codeCOM (SL4) also lets you call native code

Anything you can do with COM can also be done with P/Invoke

Strongly typedNo COM registration

P/Invoke is optimized for Win32 APIs & native C/C++ codeCOM is optimized for COM Automation APIs, eg Office

COM & P/Invoke are available on Windows to trusted apps

P/Invoke

Works exactly like it does in .NET Framework

[DllImport("kernel32.dll")]static extern int GetDriveType(string lpRootPathName);…int type = GetDriveType(drive);


Agenda

Unrestricted File AccessTrusted Apps In-BrowserGroup PolicyP/InvokeHTML supportMultiple Windows64-bitLots of 3D Stuff

Agenda

Multiple Windows

System.Windows.Window is now an instantiable class

Window w = new Window();w.Height = 400;w.Width = 600;w.Content = new MyUserControl();w.Visibility = Visibility.Visible;

Multiple Windows

demo


Agenda

64-bit Support

64-bit machines & apps are becoming increasingly commonSL5 can run in a 64-bit process

64-bit browsersSidebar on 64-bit Windows

Why 64-bit is interesting:Because you don’t get to choose the browserBecause you’re native hosting in a 64-bit processBecause you need a lot of address space

3D Target applications

Data visualization*3D charts and reportsScatter pointsGeographic overlaysScience & astronomy

Education & trainingMarketing & advertising

Business*ManufacturingIndustrial processesHome designRealty & virtual toursCustomer support

MedicalGames & simulation

* Enterprise focus for Silverlight 5

3D Demo

demo

Silverlight 5 Summary

Adding productivity & robustness withAdvanced styling and templatingDatabinding Enhancements & DebuggingBetter Text & Printing Improved trusted and native interop

Enabling Next Gen MediaSilverlight 5 ships second half 2011

Resources

Silverlight.netWCF RIA Services Page: http://silverlight.net/riaservices

http://silverlight.net/riaservices

http://silverlight.net/riaservices

© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION

IN THIS PRESENTATION.

Technology

Silverlight 5 whats new overview