Silverlight Flow Layout Control

The Flow Layout Control arranges its elements across then down or vice versa. The layout is automatically adapted to the current container size by changing the number of items displayed in column or rows so that the maximum possible number of elements is visible on screen.

At runtime, end-users can control item order by dragging them to the desired location. They can also resize elements using the separators.

Another important usability feature is support for maximized elements. You can allow end-users to maximize elements within the control's boundaries. For instance, in the Image Gallery module of the Layout Control's Online Demo, you can click any image to maximize it. All other images are automatically arranged into a single row or column. End-users can drag the maximized item to change its alignment and thus the alignment of the bar that shows other elements.

Just like our demo application, you can handle clicks to maximize elements. If this doesn't meet your requirements, you can write a simple handler to respond to any other user action. Note that the Flow Layout Control also supports codeless element maximization. If an element is a group box, you can simply click the Maximize button within its title bar. The same button allows you to revert the element to its original state.

Other features of the Flow Layout Control include the following:

• You can manually specify how to wrap content by specifying which items should be moved to a new row or column.
• The control allows you to arrange elements in a single row or column. In this instance, items are automatically resized to fit the control's height or width, respectively.
• All end-user customization capabilities can be disabled, if required.

To see the Flow Layout Control in action, please visit the Online Demo page.