DODN2009 - Jump Start Silverlight

Clint Edmonson
Architect Evangelist
Microsoft
Email: clinted@microsoft.com
Web: http://www.notsotrivial.net
Twitter: @clinted
JumpStart: Silverlight

Agenda
What is Silverlight?
Anatomy of a Silverlight Application
XAML Primer
Control Libraries
Data Binding
Development Tools
Advanced Features
Designer + Developer Experience

What is Silverlight?

Silverlight Experience
Rich Internet Applications
Cross platform,
cross-browser,
cross device
plug-in
Fast, seamless installation
Vector based layout and animation engine
Productive design & development environments

Refactored subset of .NET & WPF

Development Tools

Development Tools
XamlPad
XamlPadX
Kaxaml
Silverlight Spy
Expression Blend
See my and Denny’s sessions later today for more!
Visual Studio 2008 + Silverlight SDK

Anatomy of a Silverlight Application

Silverlight works with any server
Only requirement is to serve up XAML, assemblies etc.
Leverage JavaScript to improve experience
ASP.NET AJAX adds further integration to the experience
<asp:xaml>
<asp:media>
More coming…
Silverlight Component
(XAML, .NET)
AJAX Control
(Script)
ASP.NET AJAX Server Control
Silverlight on the Server

Silverlight Architecture
.NET for Silverlight
Server
Data
WPF for Silverlight
Inputs
Media
LINQ
LINQ-to-XML
Extensible Controls
Keyboard
WMV / VC1
Web Services
ASP.NET AJAX
Mouse
WMA
REST
RSS
SOAP
BCL
Dynamic Languages
POX
JSON
Ink
MP3
<asp:xaml>
Ruby
Python
Generics
Collections
<asp:media>
Silverlight Common Language Runtime
XAML
UI Core
Controls
DRM
2D Vectors
Images
Layout
Media
Animation
Transforms
Editing
Text
Presentation Core
Integrated Networking Stack
DOM Integration
JavaScript Engine
Installer
Browser Host

XAML Primer

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

Control Libraries

Controls
60 Native Controls
Open Source Toolkit
Rich third party ecosystem for domain specific controls
Canvas, Grid, & StackPanel
will become your new best friends

Data Binding

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

Data Templates
DataTemplate
class Car
{
string Image {get;set}
string Model {get;set]
}
<DataTemplate x:Key="carTemplate">
<Border BorderBrush="Blue" BorderThickness="2" Background="LightGray"
Margin="10" Padding="15,15,15,5">
<StackPanel>
<Image HorizontalAlignment="Center" Source="{Binding Path=Image}" />
<Border HorizontalAlignment="Center" BorderBrush="Navy"
Background="#DDF“ BorderThickness="1" Margin="10" Padding="3">
<TextBlockFontSize="18" TextContent="{Binding Path=Model}" />
</Border>
</StackPanel>
</Border>
</DataTemplate>

Advanced Features

Flexible User Experience Options
Seamless installation & auto-update
Change download progress look & feel
Full screen mode
Out of Browser Experience
Start menu & desktop shortcuts
Internet connection detection

Styling
Resource definition templates to define look & feel

Templating
Replace the ‘parts’ that define the look of a control to create a completely different look, but behavior is the same.

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

OpenFileDialog, SaveFileDialog
Provides native OS experience
Sandboxed API returns safe filename and readable stream
Support for multiple files

HTML/AJAX and .NET integration
webpage
HTML
Silverlight
.NET
language
Javascript
webpage
HTML
HTML
+
Silverlight

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

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

Streaming Media Experience
Cost effective, high quality video for all major browsers
Based on WMA and WMV ecosystem
Media processing tools provided for live and on-demand publishing
Supports HD video encoding
Scales gracefully to lower end hardware
Digital Rights Management support

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

Easy Line of Business Apps
Cost effective, high quality video for all major browsers
Navigation Framework
RIA Data Services

Designer + DeveloperExperience

Designer/Developer Collaboration
=

Tooling
Desktop
Server, Services
Server Win7
Media
& RIA
XAML
Designer
Look, behavior, brand,and emotional connection
Developer
Function, deployment, data,security, operational integrity

Next Steps…
Community Site: http://silverlight.net
Main Product Site: http://www.microsoft.com/silverlight
MSDN Center: http://msdn.microsoft.com/silverlight
Online Forums: http://silverlight.net/forums
Online SDK: http://msdn2.microsoft.com/bb188266.aspx
Top Silverlight Blogs
Tim Sneath: http://blogs.msdn.com/tims
Mike Harsh: http://blogs.msdn.com/mharsh
Joe Stegman: http://blogs.msdn.com/jstegman
Laurence Moroney: http://blogs.msdn.com/webnext
Ernie Booth: http://blogs.msdn.com/ebooth
Follow @MSExpression on Twitter

Clint Edmonson
Architect Evangelist
Microsoft
Email: clinted@microsoft.com
Web: http://www.notsotrivial.net
Twitter: @clinted
Thank you!

Networking

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

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

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

Cross-domain support
<?xmlversion="1.0"?>
<!DOCTYPEcross-domain-policy SYSTEM
"http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<allow-access-fromdomain="*" />
</cross-domain-policy>
2 formats:
Flash policy file
Silverlight policy file
Cross-domain.xml
<?xmlversion="1.0"?>
<access-policy>
<cross-domain-access>
<policy>
<allow-from>
<domainuri="http://customers.shop.com”/>"
<domainuri="http://partner.com/app.xap"/>
</allow-from>
<grant-to>
<grantpath="/sales/serialnumbers.xml" />
<grantpath="/partners"include-subpaths="false"/>
</grant-to>
</policy>
</cross-domain-access>
</access-policy>
clientaccesspolicy.xml

http://www.notsotrivial.net	35
http://fooberry.com	3
http://www.slideshare.net	1

DODN2009 - Jump Start Silverlight

by Clint Edmonson on Aug 31, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

3 Embeds 39

Statistics

DODN2009 - Jump Start Silverlight — Presentation Transcript