Silverlight 101 – Lesson 1 – Video 2 – XAML Overview

In this video we’re going to take a look at the basic structure of XAML from a silverlight perspective. XAML has many potential uses, but is best known till now for its use in developing Windows Presentation Framework user interfaces and similarly Silverlight user interfaces as well as defining some behavior like animation. If you’ve already read Lesson 1 or watched the previous video, you should understand the relationship between the XAML and the rest of the pieces of a silverlight application. Simply put, the XAML you create is declarative code, an XML syntax, that defines the graphical elements. Its interpreted by the silverlight plugin to display those graphical elements on the screen. Interactivity is defined in imperative code, like javascript, VB or C#. This allows a seperation between the interactivity designer, who is typically a graphic designer who also has a sense of sense of motion and interaction between the user and the application and a developer who brings the ability to articulate those complex interactions in code, retrieve and display data from a remote server and so on. The tools that each of these two roles use is important, too … designers will probably use Expression Design and Expression Blend to express their designs and developers will use Visual Studio. We’ll delve into this more in the future.

We’ll look at an example application to study the structure of XAML to better understand some of its qualities and uses. If you already understand XML, you’re 90% of the way there already. In lesson 2, we’ll look at all the graphical elements that can be created and their properties and such, so while the XAML we look at will probably make sense to most developers, there may be a few terms or ideas that we’ll just have to explain in the next lesson. We’ll focus solely on the syntax, the form, the structure of the XAML in this video.

We’ll discuss:

  • the parentCanvas
  • how to declare objects with typical xml syntax
  • containment in XAML objects
  • attributes in the element define the properties and behavior and event handlers … “property attribute syntax”
  • splitting properties into multiple lines to make things more readable
  • some properties are default properties can be defined between the open and close tags for the element … “Content Element Syntax for Properties”
  • some properties require more information because they are complex … lie creating brushes … “Property Element Syntax”
  • “Implicit Collection Syntax” … in some cases, you don’t need to define the collection … its implied.
  • Not all properties are created equally … “dependency properties” or “attached properties” … allows you to assign a value to a property that is not a member property of the object. In this case, Canvas.Top and Canvas.Left and Canvas.ZOrder is not a property of Rectangle, however, it is dependent on an ancestor element … its parent … for its placement. For now, you can take it at its face value … its just how you position a graphical element on a canvas, but internally there’s a bit more to it in regards to resolving values assigned to that property by multiple sources and which one gets the precidence.


« Previous LessonSilverlight 101Next Lesson »

This ship has sailed …

This webpage describes one video of hundreds hosted on this website. HOWEVER …

This video has been removed from our collection.

Read why I decided to keep old pages like this around. Or better yet, visit the home page … its the best place to get started.

About this video:

Duration: 11 Minutes, 5 Seconds
Recorded Using: Silverlight 1.1 Alpha September Refresh

10 Year Anniversary Sale - 30% Off - ENDING SOON!!!    Learn more ...