Professional Documents
Culture Documents
Microsoft Silverlight
Exam 70-506
Copyrighted Material
July 2011
Published by SilverlightShow
Page | 2
Table of Contents
Introduction...................................................................................................................................................................
Goal and approach to getting ready..........................................................................................................................
Chapter 1: Laying Out a User Interface .........................................................................................................................
Arrange content with panels .....................................................................................................................................
Layout in general ...................................................................................................................................................
The Grid .................................................................................................................................................................
Using Silverlight Grid Control ................................................................................................................................
The StackPanel ......................................................................................................................................................
The Canvas.............................................................................................................................................................
The Border .............................................................................................................................................................
The ScrollViewer ....................................................................................................................................................
The ViewBox ..........................................................................................................................................................
Implement and configure core controls ....................................................................................................................
The TextBox (inherits from System.Windows.Controls.Control) ..........................................................................
The Button .............................................................................................................................................................
The TextBlock ........................................................................................................................................................
The CheckBox ........................................................................................................................................................
Content controls ....................................................................................................................................................
Referencing namespaces.......................................................................................................................................
Create user controls ..................................................................................................................................................
UserControl ...........................................................................................................................................................
Control parts..........................................................................................................................................................
Implement a navigation framework ..........................................................................................................................
The Navigation framework ....................................................................................................................................
Display collections of items .......................................................................................................................................
The ItemsControl ...................................................................................................................................................
The ListBox.............................................................................................................................................................
The ComboBox ......................................................................................................................................................
The TreeView .........................................................................................................................................................
The DataGrid .........................................................................................................................................................
Playing media files .....................................................................................................................................................
Page | 3
Page | 4
Page | 5
Page | 6
Page | 7
Page | 8
Introduction
Silverlight is a rapidly evolving technology. Over a time span of 3 years, it has evolved from being a JavaScriptbased platform to a full .NET implementation. With 4 versions released and version 5 in the pipeline at the time
of writing, Silverlight has more versions than .NET! That makes it hard for book writers such as me to keep up
with new features being added.
It seems to me that its also difficult to create and manage exams about Silverlight. For the previous versions of
Silverlight, there werent any exams available. Silverlight 4 is the first version of which an exam is being created. It
was possible to take the beta-exam late 2010; the exam will be officially open in Q1 2011. More information
about the exam can be found here:
http://www.microsoft.com/learning/en/us/Exam.aspx?ID=70-506&Locale=en-us
With this guide, I aim to make the preparation for the exam a bit easier.
Silverlight 4 Unleashed
Silverlight 4 In Action
Microsoft Silverlight 4 Data and Services Cookbook
Pro Business Application with Silverlight 4
On top of that, reading articles and blog posts will help you in passing the exam. In this ebook, I try to create an
extensive list of resources along with some explanation on the topic at hand that contain the information you
need to know. To structure this, well follow the list of topics described by Microsoft on the exam outline page
(http://www.microsoft.com/learning/en/us/Exam.aspx?ID=70-506&Locale=en-us#tab2):
(Small note: the outlined percentages total 99%, so youll probably get 1% for entering your name!)
This ebook is based on SilverlightShow 7-part article series Getting ready for Microsoft Silverlight Exam 70-506.
While the online article series give references to external resources, here we have done our best to include those
resources as full text, so you may enjoy the ebook while travelling, at places with no connection, on your desktop,
etc. For each topic the author Gill Cleeren has picked the resource that best covers the material needed.
Approximately 85% of the resources selected are available in full, the rest of the resources are still included as
links due to lack of copy permissions or inability to reach the the respective authors.
We hope you will enjoy this ebook, and wish you good luck with taking the exam!
Page | 9
Page | 10
Layout in general
Layout controls help building the user interface of Silverlight applications. The class hierarchy for the most
important layout controls is as follows:
System.Object
--System.Windows.DependencyObject
----System.Windows.UIElement
------System.Windows.FrameworkElement
-------- System.Windows.Controls.Viewbox
--------System.Windows.Controls.Border
--------System.Windows.Controls.Panel
----------System.Windows.Controls.Grid
----------System.Windows.Controls.StackPanel
----------System.Windows.Controls.Canvas
--------System.Windows.Controls.Control
----------System.Windows.Controls.ContentControl
------------System.Windows.Controls.ScrollViewer
This topic is covered in the following resource:
Layout controls in Silverlight
Introduction
Layout controls are Silverlight controls which act as containers of other controls. Their main purpose is the
positioning and arranging of their child controls. There are several layout controls: Canvas, StackPanel and Grid
and TabPanel.
Overview
All layout controls derive from the basic abstract class Panel.
Page | 11
There are also four more descendants of the Panel Class: DataGridCellsPresenter,
DataGridColumnHeadersPresenter, DataGridDetailsPresenter, DataGridRowsPresenter. Their purpose is
the positioning of elements in a DataGrid template. They are not standalone controls.
Layout controls inherit the Children collection of type UIElementCollection. Since all elements in this
collection are UIElement objects and the Panel itself derives from UIElement layout controls can be
nested in one another without limitation.
The following example demonstrates the nesting:
Note: to understand this example you should be familiar with all layout controls: Canvas, StackPanel and
Grid
We want to have the following meaningless result (I dont like giving real world examples, I just want to
show you how nesting of layout controls works.):
Page | 12
Page | 13
XAML:
<UserControl x:Class="LayoutControls.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
SilverlightShow.net Powered by CompletIT
Page | 14
Width="400" Height="400">
<Grid x:Name="grMain" ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.Background>
<ImageBrush x:Name="backgroundImageBrush"
Stretch="UniformToFill">
<ImageBrush.ImageSource>
<BitmapImage x:Name="bmpBackground"
UriSource="http://terraristic.net/
photos/Pachydactylus_bibroni/Pachydactylus_bibroni_couple.jpg">
</BitmapImage>
</ImageBrush.ImageSource>
</ImageBrush>
</Grid.Background>
</Grid>
</UserControl>
Using the LinearGradientBrush for a StackPanel Background:
Page | 15
XAML:
<UserControl x:Class="LayoutControls.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300">
<StackPanel x:Name="spLayout">
<Button Margin="30" Width="200" Content="I'm first"></Button>
<Button Margin="30" Width="200" Content="I'm second"></Button>
<Button Margin="30" Width="200" Content="I'm third"></Button>
<StackPanel.Background>
<LinearGradientBrush x:Name="backgroundLinearGradientBrush"
MappingMode="RelativeToBoundingBox" StartPoint="0,0" EndPoint="1,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="Red" Offset="0" />
<GradientStop Color="Orange" Offset="0.167" />
<GradientStop Color="Yellow" Offset="0.333" />
<GradientStop Color="Green" Offset="0.5"/>
<GradientStop Color="Blue" Offset="0.667" />
<GradientStop Color="Indigo" Offset="0.833" />
<GradientStop Color="Violet" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</StackPanel.Background>
</StackPanel>
</UserControl>
Using the RadialGradientBrush for a Canvas Background:
XAML:
<UserControl x:Class="LayoutControls.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
Page | 16
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="300">
<Canvas x:Name="cnvMain">
<Canvas.Background>
<RadialGradientBrush x:Name="backgroundRadialGradientBrush"
MappingMode="RelativeToBoundingBox" Center="0.5, 0.5" RadiusX="0.5"
RadiusY="0.5">
<RadialGradientBrush.GradientStops>
<GradientStop Color="Violet" Offset="0" />
<GradientStop Color="Indigo" Offset="0.167" />
<GradientStop Color="Blue" Offset="0.333" />
<GradientStop Color="Green" Offset="0.5"/>
<GradientStop Color="Yellow" Offset="0.667" />
<GradientStop Color="Orange" Offset="0.833" />
<GradientStop Color="Red" Offset="1" />
</RadialGradientBrush.GradientStops>
</RadialGradientBrush>
</Canvas.Background>
</Canvas>
</UserControl>
Its just amazing how you can use brushes in the XAML without writing a single line in the code behind.
Conclusion
This article covers the key features of the Panel class which are inherited in all layout controls. It targets
the developer who has just started with the Silverlight controls. Any comments are welcome.
Find original article at http://www.silverlightshow.net/items/Layout-controls-in-Silverlight-2-Beta-1.aspx
Page | 17