Content Index Search

Other layout containers

In addition to the five primary layout panels in Microsoft® Expression Blend™ (canvas, dock, grid, stack, and wrap), there are other layout elements that have an effect on how the elements that they contain are arranged. These layout elements, while useful in certain scenarios, are not optimized to support the more robust user interface (UI) scenarios that the primary layout panels are designed to handle elegantly. You can add these other layout panels to your Expression Blend project by using the Asset Library Asset Library button or the layout container button on the Toolbox. For more information about these layout containers, see the .NET Development section of the Windows Software Development Kit (SDK).


Border is a simple element that draws a border, background, or both around another element. Border takes only one child element. You’ll likely want to want to place a Grid panel or Canvas panel within a Border element so that you can work with multiple child elements.

A Border element.


BulletDecorator is an element that can only take two child elements, which are typically a text string and a glyph (which represents a control such as a check box).

A BulletDecorator element.


A Popup element is a window that renders above all other content in an application but relative to another element. For example, you can use a pop-up as a context menu for an object to provide additional information and options to users. Popup accepts a single child element and positions itself based on a target element. By default, a Popup has a grid panel as its single child element. The grid panel then enables you to work with multiple child elements inside the Popup. In most cases, you will not need to directly create a pop-up yourself because you can instead use a control, such as a menu or combo box, that uses a pop-up in its template. A Popup element has a Placement property that you can set in the Properties panel under Layout. The Placement property determines where the pop-up appears relative to the object used to invoke the pop-up.


A ScrollViewer allows you to enable scrolling of the child elements that it contains. It takes only a single child element, so in most cases you will want to use a layout panel such as a stack panel, canvas panel, or grid panel within it. Each time you add a child element to a ScrollViewer, the new child element will overwrite the existing child element. ScrollViewer is used within the templates of other controls, such as list boxes, to support the scrolling of content. When the content inside a ScrollViewer is too large, you can enable the content to be clipped. You can also control whether scroll bars are disabled, hidden, visible, or automatically shown only when needed.

A ScrollViewer element.


A UniformGrid arranges child elements within equal, or uniform, grid regions. UniformGrid is not a variation of the grid panel; it can be more accurately described as a tiling layout element because it creates equal spacing between each element that it contains, based on the number of rows and columns you specify. You can specify the number of rows and columns under Common Properties in the Properties panel. As you add child elements to a UniformGrid, each element is placed in a region starting from top-left to bottom-right until the UniformGrid is filled. This is useful for a control such as an image list.

A UniformGrid element.


A Viewbox scales all of its child elements similar to a zoom control. Because a view box accept only a single child element, you will typically place a canvas panel or grid panel within it so that you can take advantage of the zoom effect on more than one child element.

Multiple Viewbox elements showing how you can use the viewbox to present different views of the same object or set of objects, such as a zoomed in view or a mirrored view.