2. 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
consulting training design debugging wintellect.com
3. 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
consulting training design debugging wintellect.com
4. A Brief History of Silverlight
• Silverlight 1.0
• 2007
• JavaScript with benefits
“If at first you don’t succeed
… call it version 1.0”
consulting training design debugging wintellect.com
5. A Brief History of Silverlight
• 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.“
consulting training design debugging wintellect.com
6. A Brief History of Silverlight
• 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
consulting training design debugging wintellect.com
7. A Brief History of Silverlight
• 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.“
consulting training design debugging wintellect.com
8. A Brief History of Silverlight
• 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
consulting training design debugging wintellect.com
9. 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
consulting training design debugging wintellect.com
10. 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.”
consulting training design debugging wintellect.com
11. 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...”
consulting training design debugging wintellect.com
12. PriceWaterhousecoopers SharePoint
“Utilize Microsoft’s
Silverlight
technology to
deliver interactive
dashboards and
onscreen
reports, within an
integrated
SharePoint
environment.”
consulting training design debugging wintellect.com
13. 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.”
consulting training design debugging wintellect.com
14. 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. ”
consulting training design debugging wintellect.com
15. 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.”
consulting training design debugging wintellect.com
16. Hooters
“Eliminate Flash
technology from
their main web site
in order to achieve
an approximate
order-of-magnitude
increase in page
load performance.”
consulting training design debugging wintellect.com
17. Where We are Going
consulting training design debugging wintellect.com
18. 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
consulting training design debugging wintellect.com
19. 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)
consulting training design debugging wintellect.com
20. 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…”
consulting training design debugging wintellect.com
21. 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…”
consulting training design debugging wintellect.com
22. demo
Text Overflow and Character Spacing
consulting training design debugging wintellect.com
23. 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
consulting training design debugging wintellect.com
24. 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>
consulting training design debugging wintellect.com
25. demo
Animations on the Composition Thread
consulting training design debugging wintellect.com
26. Data-Binding
• Style data binding
• Implicit data templates
• Ancestor binding
• Data binding debugging
consulting training design debugging wintellect.com
27. 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
consulting training design debugging wintellect.com
28. 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}"/>
consulting training design debugging wintellect.com
29. 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
consulting training design debugging wintellect.com
30. 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
consulting training design debugging wintellect.com
31. demo
Data Binding in Silverlight 5
consulting training design debugging wintellect.com
32. User Interface
• Click counting
• Text search
• Vector-based printing
consulting training design debugging wintellect.com
33. 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.";
if (e.ClickCount > 2)
text = "Triple-click.";
if (e.ClickCount > 3)
text = string.Format("Clicked {0} times", e.ClickCount);
ClickCount.Text = text;
}
consulting training design debugging wintellect.com
34. 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
consulting training design debugging wintellect.com
35. 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
consulting training design debugging wintellect.com
36. demo
Click Count and Text Search
consulting training design debugging wintellect.com
37. 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
consulting training design debugging wintellect.com
38. 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}"
consulting training design debugging wintellect.com
39. 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!
consulting training design debugging wintellect.com
40. demo
Custom Markup Extension and Custom Type Provider
consulting training design debugging wintellect.com
41. 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
consulting training design debugging wintellect.com
42. 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
consulting training design debugging wintellect.com
43. demo
Child Windows
consulting training design debugging wintellect.com
44. 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
consulting training design debugging wintellect.com
45. 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
consulting training design debugging wintellect.com
46. demo
The Third Dimension
consulting training design debugging wintellect.com
47. 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
consulting training design debugging wintellect.com
48. Questions?
Jeremy Likness
Project Manager, Senior Consultant
jlikness@wintellect.com
consulting training design debugging wintellect.com