C# XAML Content and Controls


WPF is a UI (User Interface) framework that excels in displaying visual content. In previous frameworks, different UI controls were specialized for particular purposes, and their visual presentations were more or less fixed.But why should the content of your button be limited to either text or an image? Why shouldn’t you be allowed to have video on your button—or an animation? Or why should it be so difficult to include images or individually colored backgrounds in the items of a list box?

To create controls that don’t have hard-coded limitations, they created two major branches in the class hierarchy tree, from which the controls would derive. They are the following:

• The ContentControl class contains a property called Content that can hold a single element of whatever type of UI content is available in WPF.
• The ItemsControl class contains a property called Items, which is an ordered collection of whatever type of UI content is available in WPF.

In WPF the term control has a more restricted meaning than in previous frameworks. In WPF, a control is a user interface element with which the user can interact. Previously, any UI element on the screen was called a control. The controls derived from these classes give you unprecedented freedom of design. An abridged version of the derivation hierarchy is shown below. It is from the book Illustrated WPF.

hierarchyMajorContentControls

Control Types

WPF’s built-in controls can be grouped roughly into the following categories, according to the book WPF 4.5 Unleashed by Adam Nathan.

  • Content Controls
  • Items Controls
  • Range Controls (text, images and other controls)
  • Everything else

Image Element

The image element simply displays an image. It does not derive from ContentControl or ItemsControl. It’s called an element, rather than a control, because there’s nothing for the user to interact with. The BitmapImage class handles images with the following file extensions: .jpg, .bmp, .png, .tiff, .wdp, and .ico.

Content Controls

Content controls are constrained to containing a single item. All content controls derive from System.Windows.Controls.ContentControls. Since a content control can contain any arbitrary object, the control can contain a large tree of objects. There can be only one direct child.

Three Types of Content Controls

There are three major types of content controls: Buttons, Simple Containers and Containers with Headers. A button is a content control that can be clicked but not double-clicked. The ButtonBase abstract class contains the click event and the logic that defines what it means to be clicked. A click can occur from the mouse’s left button being pressed down then let up, or from the keyboard with the Enter or spacebar key being pressed when the button has the focus. Also ButtonBase also defines the IsPressed property in case you want to act on the pressed state. ButtonBase also has a ClickMode property.

ButtonBase

Several controls derive from ButtonBase: Button, RepeatButton, ToggleButton, CheckBox and RadioButton. For more information on Button, there is a post.

Simple Containers

Simple containers do not have the notion of being clicked like a button. Three of these types are: Label, ToolTip and Frame. Label is an old control that in previous technologies can be used to hold some text. However, because it is a WPF control it can hold arbitrary content in its Content property: a button, a menu and so on.

Containers with Headers

These controls add a customizable header to the main content. These controls derive from a subclass of ContentControl named HeaderContentControl, which adds a header property of type Object. The GroupBox and Expander are controls of this type.

Items Controls

Items Controls are the second of four categories of Controls. All items controls derive from the abstract class ItemsControl which like ContentControl, is a direct subclass of Control. ItemsControl stores its content in an Items property (of type ItemCollection). Each item canbe an arbitrary object that by default gets rendered just as it would inside a content control.

Leave a comment

Your email address will not be published. Required fields are marked *