We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to customize the GridGroupingControl to get the Outlook style?

To customize the GridGroupingControl to the Outlook style, the following properties and events have to be handled in the grid.

 

Step 1: Outlook style theme.

Setting the TableOptions.GridVisualStyles property enables the Outlook-like look and feel. This helps you to customize Office 2007 and other themes. These themes are available in the Syncfusion Essential Studio version 5.1.

In the given code example, customization for Office 2007 themes alone is given.

C#

VB

 

Step 2: GroupCaptionPlusMinusCell Appearance.

The GroupCaptionPlusMinusCell appearance can be customized with an image object. This can be achieved by drawing the customized image over the cell. The GroupExpanded and GroupCollapsed events are handled to draw appropriate images to the cell. Refer to the following KB article for more details.

http://www.syncfusion.com/support/kb/594

 

Step 3: Resizing Columns.

In the Outlook, the columns get proportionally resized to fill the client area. A similar behavior can be achieved by handling the QueryColWidth event. In the QueryColWidth event handler, new proportional column width has to be calculated and assigned to the e.Size property.

 C#

VB

 

Alternate solution for the column sizing

C#

VB

 

Step 4: Additional property setting.

  1. ListBoxSelectionMode: To select the whole row like the Outlook style, the TableOptions.ListBoxSelectionMode property has to be set to SelectionMode.One and the ListBoxSelectionCurrentCellOptions property set to HideCurrentCell to have the same color.

C#

VB

  1.  AddNewRecord: Set the ShowAddNewRecordBeforeDetails and ShowAddNewRecordAfterDetails properties to false to hide the AddNewRecord of the grid.

C#

VB

  1. GridLines: The grid lines are customized by setting the TableModel.Properties.DisplayVertLines to false to hide the vertical grid lines. The horizontal lines are customized by handling the QueryCellStyleInfo event.

C#

VB

In the attached sample, a helper class named ConfigureOutlookStyle is designed to set the property settings.

C#

VB

After applying the properties, the Grid looks like the following screenshot:

Figure 1: Customizing the outlook styles

Sample Links

CS: Outlook

VB: Outlook

Article ID: Published Date: Last Revised Date: Platform: Control:
726 04/30/2011 02/12/2016 Windows Forms GridGroupingControl
Tags:
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon