#80 – Content Properties and Collection Syntax Express UIElement Containment

September 30, 2010 Leave a comment

Using both a content property and the collection syntax is quite common in XAML and often expresses containment of a collection of UIElement objects in a parent container.

For example, the StackPanel is a parent control, containing a number of child controls:

 <StackPanel>
     <Label Content="A label" Height="28" />
     <Button Content="Click Me" Height="23" />
 </StackPanel>

In this example, containment is expressed by listing the child controls contained in the StackPanel as child elements in XAML.

This containment shorthand is possible for two reasons:

  • StackPanel‘s content property is Children, an UIElementCollection
  • We can specify the members of the UIElementCollection using collection syntax, by listing its members

All containers that inherit from System.Windows.Controls.Panel have Children as their content property–including Grid, StackPanel, Canvas, WrapPanel, etc.

Advertisement

Filed under XAML Tagged with , ,

#79 – Content Properties for Common WPF Types

September 29, 2010 1 Comment

Here is a list of the content properties for some common WPF types.  You can set values for these properties in XAML using one or more child elements directly, rather than having to use the property element syntax.

E.g. Because Text is the content property for a TextBox, you can specify a value for Text as a child element of the TextBox element:

 <TextBox Height="23" Width="120">
     Some text...
 </TextBox>

Here is the list of some common WPF types and their content properties:

  • Button – Content
  • CheckBox – Content
  • ComboBox – Items
  • Grid – Children
  • GridView – Columns
  • GroupBox – Content
  • Label – Content
  • ListBox – Items
  • ListView – Items
  • Page – Content
  • Panel – Children
  • StackPanel – Children
  • TextBox – Text
  • TreeView – Items
  • Window – Content

For a more complete list, see Building A List of Types That Have Content Properties.

Filed under XAML Tagged with ,

#78 – Setting the Value of a Content Property By Setting Child Element

September 28, 2010 3 Comments

You can set the value of a property using an XAML attribute.  Consider setting the Text property of a TextBox using an attribute:

 <TextBox Height="23" Width="120" Text="Eat Muesli!"/>

You can also set the same property value using property element syntax:

 <TextBox Height="23" Width="120">
     <TextBox.Text>
         Eat Muesli!
     </TextBox.Text>
 </TextBox>

There is an even simpler way to specify the value of the Text property.  Because the TextBox class has identified its Text property as a content property, the value of the Text property can be specified directly as the single child of the TextBox XAML element:

 <TextBox Height="23" Width="120">
     Eat Muesli!
 </TextBox>

Filed under XAML Tagged with , ,

#77 – XAML Collection Syntax

September 27, 2010 6 Comments

When setting  a property value in XAML for a property that represents some sort of collection, you can directly specify the children of the collection as a series of elements.

For example, to create some entries in a ListBox, you can do the following:

 <ListBox Height="100" HorizontalAlignment="Left" Margin="64,66,0,0" Name="listBox1" VerticalAlignment="Top" Width="120">
     <ListBox.Items>
         <ListBoxItem Content="Oak"/>
         <ListBoxItem Content="Red Pine"/>
         <ListBoxItem Content="Larch"/>
     </ListBox.Items>
 </ListBox>

The ListBox.Items property is of type ItemCollection, so you might expect to see the tag <ItemCollection> under the property element <ListBox.Items>.  But because the Items property is a collection, you can just list the child elements of the collection directly.

Filed under XAML Tagged with , ,

#76 – Two Types of Elements in XAML

September 26, 2010 Leave a comment

In XML, elements are the things surrounded by angle brackets, < >.  In XAML, there are two types of elements.

An object element declares an instance of a type.

 <Button Name="btnClick" Content="Click Me" Height="23" Width="75"/>

A property element specifies the value of a property.  (Button.Background is the property element in this example).

 <Button.Background>
     <SolidColorBrush Color="RosyBrown"/>
 </Button.Background>

Filed under XAML Tagged with ,

#75 – Sometimes You Must Use Property Element Syntax

September 25, 2010 Leave a comment

In many cases, you can set a property value in XAML using a string value, even though the property being set is a more complex object.  (E.g. Setting Background property to new instance of SolidColorBrush just by indicating color of brush as a string).

