Dr. Dobb's is part of the Informa Tech Division of Informa PLC

This site is operated by a business or businesses owned by Informa PLC and all copyright resides with them. Informa PLC's registered office is 5 Howick Place, London SW1P 1WG. Registered in England and Wales. Number 8860726.


Channels ▼
RSS

.NET

Properties, Dependency Properties, and WPF


Measure and Arrange

The WPF was conceived early on as supporting automatic sizing and dynamic layout, so it's not surprising to see this mechanism implemented as a fundamental part of WPF architecture.

Layout occurs in two passes, and begins with the highest level element, in this example, the Page. Every element can have zero or more children. Elements that have multiple children go by the generic name of "panel" and are the primary layout mechanisms. The Panel class has several descendants, including DockPanel, StackPanel, WrapPanel, Grid, UniformGrid, and Canvas, which is the panel that lets you position controls and elements with explicit two-dimensional coordinates.

Layout begins with a call to the virtual MeasureOverride method in the top-level element. (This method is defined in FrameworkElement and it has a rather odd name because it essentially replaces a similar method in the UIElement class MeasureCore.) The parameter to this method is an available size. The MeasureOverride method is responsible for calling the Measure method on all its children (if any), which in turn causes a call to the child's own MeasureOverride method. This is how measuring proceeds from the top of the element tree to the bottom.

The Measure method is responsible for determining what size the element should be. When Measure returns, the parent examines the DesiredSize properties of its children and derives a composite size. For example, a StackPanel with a vertical orientation sums the desired heights of all its children.

The second layout pass begins with a call to virtual ArrangeOverride to the top-level element. The parameter indicates a final size for the element. The parent's job is to arrange all its children within that space with a call to each child's Arrange method, which then calls the child's ArrangeOverride method to ripple through the rest of the layout.

Although panels are commonly used to lay out controls and elements within a page or window, they can also be used inside buttons and other controls. For example, a Button might contain a StackPanel, which then contains text and bitmaps.

As the animations are going on inside PropertySettingsDemo.xaml, the StackPanel is continuously rearranging its children based on their changing sizes.


Related Reading


More Insights






Currently we allow the following HTML tags in comments:

Single tags

These tags can be used alone and don't need an ending tag.

<br> Defines a single line break

<hr> Defines a horizontal line

Matching tags

These require an ending tag - e.g. <i>italic text</i>

<a> Defines an anchor

<b> Defines bold text

<big> Defines big text

<blockquote> Defines a long quotation

<caption> Defines a table caption

<cite> Defines a citation

<code> Defines computer code text

<em> Defines emphasized text

<fieldset> Defines a border around elements in a form

<h1> This is heading 1

<h2> This is heading 2

<h3> This is heading 3

<h4> This is heading 4

<h5> This is heading 5

<h6> This is heading 6

<i> Defines italic text

<p> Defines a paragraph

<pre> Defines preformatted text

<q> Defines a short quotation

<samp> Defines sample computer code text

<small> Defines small text

<span> Defines a section in a document

<s> Defines strikethrough text

<strike> Defines strikethrough text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<u> Defines underlined text

Dr. Dobb's encourages readers to engage in spirited, healthy debate, including taking us to task. However, Dr. Dobb's moderates all comments posted to our site, and reserves the right to modify or remove any content that it determines to be derogatory, offensive, inflammatory, vulgar, irrelevant/off-topic, racist or obvious marketing or spam. Dr. Dobb's further reserves the right to disable the profile of any commenter participating in said activities.

 
Disqus Tips To upload an avatar photo, first complete your Disqus profile. | View the list of supported HTML tags you can use to style comments. | Please read our commenting policy.