Thinking Out Loud

WinForms Data Grid - Merged Column Grouping and Compact Data View (Coming soon in v17.1)

We've been hard at working extending our WinForms Data Grid and in our upcoming release, we'll ship a handful of new features designed to help you create incredibly refined WinForms user interfaces. In this post, I'll focus on the new Compact View and describe the usability virtues of Merged Column Grouping.

Office-Inspired Compact View
 
As you already know, our Grid ships with a number of unique Data Views (Standard, Banded, Tile, WinExplorer, etc). In this release cycle, we've updated the Grid's Tile View so you can deliver user experiences that mimic Microsoft Outlook's Compact View option. As you can see in the image below, this new UI metaphor will give you an entirely new way to display data - one that is more aesthetic, and in many cases, more readable than using a standard column/row UI metaphor.

WinForms Grid Office 365-inspired Compact View

To help illustrate the benefits of the new Compact View, let's take a quick look at the DevAV demo which ships as part of our WinForms distribution. Prior to the availability of our Compact View, the Employees module looked like the following:

WinForms Data Grid Table View

With Compact View enabled (pictured below), the Employee module's evaluation grid is easier to read and able to call attention to important employee attributes (In this case, did the employee get a raise and/or a bonus).

WinForms Data Grid Outlook 365 Compact View

Once we release v17.1, we'll ship a new WinForms Grid Designer to help you create a wide variety of tile based layouts - Our goal is to give you the ability to generate layouts using standard table design logic; divide a tile template into rows and columns and place tile elements onto table cells using drag-and-drop (and of course to merge table cells for more complex layouts). Needless to say, tile elements can then be placed into table cells which will resize proportionally.

Just like Merged Column Grouping described below, the use of the Compact View will be predicated by business needs - Compact View is not superior to a traditional table layout, it's merely meant to augment UI options.

Merged Column Grouping

In addition to the new Compact View option, our upcoming release will allow you to merge the grid's grouped columns by dragging the appropriate column header(s) to the group panel (with the CTRL key pressed) and arrange them across a single "grouping line." Merged grouped columns are a great way to reduce complexity and improve readability within grids that contain multiple group level. To illustrate the virtues of merged groups, let's first look at a grid with a traditional grouping hierarchy...

WinForms Data Grid - Merged Column Grouping Inactive

The data displayed within the grid pictured above has been grouped by the Category column AND the Status column. In the grid below, data has been grouped by the same columns, but instead of nested grouping within the grid's container, the 2 columns are merged into a "joined" group.

WinForms Data Grid Merged Column Grouping Active

The decision to use traditional nested groups versus our new merged column groups is entirely up to you and your users. The flexibility built into our WinForms Data Grid gives you the wherewithal to activate the feature as needed and your end-users the ability to swap from one to the other as business requirements dictate.

=====================================

We'd love to get your feedback on these new features - Tell us what you think and how you might use them in your next WinForms desktop application.
Published Apr 19 2017, 11:28 AM by
Bookmark and Share

Comments

tony hasselbacher

the compact view looks cool. but can each "row" be a different height? (ie, be sized to the contents that are in it. and if the last element is text, and the text being a different number of lines)

April 19, 2017 4:34 PM

Mohamed Al Zayani

good stuff. i noticed that the "Status" icon is not showing in the merged column mode

April 19, 2017 8:10 PM

Christian Peters

Is the merged column grouping working against an EntityInstantFeedbackSource?

April 19, 2017 11:15 PM

Dimitros (DevExpress Support)

@Tony

It will be possible to provide different templates for different rows in v17.1. As for different row heights - we have plans to support this scenario in future releases.

April 20, 2017 12:46 AM

Heiko Mueller

"Templates for rows" - great addition. Can't wait to use it...

April 21, 2017 11:31 AM

Bo Coaten

I agree with Mohamed that each grouped column will need its corresponding icon to display in the header.

April 24, 2017 12:00 PM
LIVE CHAT

Chat is one of the many ways you can contact members of the DevExpress Team.
We are available Monday-Friday between 7:30am and 4:30pm Pacific Time.

If you need additional product information, write to us at info@devexpress.com or call us at +1 (818) 844-3383

FOLLOW US

DevExpress engineers feature-complete Presentation Controls, IDE Productivity Tools, Business Application Frameworks, and Reporting Systems for Visual Studio, along with high-performance HTML JS Mobile Frameworks for developers targeting iOS, Android and Windows Phone. Whether using WPF, ASP.NET, WinForms, HTML5 or Windows 10, DevExpress tools help you build and deliver your best in the shortest time possible.

Copyright © 1998-2017 Developer Express Inc.
All trademarks or registered trademarks are property of their respective owners