But there are cases when the property that you want to set cannot be set using a simple string.  In these cases, you must use the property element syntax.

As an example, you can have a context menu pop up when a button is right-clicked by setting the button’s ContextMenu property.  A context menu can not be described using only a string value, so you must use property element syntax:

<Button Name="btnClick" Content="Click Me" Height="23" Width="75">
    <Button.ContextMenu>
        <ContextMenu>
            <MenuItem Header="Open"/>
            <MenuItem Header="Save"/>
        </ContextMenu>
    </Button.ContextMenu>
</Button>

Filed under XAML Tagged with ,

#74 – Property Element Syntax

September 24, 2010 2 Comments

The simplest way to set property values in XAML is by using attributes.

<Button Content="Click Me" Height="23" Width="75" Background="Red" />

Because the Button.Background property is of type Brush, the string “Red” is actually used to create a new instance of a SolidColorBrush (subtype of Brush), with its Color property set to an RGB value of FF,00,00 (entirely red).

You can also set a property value using property element syntax.  This syntax allows setting a property value using an embedded XAML element of the form TypeName.PropertyName.

You typically use property element syntax for property values that can’t be expressed as strings.

Using the property element syntax, we can set the button’s background to a red brush as follows:

<Button Name="btnClick" Content="Click Me" Height="23" Width="75" Click="Button_Click">
    <Button.Background>
        <SolidColorBrush Color="Red"/>
    </Button.Background>
  </Button>

Filed under XAML Tagged with ,

#73 – Multiple Namespaces Using Prefixes

September 23, 2010 Leave a comment

You can use multiple namespaces in a XAML file, allowing you to use names from multiple namespaces in the same file.

When you use more than one namespace, you need to associate all but one of the namespaces with a prefix, which you use to qualify names belonging to the prefixed namespaces.  You can include one namespace (the default namespace) that does not include a prefix.

In WPF, two namespaces are typically used:

<Application x:Class="WpfApplication1.App"
                 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 StartupUri="MainWindow.xaml">

In this example, the second namespace uses the “x” prefix, declaring the prefix as part of the xmlns attribute.  All names qualified with the “x” prefix, e.g. x:Class, belong to this namespace.

The first namespace in the example does not include a prefix.  All names in the XAML file not qualified with a prefix are assumed to belong to this namespace–e.g. StartupUri.

Filed under XAML Tagged with , ,

#72 – XAML Namespaces

September 22, 2010 Leave a comment

In XAML, a namespace is a collection of names, identified by a URI reference, which are used in XAML documents as element types and attribute names.  (See W3C definition of namespace).

In addition to being just a collection of allowed element and attribute names, a XAML namespace maps this set of names to the corresponding .NET classes in one or more .NET namespaces.

A namespace is uniquely identified by a URI that is typically included as an attribute in the root element in a XAML file, using the xmlns attribute.  The root element must include at least one xmlns attribute.  This attribute defines the namespace that contains definitions of elements and attributes in the XAML file.

The default namespace used in WPF is http://schemas.microsoft.com/winfx/2006/xaml/presentation.

<Window x:Class="WpfApplication1.MainWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             Title="MainWindow" Height="350" Width="525">

See also – XAML Namespaces and Namespace Mapping for WPF XAML

Filed under XAML Tagged with , ,

#71 – XAML Files Have A Single Root Element

September 21, 2010 Leave a comment

Each XAML file has exactly one root element, the outermost XAML element.  In WPF, the root element is typically one of:

  • <Page> – A page of content that can be hosted in a browser (System.Windows.Controls.Page)
  • <Window> – A WPF window (System.Windows.Window)
  • <Application> – A WPF application (System.Windows.Application)
  • <ResourceDictionary> – A collection of resources (System.Windows.ResourceDictionary)
  • <UserControl> – A user-defined control (System.Windows.Controls.UserControl)

Root elements also typically include attributes that indicate the namespace(s) used to interpret the content of the XAML file.

http://msdn.microsoft.com/en-us/library/ms752059.aspx

Filed under XAML Tagged with ,

← Older posts