The ItemsControl paradigm

  • [アーティクル]

So what is an ItemsControl anyway? I think that this might be one of the steeper learning curves coming from Win32 like I did, so I thought that I would write about it.

An ItemsControl is a control that owns items, whether through a collection of them that it owns or through data binding. The most useful form of an ItemsControl is where you bind a collection to ItemsControl.ItemsSource - in this case the ItemsControl will use a template for each item (ItemsControl.ItemTemplate) to create a UIElement for each item in the collection for you. If the collection notifies on change (using INotifyCollectionChanged like ObservableCollection does) then it synchronizes the collection of Items and the collection of UIElements for you.

What does an ItemsControl look like? One of the big differences between WPF and Win32 is that WPF separates presentation, content and logic a lot more than Win32 did. In WPF, you probably won't need code (most of the time, anyway) to alter the presentation of the ItemsControl or its items. You specify that in the XAML. The content is specified through databinding. And the logic can be modified by deriving from ItemsControl (as well as using different elements of your own design in the templates).

In the news view of Microsoft Max, you can see many ItemsControls at work:

  • The list of categories on the left is a ListBox (ListBox derives from Selector, which derives from ItemsControl). It might not look like a listbox, but that is because we used Expression Interactive Designer to spiffy it up.
  • The control that shows you the pages of news is an ItemsControl. It uses a custom panel and more Expression magic to show nice pages.
  • The pages themselves are ItemsControls. Each on of their items is a news article.

So, really an ItemsControl can look like anything you want it to, and behave any way you want it to.

For my next post I think that I will talk about how to customize what an ItemsControl looks like, and how that can make apps look more interesting while still being useful.

Comments

  • Anonymous
    June 02, 2006
    I'd like to use a WrapPanel as the items host for a ListBox.  Is there a straightforward way to tie the item template to the displayed width of the WrapPanel somehow?  I'd like to use an approach where two columns of templated items are displayed in the ListBox. [BenCon: I will try to make a post to explain this in depth. The short answer is yes, you can use a binding statement to make the item template width a value dependent on the width of the ListBox. This will not be good performance, though. You are better off writing a custom Panel if you want to do this performantly. ]

  • Anonymous
    January 05, 2009
    The comment has been removed