HeaderedItemsControl Content Model Overview

This content model overview describes the supported content for a HeaderedItemsControl. The MenuItem, TreeViewItem, and ToolBar classes are each a type of HeaderedItemsControl.

This topic contains the following sections.

• HeaderedItemsControl Content Properties
• Using the Header Property
• Using the Items Property
• Using the ItemsSource Property
• Types That Share This Content Model
• Types That Can Contain HeaderedItemsControl Objects
• Related Topics

HeaderedItemsControl Content Properties

A HeaderedItemsControl has the following content properties:

• Header

• Items

• ItemsSource

In the following illustration, Work Days is an example of a TreeViewItem Header; Monday, Tuesday, and Thursday are content Items under the Work Days Header.

Header and Content Example

Using the Header Property

You typically use the Header content for a HeaderedItemsControl to label or identify the primary contents of a control. For example, the contents of the Header of a TreeViewItem appears as a node in the TreeView tree.

The Header property supports both text and UIElement content. In the following illustration, the TreeViewItem headers are buttons.

Headers That Are Buttons

Adding Text Content

The Header property can accept text. The following example shows how to add text content to the Header property of a TreeViewItem.

<TreeViewItem Header="TreeViewItem_1">
 </TreeViewItem>

TreeViewItem TVitem = new TreeViewItem();
TVitem.Header = "MyTreeView";

Adding UIElement Content

The Header property can accept only a single UIElement. Some examples of elements that can be headers are the Button and Canvas elements. The following example shows how to create a Header for a TreeViewItem that is a button.

<TreeViewItem>
  <TreeViewItem.Header>
    <Button>TreeViewItem_2</Button>
  </TreeViewItem.Header>
</TreeViewItem>

TreeViewItem TVitemButton = new TreeViewItem();
Button TVitemHeader = new Button();
TVitemHeader.Content = "TreeViewItem1";
TVitemButton.Header = TVitemHeader;

There are a wide variety of UIElement types that you can use as header content, including the following type families.

• Adorner Types

• ContentControl Types

• Decorator Types

• HeaderedContentControl Types

• HeaderedItemsControl Types

• ItemsControl Types

• Panel Types

• Shape Types

Using the Items Property

The Items property of a HeaderedItemsControl can contain a set of UIElement objects. The following example shows how to use the Items property to add elements to a TreeViewItem.

<TreeViewItem Header="TreeViewItem_1">
  <TreeViewItem.Items>
    <Button>TreeViewItem_1_1</Button>
    <TextBox>TreeViewItem_1_2</TextBox>
  </TreeViewItem.Items>
</TreeViewItem>

TreeViewItem treeViewItems = new TreeViewItem();
treeViewItems.Header = "TreeViewItem_1";

TreeViewItem tvItem2 = new TreeViewItem();
Button aButton = new Button();
aButton.Content = "TreeViewItem_2";
tvItem2.Header = aButton;
treeViewItems.Items.Add(tvItem2 as TreeViewItem);

TreeViewItem tvItem3 = new TreeViewItem();
TextBox myTextBox = new TextBox();
myTextBox.Text = "TreeViewItem1_2";
tvItem3.Header = myTextBox;
treeViewItems.Items.Add(tvItem3 as TreeViewItem);

For more information, see the ItemsControl Content Model Overview.

Using the ItemsSource Property

You can set the ItemsSource property to a collection of items. The following example shows an ObservableCollection that you can use as an ItemsSource.

public class myData: ObservableCollection<string>
{
  public myData()
  {
    Add("TreeViewItem_1");
    Add("TreeViewItem_2");
    Add("TreeViewItem_3");
  }

The following example uses XAML to define a ResourceKey for the collection. The example binds the collection to the ItemsSource for a TreeViewItem control.

<ObjectDataProvider x:Key="myTreeViewData" ObjectType="{x:Type src:myData}"/>

<TreeViewItem Header="My TreeViewItem Example" 
              ItemsSource ="{Binding Source={StaticResource myTreeViewData}}"/>

The following code example shows how to bind the collection to the ItemsSource property of a TreeViewItem.

TreeViewItem TVItemsSource = new TreeViewItem();
TVItemsSource.Header = "My TreeViewItem Example";
Binding bind2objdata = new Binding();
bind2objdata.Source = myListBoxData;
TVItemsSource.SetBinding(TreeViewItem.ItemsSourceProperty, 
                         bind2objdata);

Types That Share This Content Model

The following classes inherit from the HeaderedItemsControl class. You can use these classes to display the content that is described in this overview.

• MenuItem

• TreeViewItem

• ToolBar

Types That Can Contain HeaderedItemsControl Objects

Typically, MenuItem objects are used as child elements of a Menu element; TreeViewItem objects are used as child elements of a TreeView element; and ToolBar objects are used as child elements of a ToolBarTray.

See Also

Concepts

ItemsControl Content Model Overview