WPF New Features - 2010 Volume 1

In the latest release of our NetAdvantage® WPF controls, we broaden the most comprehensive UI control toolset available for WPF developers with a new tiling and data card controls so you can create more readable user interfaces. We have also added functionality to the docking manager, built-in spin buttons for masked editor controls, added support for Microsoft® Windows® 7 multi-touch default gestures and more.

xamTilesControl™ - NEW!

xamTilesControl displays content in an animated arrangement of rectangular tiles, sequentially ordered into multiple rows and columns. Your users can then maximize one or more tiles that they wish to focus on, while the other tiles within the control appear minimized along the side of the control. Your users can quickly focus on bringing up this new content at a glance, making this an ideal control for fully at-a-glance access to informative content.

Add and Remove Tiles

You can programmatically add and remove tiles from the Items collection of xamTilesControl. Since it is derived from ItemsControl, you can also data bind xamTilesControl by setting its ItemsSource to any IEnumerable and its Tile instances will be automatically created.

Item Templates

Tiles can be in any one of several different states such as normal, minimized/expanded, minimized and maximized. You can associate a different ItemTemplate with each of these states, for example, to show information at a greater level of detail when in a tile is maximized.

Explicit Tile Layout

There are many different ways you can layout tiles. You can customize the TileLayoutOrder property if you want tiles to layout first horizontally (row major) or vertically (column major). After that, tiles lay themselves out in a number of rows and columns—you can control the minimum and maximum numbers of rows and columns you wish to see. You can also explicitly lay out tiles by specifying a row, column, row span and column span for each tile, allowing them to take up varying sizes on a behind-the-scenes grid layout by setting TileLayoutOrder to UseExplicitRowColumnOnTile.

Tile Settings

You can modify tile settings such as whether to show the tile area splitter, whether to allow tiles to be dragged and/or resized by the user, how to order the layout of maximized tiles, etc. These settings can be modified for normal tiles through the NormalModeSettings property. They can be modified for maximized, minimized and minimized/expanded tiles through the MaximizedModeSettings.

Tile Constraints

You can limit the size (minimum and maximum) of tiles in different states, even limiting the width and height independently of each other. You can allow users to resize the tiles dynamically, but only to these certain limits that you set.

Tile Closing Actions

