Silverlight 5

Silverlight 5 for Line of Business

Jeremy Likness
Project Manager, Senior Consultant Copyright © 2011

jlikness@wintellect.com

consulting training design debugging wintellect.com

what we do
consulting training design debugging

who we are
Founded by top experts on Microsoft – Jeffrey Richter, Jeff Prosise, and John Robbins –
we pull out all the stops to help our customers achieve their goals through advanced
software-based consulting and training solutions.

how we do it Training
• On-site instructor-led training
Consulting & Debugging • Virtual instructor-led training
• Architecture, analysis, and design services • Devscovery conferences
• Full lifecycle custom software development
• Content creation Design
• Project management • User Experience Design
• Debugging & performance tuning • Visual & Content Design
• Video & Animation Production


Agenda
• A Brief History of Silverlight
• Where We Are (Some Case Studies)
• Miscellaneous Post-Beta Features
• Text
• Threading
• Data-Binding
• User Interface
• Custom Markup and Types
• Trusted Applications
• The Third Dimension


A Brief History of Silverlight
• Silverlight 1.0
• 2007
• JavaScript with benefits

“If at first you don’t succeed
… call it version 1.0”


• Silverlight 2.0
• 2008
• Common Language Runtime (CLR)
• Dynamic Language Runtime (DLR)
• Deep Zoom
“The great thing about Object
Oriented code is that it can make
small, simple problems look like
large, complex ones.“


• Silverlight 3.0
• 2009
• 2D-3D (“Perspective”)
• GPU
• Element Binding
• Out of Browser
“Three screens and a cloud … [a]
fundamental shift in the
computing paradigm.“ - Ballmer


• Silverlight 4.0
• 2010
• Web Cam and Microphone
• HTML inside Silverlight
• MEF
• WCF RIA
• COM
• Chrome support
“If brute force doesn't solve your
problems, then you aren't using enough.“


• Silverlight 5.0
• 2011
• Are you kidding me?! That’s what the
rest of this talk is for!

“Computers are incredibly fast,
accurate, and stupid; humans are
incredibly slow, inaccurate and
brilliant; together they are powerful
beyond imagination.” – Albert
Einstein


Where We Are
• 1 million Silverlight developers (Silverlight team blog)
• 70% penetration (RIAStats.com)
• Silverlight Firestarter: DayForce
– “1/4th cost to build Silverlight compared to Java”
– “1/30th total cost due to reduced load on servers”
• Major enterprise adoption, including Fortune 500
companies


Microsoft eScience
“Re-write the existing
Windows Forms
application in both
Silverlight and
WPF, and to
correspondingly re-
create the user
interface design, using
as much of a single
code base as possible.”


2010 Olympics Health Monitoring
“Over 12 petabytes of
data, and at peak loads
streamed 374 gigabits of
video per second and
handled 2.4 million
pages per second. With
82 million mobile page
views, 1.9 million mobile
video streams, and 5,000
hours of live and on-
demand video...”


PriceWaterhousecoopers SharePoint

“Utilize Microsoft’s
Silverlight
technology to
deliver interactive
dashboards and
onscreen
reports, within an
integrated
SharePoint
environment.”


KNFB Blio eReader

“The Blio project
represented a
challenging technical
application for WPF
and even more so for
the Silverlight platform.
An e-reader has a
surprisingly large
degree of complexity
around user
interaction, input, and
rendering.”


Microsoft Looking Glass
“Re-work and enhance the
UI design of the tool as
well as re-migrate the code
fully to Silverlight 4, and
architect the backend code
using the Model-View-
View Model (MVVM)
pattern to support unit
testing, modularity, scalabil
ity, and robustness within
the application. ”


Rooms to Go Silverlight Slate App

“Putting our business applications on the slate device was
very easy. We just identified the applications, the data
used, whipped up the interface and web services and we were
able to do it rather quickly.”


Hooters
“Eliminate Flash
technology from
their main web site
in order to achieve
an approximate
order-of-magnitude
increase in page
load performance.”


Where We are Going


