1. Silverlight 2 for Developers Alex Golesh Silverlight Lead, Senior Consultant alexg@sela.co.il http://blogs.microsoft.co.il/blogs/alex_golesh/

2. Agenda Silver… what? Why Silverlight? Give Me the Details! How Silverlight? When Silverlight? Q&A Summary

3. What is Silverlight? Client Side RIA Application Browser Plug-In Cross-platform, cross-browser, cross-device

4. What is Silverlight? Browser Plug-In: Silverlight Runtime.NET programming model Vector UI: Text, Graphics, Animation Doesn’t requires.NET on client machine.NET development platform ASP.NET Integration

5. BrowserBrowserDevices,MobileDevices,Mobile DesktopDesktop Server, Services Why Silverlight? Rich Experiences

6. Why Silverlight? Enables a rich.NET development platform that runs in the browser Developers can write Silverlight applications using any.NET language (including VB, C#, JavaScript, IronPython and IronRuby).

7. BrowserBrowserDevices,MobileDevices,Mobile DesktopDesktopServer & Services Server Silverlight is a.NET technology.NET.NET Silverlight extends your.NET Reach.

8. Why Silverlight? New application model Compressed package format (.XAP) Cross domain package loading Splash screen Supports application localization Accessibility Managed programming model C#, Visual Basic or other DLR Most platforms and Browser

9. Silverlight.NET Subset.NET for Silverlight is a factored subset of full.NET. NET 3.5 ~200 MB (Windows only) Desktop ~50 MB (Windows only) Silverlight ~4 MB (cross platform) Additional libraries available as extensions Same APIs, tools and skills Highly compatible Moving from Silverlight to desktop.NET with minimal changes Source, but not binary compatible

10. Silverlight Architecture XAMLXAML Browser Host Integrated Networking Stack DOM Integration Installer JavaScript Engine Presentation Core.NET for Silverlight Inputs Keyboard Mouse Ink Media WMV / VC1 WMA MP3 Controls Layout Editing UI Core 2D Vectors Animation Text Images Transforms DRM Media Dynamic Languages RubyPython BCL Generics Collections Web Services REST RSS SOAP POX JSON Data LINQLINQ-to-XML WPF for Silverlight Extensible Controls Common Language Runtime ASP.NET AJAX Libs Server Silverlight 1 Silverlight 2 Legend

11. Media and User Interface

12. Presentation Core – Graphics 2D Graphics Vector based Standard shapes and Paths Masking and clipping Transformations: skew, rotate, scale, translate, matrix Animation Basics Time-based Support linear, discrete and spline animation Animatable property types: Double, Color, Point Animations and graphics can be defined using XAML or code

13. Presentation Core - Video Quality High Definition video VC-1 codec Interactivity Video is a first class citizen Media Markers Video brush Cost of ownership Windows Media Server Adaptive streaming Byte range seeking Windows Live Streaming Throttling (with IIS7) Formats Video: VC-1, WMV v7,v8,v9 Audio: WMA V7, V8, V9, MP3, WMA 10 Pro Content protection PlayReady DRM for online viewing

14. Declarative Programming Through XAML Extensive Application Markup Language Toolable, declarative markup Code and content are separate Compatible with Windows Presentation Foundation OK LightBlue XAML Button b1 = new Button(); b1.Content = "OK"; b1.Background = new SolidColorBrush(Colors.LightBlue); b1.Width = 100; C# Dim b1 As New Button b1.Content = "OK" b1.Background = New _ SolidColorBrush(Colors.LightBlue) b1.Width = 100 VB.NET

15. Demo XAML, Code Behind

16. Controls Core controls in box Button, ListBox, CheckBox, RadioButton, Hyperlink, Slider, ScrollBar, ScrollViewer, ProgressBar, TextInput, etc. Core layout containers in box Grid, Stack panel, Canvas, etc. Other controls shipped as extensions DataGrid, Menus, ToolBar, etc. Controls ship with source

17. Demo Controls, Toolkit

18. Styling and Templating support Controls supports styling Controls supports templating

19. Data Templates DataTemplate <Border BorderBrush="Blue" BorderThickness="2" Background="LightGray" Margin="10" Padding="15,15,15,5"> <Border HorizontalAlignment="Center" BorderBrush="Navy" Background="#DDF“ BorderThickness="1" Margin="10" Padding="3"> class Car { string Image {get;set} string Model {get;set] }

20. Databinding Two way data binding from User interface to business objects Notification via INotifyPropertyChanged DataContext is inherited via Visual Tree From XAML From code Binding binding = new Binding("Nasdaq.Points"); binding.Mode = BindingMode.OneWay; TextBlock tb = new TextBlock(); tb.SetBinding(TextBlock.TextProperty, binding);

21. Demo Styling, DataBinding

22. DeepZoom Navigates images of any size and resolution optimizing network bandwidth and download size. Seamless transitions as you zoom and pan.

23. Demo DeepZoom

24. Networking

25. Asynchronous HTTP requests GET/POST Access to most headers, cookies, Uses browser networking stack Caching, authentication, proxy, compression

26. Web Services SOAP 1.1 Basic profile A few restrictions (e.g. SOAP Faults not supported) Asynchronous invocation Follows cross-domain policy restrictions Generated proxies support data binding

27. Sockets TCP only Asynchronous API No explicit bind and no listen/accept support Restricted ports ( 4502-4534) void Connect(AddressFamily family) { SocketAsyncEventArgs connectArgs = new SocketAsyncEventArgs(); connectArgs.RemoteEndPoint = new DnsEndPoint( Application.Current.Host.Source.Host, 4502); connectArgs.Completed += new EventHandler (OnConnectCompleted); socket = new Socket(family, SocketType.Stream, ProtocolType.Tcp); if (!socket.ConnectAsync(connectArgs)) OnConnectCompleted(socket, connectArgs); }

28. Cross-domain support 2 formats: Flash policy file Silverlight policy file <!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross- domain-policy.dtd"> Cross-domain.xml clientaccesspolicy.xml "

29. Demo CarAds WebService, Flickr API REST

30. Extending the sandbox (safely)

31. OpenFileDialog Provides native OS experience Sandboxed API returns safe filename and readable stream Support for multiple files // Create file dialog OpenFileDialog ofd= new OpenFileDialog(); ofd.Filter = "Text Files (*.txt)|*.txt|All files (*.*)|*.*"; if (ofd.ShowDialog() == DialogResult.OK) {

32. Isolated Storage Stream based access to a private file/directory structure Patterned after.NET Framework IsolatedStorage classes Read and write string or binary data Store is per application XAP Application code to request size increase User prompt to accept quota increase Quotas fall into predetermined size slots Code must initiate increase size call from within user input/event

33. HTML and Silverlight Integration

34. HTML/AJAX and.NET integration webpage HTMLHTMLSilverlightSilverlight HTMLHTML HTML+SilverlightHTML+Silverlight

35. Working with HTML/Javascript HtmlObjectHtmlObject ScriptObjectScriptObject HtmlDocumentHtmlDocument HtmlWindowHtmlWindow HtmlElementHtmlElement

36. Access the HTML DOM from Managed Code HTML access available in new namespace HtmlPage.Navigate("http://www.microsoft.com"); String server = HtmlPage.DocumentUri.Host; HtmlPage.Navigate("http://www.microsoft.com"); String server = HtmlPage.DocumentUri.Host; using System.Windows.Browser; HtmlElement myButton = HtmlPage.Document.GetElementByID("myButtonID"); myButton.AttachEvent("onclick", new EventHandler(this.myButtonClicked)); private void myButtonClicked(object sender, EventArgs e) {... } HtmlElement myButton = HtmlPage.Document.GetElementByID("myButtonID"); myButton.AttachEvent("onclick", new EventHandler(this.myButtonClicked)); private void myButtonClicked(object sender, EventArgs e) {... } Static HtmlPage class provides entry point Hookup events, call methods, or access properties

37. Access Managed Code from JavaScript 1.- Mark a property, method or event as [Scriptable] HtmlPage.RegisterScriptableObject ("EntryPoint", this); [ScriptableMember] public void Search(string Name) {... } [ScriptableMember] public void Search(string Name) {... } var control = document.getElementById("SilverlightControl"); control.Content.EntryPoint.Search(input.value); var control = document.getElementById("SilverlightControl"); control.Content.EntryPoint.Search(input.value); 2.- Register a scriptable object 3.- Access the managed object from script

38. Demo HTML DOM

39. Tooling and.NET platform

40. Designer/Developer Collaboration

41. Platform, Services & Tools web desktop media & RIA web desktop Designer Look, behavior, brand, and emotional connection Developer Function, deployment, data, security, operational integrity Windows Live Services Windows Server 2008

43. DesktopDesktop Media & RIA Media Server, Services Tooling Designer Look, behavior, brand, and emotional connection Developer Function, deployment, data, security, operational integrity Server Vista XAML

44. Silverlight and ASP.NET/AJAX Integration Two ASP.NET server controls Both ship in SDK: System.Web.Silverlight.dll Deploys to /bin folder Available at design-time within Visual Studio Corresponding AJAX types Both server controls provide client-side Javascript types as well

45. Silverlight and WPF Silverlight is a subset of WPF Plus a few extra web features and its own codecs Reuse strategy Same skills Same tools Same XAML and UI Silverlight code should run on WPF with minor changes

46. When Silverlight? Silverlight v1.0 RTM Silverlight 2 RTW Future release: Silverlight for Mobile “Next Version” of Silverlight

47. Questions?

48. Summary More Information & Downloads Silverlight Homepage http://silverlight.net/ Silverlight Quick Starts http://silverlight.net/quickstarts/ Silverlight Showcase http://silverlight.net/Showcase/ My blog http://blogs.microsoft.co.il/blogs/alex_golesh/ Get in touch alexg@sela.co.il

49. THANK YOU!