Users can close tiles by clicking the optional close button (by default, appearing as an X in the upper-right corner of the tile's header). You can choose to either hide these tiles, or remove them completely from your Items collection (if your underlying ItemsSource allows removal of items, otherwise closed tiles will result in hiding the Tile.)

Saving and Loading Layouts

After your users have arranged xamTilesControl to present your content in a way that they like, you can save their layout. Later, when they resuming working with the xamTilesControl, you can restore the layout that they last worked with by loading it back into the control.

Theming

xamTilesControl includes a number of predefined themes that can be readily applied simply by setting the control's Theme property.

xamDataCards™ - NEW!

Built using the same grid bag layout technology described above, xamDataCards is a new card view for presenting all kinds of data in a faceted user interface of concise, compact "cards" similar to that seen in the Contacts folder of Microsoft Outlook® 2007. xamDataCards shares the high-fidelity, animated layout and arrangement functionality from xamTilesControl including spacing, padding, rows and columns and more; we have simply optimized everything for presenting your information as ready-made data cards.

Flat Data-Oriented

xamDataCards has many of the same data-oriented features as the xamDataGrid™ such as:

• selection of data cards, fields and cells
• sorting of cards
• an add a new record card that your users can fill-in with values
• a filter card that your users can fill-in with criteria
• editable cell values
• data binding to flat data
• and more...

Data binding of xamDataCards is as simple as setting its DataSource property to any IEnumerable, or by adding items directly to populate its DataItems collection. Since it is a card-oriented view, it does not display hierarchical data, so if you use a data source containing hierarchical data, only its root-level data will be displayed (any child data is ignored).

Regular Rows and Columns

Data cards lay out along a grid of familiar rows and columns, and because of its grid bag layout foundation you can greatly customize its layout. You can set the maximum number of cards that should appear per column, and per row. You can adjust the spacing that occurs between cards, and the padding between the cards and the outer edge of xamDataCards. You can also control whether xamDataCards lays cards out in row major or column major order by setting its Orientation property to Horizontal or Vertical, respectively.

Completely Resizable

Resizing allows your users to resize cards at run-time by dragging on the edges of a card. Resizing can be limited to width, height or both dimensions. After a resize, cards may rearrange themselves as necessary to maintain their desired layout.

We've implemented an Auto-Fit mode on the ViewSettings whereby all data cards will be made to fit within the available horizontal and/or vertical extents of the control. Alternately, without Auto-Fit, should the data cards require more area to display than is available within the bounds of the control, a scrollbar will appear to allow users to scroll the data cards displayed.

Completely Collapsible

Users can also collapse cards so that only a card's header is visible (this normally displays the primary field value for that data card, making it readily identifiable while taking up the least space on screen). The orientation will affect whether cards reposition themselves to fill empty space left by cards that have been collapsed.

In addition to users collapsing cards, you can also hide empty cells from users. This will cause fewer fields to appear per data card, potentially allowing it to take up less space.

Field Rearrangement

If your users would like to change the arrangement of fields within the data cards, then all they have to do is drag a field to the new position in which they would like it to reside. All data cards are then updated to have the same field layout.

Highlighting& Cards

You can, for example, have the active data card highlighted by magnifying its scale, applying your own transform to it as it becomes the active data card. It can appear using a different template so as to present an additional, deeper level of detail than non-maximized data cards your user is only browsing through. Unlike xamTilesControl, only one data card can appear maximized at a time, so that it is the focus of your user's attention.

xamDataPresenter™ – Enhanced

If you liked data cards in their own standalone control, then we think you will like them even better through the new CardView that we have added to xamDataPresenter. As you know, xamDataPresenter was designed with the extensibility to be your one-stop solution to all manners of data presentation. By adding CardView, your existing XAML containing xamDataPresenter controls can more easily switch over to this new presentation format, without your having to replace the control.

xamDataPresenter supports the ability to create custom views, and comes with these 3 views built-in:

• Grid View – Tabular and hierarchical data grid presentation format just like xamDataGrid
• Carousel View – Animated, path-based carousel presentation format just like xamDataCarousel™
• Card View – Clear, concise data card presentation format just like xamDataCards™

xamDockManager™ - Enhanced

We enhanced the WPF docking manager with a number of your requested features such as working without specifying any content so that its docked panes fill the available area (similar to the behavior of our Windows Forms docking manager).

Layout Mode

The LayoutMode property of xamDockManager can be set to FillContainer to let you have your docked panes fill the available area when no Content is specified. The innermost, root docked SplitPane will fill any remaining area. As your panes are closed, floated or un-pinned, this fill pane will change in size as needed so that the available area remains filled as long as there is one of more visible, docked, pinned ContentPane instances.

An attached property, SplitPane.IsInFillPane will be set on the split pane which is filling the available area, in case you would like to modify its TabGroupPane or ContentPane in order to visually distinguish it from the other panes.

Flyout Behavior

By default, xamDockManager behaves like Microsoft® Visual Studio 2008/2010 whereby an unpinned tab will flyout when the user mouses over the unpinned tab. We have added a new UnpinnedTabHoverAction property that now lets you control whether the unpinned flyout should wait, and only appear in response to an activation (such as by keyboard navigation), button click or command.

Pane Header Button Visibility

We have added 3 new Visibility properties to the ContentPane that allow you to independently hide the Close button, the Pushpin button, and the Window Position menu in the pane's header area.

File Menu Opening

We have added a new bubble routed event to TabGroupPane named FilesMenuOpening. Like the OptionsMenuOpening event on ContentPane, this event fires after the menu items have been created to give you an opportunity to add or remove menu items.

Size and Location now Read/Write

We have made the Size and Location properties on FloatPaneAction and the NewLocation property of MovePaneAction both readable and writable (they were previously read-only). With the PaneDragOver event and the DragAction property on its event argument, you can set values on these properties which will control where a floating pane will be positioned.

xamEditors™ - Enhanced

Now users can rapidly adjust the value shown in any xamMaskedEditor™ or one of its subclasses (which include our numeric, date/time and currency editors) up or down by a configurable amount (the SpinIncrement) using their up- and down-arrow keys or a pair of spin buttons located beside the editor.