Miscellaneous Post-Beta Features
• WS-Trust
• 64-bit
• Immediate-mode graphics
• Hardware acceleration in windowless mode (IE9)
• Direct access to USB devices
• Microsoft Office integration
• Full keyboard support in full screen
• P/Invoke


Text
• Text overflow areas (multi-column text)
– RichTextBoxOverflow control
– Link RichTextBox to one or more RichTextBoxOverflow
controls and flow text from one to the other
• Controllable character spacing (leading)
– CharacterSpacing property on text-input elements
• Crisper text display via pixel snapping (post-beta)
• Enhanced OpenType support (post-beta)


Text Overflow
“Overflow additional text to this element…”

<RichTextBox FontSize="20"
OverflowContentTarget="{Binding ElementName=ColumnTwo}">
<Paragraph>Blah, blah, blah</Paragraph>
</RichTextBox>
<RichTextBoxOverflow x:Name="ColumnTwo"
Grid.Column="1" OverflowContentTarget="{Binding
ElementName=ColumnThree}"/>
<RichTextBoxOverflow x:Name="ColumnThree"
Grid.Column="2"/>

“I can receive overflow text…”


Character Spacing
<Slider Minimum="1" Maximum="100" Value="2"
x:Name="SpacingSlider" ToolTipService.ToolTip="{Binding
ElementName=SpacingSlider, Path=Value}" Grid.Row="1"
Grid.Column="2"/>

<TextBlock Margin="10" Grid.Row="2" HorizontalAlignment="Stretch"
Grid.ColumnSpan="3" Height="30" CharacterSpacing="{Binding
ElementName=SpacingSlider,Path=Value}"
Text="Keep your eye on the text block. Things may
change here!" VerticalAlignment="Top"/>

“Set the leading spacing to this…”


demo
Text Overflow and Character Spacing


Threading
• Dedicated composition thread
– GPU animations no longer handled on UI thread
– Adapted from Silverlight for Windows Phone
• Decreased network latency
– HttpWebRequest calls removed from UI thread
– Up to 90% less latency according to Microsoft


Composition Thread “Set this…”

“…and this…”

<param name="enableGPUAcceleration" value="true"/>
…
<Rectangle CacheMode="BitmapCache" Width="100" Height="50"
Fill="Red">
<Rectangle.RenderTransform>
<RotateTransform x:Name="SpinLeft" />
</Rectangle.RenderTransform>
</Rectangle> “…and this will run on composition the thread.”

<Storyboard x:Name="LeftSpin">
<DoubleAnimation
Storyboard.TargetName="SpinLeft"
Storyboard.TargetProperty="Angle" From="0" To="360"
Duration="0:0:1" RepeatBehavior="Forever" />
</Storyboard>


demo
Animations on the Composition Thread


Data-Binding
• Style data binding
• Implicit data templates
• Ancestor binding
• Data binding debugging


Style Data Binding
<Themes:MyThemes x:Key="Theme"/>

INotifyPropertyChanged class that exposes brushes, gradients
<Style TargetType="Grid">
<Setter Property="Background" Value="{Binding
GradientBrush,Source={StaticResource Theme}}"/>
</Style>

Implicit style that binds to the theme class


Implicit Data Templates Implied based on the data type

<Grid.Resources>
<DataTemplate DataType="model:Photo">
<Templates:PhotoTemplate/>
</DataTemplate>
<DataTemplate DataType="model:BlogPost">
<Templates:BlogTemplate/>
</DataTemplate>
<DataTemplate DataType="model:Tweet">
<Templates:TweetTemplate/>
</DataTemplate> No ItemTemplate: implied one is used
</Grid.Resources>
<ListBox ItemsSource="{Binding SocialFeed}"
Background="{StaticResource DarkBackground}"/>


Ancestor Binding
<Button Content="Delete Post"
Command="{Binding DataContext.DeleteCommand,
RelativeSource={RelativeSource
AncestorType=Grid,AncestorLevel=3}}"

Bind to the third parent in the visual tree that is a Grid

CommandParameter="{Binding}"/>

Binds to the current data context


