DODN2009 - Jump Start Silverlight


Published on

Session for beginners that covers the basics of Microsoft Silverlight for developers.

Published in: Technology, Business
1 Comment
  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • Set context!!!! We will briefly discuss what is silverlight.. Why you should care and why we are excited about the benefitsSilverlight provided to <vertical> like you. We will focus a lot on the HOW !!! We will walk through features and hopefully give you a good overview of the technology and the platform inside Silverlight.
  • .NET for Silverlight is a factored subset of full .NETDesktop ~50 MB (Windows only)Silverlight + .NET Alpha ~ 4 MB (cross platform)How do we get it so small ?? Discuss a few of these as examples, don’t get too caught up on any On UI side: no Windows Forms, No 3D, No FlowLayout, etc. No workflow, no asp .net Web services server-side functionality… No ADO .NET ( but you get LINQ) Significant refactoring, e.g. File IO might not have all the overloads, but still way to get the job done.. Additional pieces of .NET available in a pay-for-play model…Same core development FrameworkThe shared apis & technologies are the same The tools are the sameHighly compatibleMinimal changes needed to move from Silverlight to DesktopHowever, not binary compatible by default
  • The usual suspectsCanvas, Panel, StackPanel, Grid Button, Calendar, Checkbox, Datagrid, DateTimePicker, GridSplitter, HyperLink, ListBox, Popup, Radio, Slider, Toggle, Tooltip,
  • DataTemplate is one of my favorite features.. Because it really showcases how Silverlight was built with data in mind from the ground up.. With a data template I can create a mapping between a specified CLR type or XML Xpath to some visuals…
  • Other interesting HTML integration scenarios:Persistent linksFwd/Back Integration
  • Simple type marshalling only in the AlphaComplex type support on the way
  • We saw how the platform is helping address this but a full solution requires role-specific tooling.
  • Web Client is used for downloading streams and strings We HttpWebRequest has more control over HTTP GET & POST headers ….The headers we don’t let you change are the same headers the browser does not let you override..
  • DODN2009 - Jump Start Silverlight

    1. 1. Clint Edmonson<br />Architect Evangelist<br />Microsoft<br />Email:<br />Web:<br />Twitter: @clinted<br />JumpStart: Silverlight<br />
    2. 2.
    3. 3. Agenda<br />What is Silverlight?<br />Anatomy of a Silverlight Application<br />XAML Primer<br />Control Libraries<br />Data Binding<br />Development Tools<br />Advanced Features<br />Designer + Developer Experience<br />
    4. 4. What is Silverlight?<br />
    5. 5. Silverlight Experience<br />Rich Internet Applications<br />Cross platform, <br /> cross-browser, <br /> cross device <br /> plug-in<br />Fast, seamless installation<br />Vector based layout and animation engine<br />Productive design & development environments<br />
    6. 6. Refactored subset of .NET & WPF<br />
    7. 7. Development Tools<br />
    8. 8. Development Tools<br />XamlPad<br />XamlPadX<br />Kaxaml<br />Silverlight Spy<br />Expression Blend<br />See my and Denny’s sessions later today for more!<br />Visual Studio 2008 + Silverlight SDK<br />
    9. 9. Anatomy of a Silverlight Application<br />
    10. 10. Silverlight works with any server<br />Only requirement is to serve up XAML, assemblies etc.<br />Leverage JavaScript to improve experience<br />ASP.NET AJAX adds further integration to the experience<br />&lt;asp:xaml&gt;<br />&lt;asp:media&gt;<br />More coming…<br />Silverlight Component<br />(XAML, .NET)<br />AJAX Control<br />(Script)<br />ASP.NET AJAX Server Control<br />Silverlight on the Server<br />
    11. 11. Silverlight Architecture<br />.NET for Silverlight<br />Server<br />Data<br />WPF for Silverlight<br />Inputs<br />Media<br />LINQ<br />LINQ-to-XML<br />Extensible Controls<br />Keyboard<br />WMV / VC1<br />Web Services<br />ASP.NET AJAX<br />Mouse<br />WMA<br />REST<br />RSS<br />SOAP<br />BCL<br />Dynamic Languages<br />POX<br />JSON<br />Ink<br />MP3<br />&lt;asp:xaml&gt;<br />Ruby<br />Python<br />Generics<br />Collections<br />&lt;asp:media&gt;<br />Silverlight Common Language Runtime<br />XAML<br />UI Core<br />Controls<br />DRM<br />2D Vectors<br />Images<br />Layout<br />Media<br />Animation<br />Transforms<br />Editing<br />Text<br />Presentation Core<br />Integrated Networking Stack<br />DOM Integration<br />JavaScript Engine<br />Installer<br />Browser Host<br />
    12. 12. XAML Primer<br />
    13. 13. XAML<br />C#<br />VB.NET<br />&lt;Button Width=&quot;100&quot;&gt; OK<br /> &lt;Button.Background&gt;<br />LightBlue<br /> &lt;/Button.Background&gt;<br />&lt;/Button&gt;<br />Button b1 = new Button();<br />b1.Content = &quot;OK&quot;;<br />b1.Background = new SolidColorBrush(Colors.LightBlue);<br />b1.Width = 100;<br />Dim b1 As New Button<br />b1.Content = &quot;OK&quot;<br />b1.Background = New _SolidColorBrush(Colors.LightBlue)<br />b1.Width = 100<br />Declarative Programming Through XAML<br />Extensible Application Markup Language<br /><ul><li>Toolable, declarative markup
    14. 14. Code and content are separate
    15. 15. Compatible with Windows Presentation Foundation</li></li></ul><li>Control Libraries<br />
    16. 16. Controls<br />60 Native Controls<br />Open Source Toolkit<br />Rich third party ecosystem for domain specific controls <br />Canvas, Grid, & StackPanel<br />will become your new best friends<br />
    17. 17. Data Binding<br />
    18. 18. Databinding <br />Two way data binding from User interface to business objects <br />Notification via INotifyPropertyChanged<br />DataContext is inherited via Visual Tree<br />From XAML <br /> &lt;TextBlockText=&quot;{Binding Nasdaq.Points, Mode=OneWay}&quot;/&gt;<br />From code <br />Binding binding = new Binding(&quot;Nasdaq.Points&quot;);<br />binding.Mode = BindingMode.OneWay;<br />TextBlocktb = new TextBlock();<br />tb.SetBinding(TextBlock.TextProperty, binding);<br />
    19. 19. Data Templates<br />DataTemplate<br />class Car<br />{<br /> string Image {get;set}<br /> string Model {get;set]<br />}<br />&lt;DataTemplate x:Key=&quot;carTemplate&quot;&gt;<br /> &lt;Border BorderBrush=&quot;Blue&quot; BorderThickness=&quot;2&quot; Background=&quot;LightGray&quot;<br /> Margin=&quot;10&quot; Padding=&quot;15,15,15,5&quot;&gt;<br /> &lt;StackPanel&gt;<br /> &lt;Image HorizontalAlignment=&quot;Center&quot; Source=&quot;{Binding Path=Image}&quot; /&gt;<br /> &lt;Border HorizontalAlignment=&quot;Center&quot; BorderBrush=&quot;Navy&quot;<br /> Background=&quot;#DDF“ BorderThickness=&quot;1&quot; Margin=&quot;10&quot; Padding=&quot;3&quot;&gt;<br /> &lt;TextBlockFontSize=&quot;18&quot; TextContent=&quot;{Binding Path=Model}&quot; /&gt;<br /> &lt;/Border&gt;<br /> &lt;/StackPanel&gt;<br /> &lt;/Border&gt;<br />&lt;/DataTemplate&gt;<br />
    20. 20. Advanced Features<br />
    21. 21. Flexible User Experience Options<br />Seamless installation & auto-update<br />Change download progress look & feel<br />Full screen mode<br />Out of Browser Experience<br />Start menu & desktop shortcuts<br />Internet connection detection<br />
    22. 22. Styling<br />Resource definition templates to define look & feel<br />
    23. 23. Templating <br />Replace the ‘parts’ that define the look of a control to create a completely different look, but behavior is the same. <br />
    24. 24. Isolated Storage<br />Stream based access to a private file/directory structure<br />Patterned after .NET Framework IsolatedStorage classes<br />Read and write string or binary data<br />Store is per application XAP<br />Application code to request size increase<br />User prompt to accept quota increase<br />Quotas fall into predetermined size slots<br />Code must initiate increase size call from within user input/event<br />
    25. 25. OpenFileDialog, SaveFileDialog<br />Provides native OS experience<br />Sandboxed API returns safe filename and readable stream<br />Support for multiple files<br />
    26. 26. HTML/AJAX and .NET integration<br />webpage<br />HTML<br />Silverlight<br />.NET<br />language<br />Javascript<br />webpage<br />HTML<br />HTML <br />+<br />Silverlight<br />
    27. 27. Access the HTML DOM from Managed Code<br />HTML access available in new namespace <br />usingSystem.Windows.Browser;<br />Static HtmlPage class provides entry point <br />HtmlPage.Navigate(&quot;;);<br />String server = HtmlPage.DocumentUri.Host;<br />Hookup events, call methods, or access properties<br />HtmlElementmyButton =<br />HtmlPage.Document.GetElementByID(&quot;myButtonID&quot;);<br />myButton.AttachEvent(&quot;onclick&quot;, new<br />EventHandler(this.myButtonClicked));<br />privatevoidmyButtonClicked(object sender, EventArgs e) <br />{ ... }<br />
    28. 28. Access Managed Code from JavaScript<br />1.- Mark a property, method or event as [Scriptable]<br />[ScriptableMember]<br />publicvoidSearch(stringName) { ... }<br />2.- Register a scriptable object<br />HtmlPage.RegisterScriptableObject (&quot;EntryPoint&quot;, this);<br />3.- Access the managed object from script<br />var control = document.getElementById(&quot;SilverlightControl&quot;);<br />control.Content.EntryPoint.Search(input.value);<br />
    29. 29. Streaming Media Experience<br />Cost effective, high quality video for all major browsers<br />Based on WMA and WMV ecosystem<br />Media processing tools provided for live and on-demand publishing<br />Supports HD video encoding<br />Scales gracefully to lower end hardware<br />Digital Rights Management support <br />
    30. 30. DeepZoom<br />Navigates images of any size and resolution optimizing network bandwidth and download size. <br />Seamless transitions as you zoom and pan.<br />
    31. 31. Easy Line of Business Apps<br />Cost effective, high quality video for all major browsers<br />Navigation Framework<br />RIA Data Services<br />
    32. 32. Designer + DeveloperExperience<br />
    33. 33. Designer/Developer Collaboration<br />=<br />
    34. 34. Tooling<br />Desktop<br />Server, Services<br />Server Win7<br />Media<br />& RIA<br />XAML<br />Designer<br />Look, behavior, brand,and emotional connection<br />Developer<br />Function, deployment, data,security, operational integrity<br />
    35. 35. Next Steps…<br />Community Site:<br />Main Product Site:<br />MSDN Center:<br />Online Forums:<br />Online SDK:<br />Top Silverlight Blogs<br />Tim Sneath:<br />Mike Harsh:<br />Joe Stegman:<br />Laurence Moroney:<br />Ernie Booth:<br />Follow @MSExpression on Twitter<br />
    36. 36. Clint Edmonson<br />Architect Evangelist<br />Microsoft<br />Email:<br />Web:<br />Twitter: @clinted<br />Thank you!<br />
    37. 37. Networking<br />
    38. 38. Networking <br />Asynchronous HTTP requests<br />GET/POST <br />Access to most headers, cookies, <br />Uses browser networking stack <br />Caching, authentication, proxy , compression <br />
    39. 39. Web Services<br />SOAP 1.1 <br />Basic profile<br />A few restrictions (e.g. SOAP Faults not supported)<br />Asynchronous invocation<br />Follows cross-domain policy restrictions<br />Generated proxies support data binding <br />
    40. 40. Sockets <br />TCP only <br />Asynchronous API <br />No explicit bind and no listen/accept support <br />Restricted ports (4502-4534) <br />Cross Domain based on provisioning server<br />void Connect(AddressFamily family)<br />{<br />SocketAsyncEventArgsconnectArgs = new SocketAsyncEventArgs();<br />connectArgs.RemoteEndPoint = new DnsEndPoint(<br />Application.Current.Host.Source.Host, 4502);<br />connectArgs.Completed += new <br />EventHandler&lt;SocketAsyncEventArgs&gt;(OnConnectCompleted);<br /> socket = new Socket(family, SocketType.Stream,<br />ProtocolType.Tcp);<br /> if (!socket.ConnectAsync(connectArgs))<br />OnConnectCompleted(socket, connectArgs);<br />}<br />
    41. 41. Cross-domain support <br />&lt;?xmlversion=&quot;1.0&quot;?&gt;<br />&lt;!DOCTYPEcross-domain-policy SYSTEM <br />&quot;;&gt;<br />&lt;cross-domain-policy&gt;<br /> &lt;allow-access-fromdomain=&quot;*&quot; /&gt;<br />&lt;/cross-domain-policy&gt;<br />2 formats: <br />Flash policy file<br />Silverlight policy file <br />Cross-domain.xml<br />&lt;?xmlversion=&quot;1.0&quot;?&gt;<br />&lt;access-policy&gt;<br /> &lt;cross-domain-access&gt;<br /> &lt;policy&gt;<br /> &lt;allow-from&gt;<br /> &lt;domainuri=&quot;”/&gt;&quot;<br /> &lt;domainuri=&quot;;/&gt;<br /> &lt;/allow-from&gt;<br /> &lt;grant-to&gt;<br /> &lt;grantpath=&quot;/sales/serialnumbers.xml&quot; /&gt;<br /> &lt;grantpath=&quot;/partners&quot;include-subpaths=&quot;false&quot;/&gt; <br /> &lt;/grant-to&gt;<br /> &lt;/policy&gt;<br /> &lt;/cross-domain-access&gt;<br />&lt;/access-policy&gt;<br />clientaccesspolicy.xml<br />