Data-Binding Debugging
• Set breakpoints on {Binding} expressions in XAML
• Analyze broken bindings, detect when target is
updated, and more
• Use locals window to analyze binding


demo
Data Binding in Silverlight 5


User Interface
• Click counting
• Text search
• Vector-based printing


Click Counting
private void _ButtonMouseLeftButtonDown(object sender,
MouseButtonEventArgs e)
{ New click count parameter
var text = "Single-click."; on MouseEventArgs
if (e.ClickCount > 1)
text = "Double-click.";
text = "Triple-click.";
text = string.Format("Clicked {0} times", e.ClickCount);
ClickCount.Text = text;
}


Text Search
public class ImageItem
{
public string Path { get; set; }
public string Name { get; set; }
}

<ListBox ItemsSource="{Binding Images}"
TextSearch.TextPath="Name">

When keyboard pressed, will match
first characters of this property


Printing
• Vector-based
• PostScript
• Virtual print view
• No new API, uses older method
• Reduce size/footprint of print buffer
• Elements sent as vectors for better fidelity when
scaled or printed at higher resolutions


demo
Click Count and Text Search


Custom Markup and Types
• Custom markup extensions
– Markup extensions appear in XAML in {}
– Provide more flexibility for extending what XAML does
– Are able to reference the targets to which they are
applied
• Custom types
– ICustomTypeProvider
– “Go the way of reflection…”
– The dynamic types that bind


Custom Markup Inherit MarkupExtension (the Extension word
goes away in XAML)

public class ViewModelGlueExtension : MarkupExtension
Implement this method and return what you need.

public override object ProvideValue(IServiceProvider
serviceProvider)
{ Optionally reach out and grab the target object/property
var ipvt =
serviceProvider.GetService(typeof(IProvideValueTarget))
as IProvideValueTarget;
var targetObject = ipvt.TargetObject;
}
Then reference and use as needed.

DataContext="{jounce:ViewModelGlue
ViewModelName=CustomViewModel}"


Custom Type Provider
Inherit ICustomTypeProvider

public class CustomType : ICustomTypeProvider
Only one method – but this is where the work is!
public Type GetCustomType()
{
return _helper.GetCustomType();
}
Now get your dynamic on!
CustomType.AddProperty(“Age”, typeof(int));
var type = new CustomType();
type.SetPropertyValue(“Age”, 36);

Totally bindable, dude!


demo
Custom Markup Extension and Custom Type Provider


Trusted Applications
• Can now run inside the browser
– Requires permissions (localhost excepted)
– Can host WebBrowser controls in-browser, too
• Can now create multiple windows
– Modeless dialogs, tear-off windows, and more
– Only available to trusted out-of-browser apps
• Can now access entire file system


Child Window
new Window FrameworkElement
{
Content = child,
Width = 450,
Layer on top of other active windows
Height = 400,
Title = title,
TopMost = true,
Visibility = Visibility.Visible
};
Defaults to Collapsed


demo
Child Windows


The Third Dimension
• Silverlight 5 includes robust 3D support
– Hardware (GPU) accelerated
– Immediate-mode XNA-based API
– Built-in shaders/effects coming post-beta
– Supports textures, bump mapping, etc.
• DrawingSurface control represents 3D canvas
– Draw event signals opportunity to redraw
• Requires Shader Model 2.0-compatible hardware
• Requires consent or trust on Windows XP


3D Models
• Models are formed from meshes of 3D triangles
– Define vertices using X-Y-Z coordinates
– Connect vertices to form triangles
– Connect triangles to form meshes
• Triangles can be shaded with colors or textures


demo
The Third Dimension


Resources

• Silverlight 5
http://www.microsoft.com/silverlight/future
• Jounce MVVM/MEF Framework
http://jounce.codeplex.com/
• My Blog & Twitter
http://csharperimage.jeremylikness.com/
@JeremyLikness


Questions?

Jeremy Likness
Project Manager, Senior Consultant
jlikness@wintellect.com


Silverlight 5

More Related Content

What's hot (20)

Similar to Silverlight 5 (20)

Recently uploaded (20)

Silverlight 5

Editor's Notes